1
0
mirror of https://github.com/bingohuang/docker-labs.git synced 2025-07-14 01:57:32 +08:00
docker-labs/www/index.html
Alex Ellis 5eda323477 Enable use of override for session timeout in hours, fix captcha bypass bug. (#51)
* - Enable use of override for session timeout. This is more useful than having to hard-code and rebuild the code for the previous 4 hour limit. Just set environmental variable and start the app.
- Future work may involve breaking down into minutes, but this is a good minimum delivery to provide value to end-user/developer.

- Fixes bug in Captcha code by introducing new landing page. This is not a new go template, it's a separate HTML file because SRP - single reponsibility principle. Happy for this to be refacted after merging commit.

- Fix for including Docker 1.12 override has been removed for later PR.

* Merge

* Reinstate 'material' JS include'

* https for JS includes

* HTTPs for JS in bypass
2016-11-30 20:17:18 +02:00

122 lines
6.3 KiB
HTML

<!doctype html>
<html ng-app="DockerPlay" ng-controller="PlayController">
<head>
<title>Docker Playground</title>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,500,700,400italic" />
<link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.css">
<link rel="stylesheet" href="/assets/xterm.css" />
<link rel="stylesheet" href="/assets/style.css" />
</head>
<body>
<div layout="column" style="height:100%;" ng-cloak>
<section id="sessionEnd" layout="row" flex ng-if="!isAlive">
<md-content flex layout-padding ng-if="!instances.length">
<div layout="column" layout-align="top center">
<p>
<strong>Your session has expired.</strong>
</p>
</div>
<div flex></div>
</md-content>
</section>
<section ng-if="!connected" class="disconnected" layout="row" layout-align="center center">
<h1 class="md-headline">No connection to server. Reconnecting...</h1>
<md-progress-circular class="md-hue-2" md-diameter="20px"></md-progress-circular>
</section>
<section id="popupContainer" layout="row" flex ng-if="isAlive">
<md-sidenav
class="md-sidenav-left"
md-component-id="left"
md-is-locked-open="$mdMedia('gt-sm')"
md-whiteframe="4" layout="column">
<md-toolbar class="md-theme-indigo">
<span class="clock">{{ttl}}</span>
<md-button class="md-warn md-raised" ng-click="closeSession()">Close session</md-button>
<h1 class="md-toolbar-tools">Instances</h1>
</md-toolbar>
<md-content layout-padding>
<md-button ng-click="newInstance()" class="md-primary">+ Add new instance</md-button>
<md-list>
<md-list-item ng-switch on="instance.isManager" class="md-3-line" ng-repeat="instance in instances" ng-click="showInstance(instance)" ng-class="instance.name == selectedInstance.name ? 'selected' : false">
<md-icon ng-switch-when="true" style="color: blue" md-svg-icon="person"></md-icon>
<md-icon ng-switch-when="false" md-svg-icon="person-outline"></md-icon>
<p>{{instance.name}}</p>
<md-divider ng-if="!$last"></md-divider>
</md-list-item>
</md-list>
</md-content>
</md-sidenav>
<md-content flex layout-padding ng-if="!instances.length">
<div layout="column" layout-align="top center">
<p>Add instances to your playground.</p>
<p><strong>Sessions and all their instances are deleted after {{ttl}} hours.</strong></p>
</div>
<div flex></div>
</md-content>
<md-content flex layout="column" ng-repeat="instance in instances" ng-show="instance.name == selectedInstance.name">
<md-card md-theme="default" md-theme-watch>
<md-card-title>
<md-card-title-text>
<span class="md-headline">{{instance.name}}</span>
<md-input-container class="md-icon-float md-block">
<label>IP</label>
<input ng-model="instance.ip" type="text" readonly="readonly">
</md-input-container>
<div layout-gt-sm="row">
<md-input-container class="md-block" flex-gt-sm>
<label>Memory</label>
<input ng-model="instance.mem" type="text" readonly="readonly">
</md-input-container>
<md-input-container class="md-block" flex-gt-sm>
<label>CPU</label>
<input ng-model="instance.cpu" type="text" readonly="readonly">
</md-input-container>
</div>
<md-card-title-text>
</md-card-title>
<md-card-actions>
<md-button class="md-warn md-raised" ng-click="deleteInstance(instance)">Delete</md-button>
</md-card-actions>
</md-card>
<md-card flex md-theme="default" md-theme-watch >
<md-card-content flex id="terminal-{{instance.name}}" class="terminal">
</md-card-content>
</md-card>
</md-content>
</section>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-animate.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-aria.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.5.5/angular-messages.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angular_material/1.1.0/angular-material.min.js"></script>
<script src="https://cdn.socket.io/socket.io-1.3.7.js"></script>
<script src="/assets/app.js"></script>
<script src="/assets/xterm.js"></script>
<script src="/assets/xterm-addons/fit.js"></script>
<script src="/assets/attach.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.16.0/moment.min.js"></script>
<script type="text/javascript" charset="utf-8">
window.onbeforeunload = function (e) {
e = e || window.event;
// For IE and Firefox prior to version 4
if (e) {
e.returnValue = 'Make sure you saved your session URL';
}
// For Safari
return 'Make sure you saved your session URL';
};
</script>
</body>
</html>