Add k8s styles
This commit is contained in:
marcos
@@ -5,11 +5,11 @@ defaults
|
|||||||
frontend http-in
|
frontend http-in
|
||||||
bind *:8080
|
bind *:8080
|
||||||
|
|
||||||
acl host_localhost hdr(host) localhost
|
acl host_direct hdr_reg(host) -i ^.*\.direct\..*?:?.*$
|
||||||
acl host_direct_localhost hdr_reg(host) -i ^.*\.direct\.localhost?:?.*$
|
|
||||||
|
|
||||||
use_backend pwd if host_localhost
|
use_backend l2 if host_direct
|
||||||
use_backend l2 if host_direct_localhost
|
|
||||||
|
default_backend pwd
|
||||||
|
|
||||||
backend pwd
|
backend pwd
|
||||||
server node1 pwd:3000
|
server node1 pwd:3000
|
||||||
|
|||||||
@@ -531,9 +531,12 @@
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
}])
|
}])
|
||||||
.config(['$mdIconProvider', '$locationProvider', function($mdIconProvider, $locationProvider) {
|
.config(['$mdIconProvider', '$locationProvider', '$mdThemingProvider', function($mdIconProvider, $locationProvider, $mdThemingProvider) {
|
||||||
$locationProvider.html5Mode({enabled: true, requireBase: false});
|
$locationProvider.html5Mode({enabled: true, requireBase: false});
|
||||||
$mdIconProvider.defaultIconSet('../assets/social-icons.svg', 24);
|
$mdIconProvider.defaultIconSet('../assets/social-icons.svg', 24);
|
||||||
|
$mdThemingProvider.theme('kube')
|
||||||
|
.primaryPalette('grey')
|
||||||
|
.accentPalette('grey');
|
||||||
}])
|
}])
|
||||||
.component('settingsIcon', {
|
.component('settingsIcon', {
|
||||||
template : "<md-button class='md-mini' ng-click='$ctrl.onClick()'><md-icon class='material-icons'>settings</md-icon></md-button>",
|
template : "<md-button class='md-mini' ng-click='$ctrl.onClick()'><md-icon class='material-icons'>settings</md-icon></md-button>",
|
||||||
|
|||||||
252
www/k8s/index.html
Normal file
252
www/k8s/index.html
Normal file
@@ -0,0 +1,252 @@
|
|||||||
|
<!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|Material+Icons" />
|
||||||
|
<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/xterm-addons/fullscreen.css" />
|
||||||
|
<link rel="stylesheet" href="/assets/style.css" />
|
||||||
|
<script>
|
||||||
|
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
|
||||||
|
(i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
|
||||||
|
m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
|
||||||
|
})(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
|
||||||
|
ga('create', 'UA-89019737-1', 'auto');
|
||||||
|
ga('send', 'pageview');
|
||||||
|
</script>
|
||||||
|
</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-theme="kube"
|
||||||
|
md-is-locked-open="$mdMedia('gt-sm')"
|
||||||
|
md-whiteframe="4" layout="column">
|
||||||
|
|
||||||
|
<md-toolbar class="md-accent md-hue-3">
|
||||||
|
<span class="clock">{{ttl}}</span>
|
||||||
|
<md-button class="md-warn md-raised" ng-click="closeSession()">Close session</md-button>
|
||||||
|
<div class="md-toolbar-tools">
|
||||||
|
<h1 class="md-toolbar-tools">Instances</h1>
|
||||||
|
<settings-icon></settings-icon><br/>
|
||||||
|
</div>
|
||||||
|
<div class="md-toolbar-tools" ng-if="playground.allow_windows_instances">
|
||||||
|
<md-switch ng-model="type.windows">
|
||||||
|
Windows containers {{windows}}
|
||||||
|
</md-switch>
|
||||||
|
</div>
|
||||||
|
</md-toolbar>
|
||||||
|
<md-content layout-padding>
|
||||||
|
<md-button ng-click="newInstance()" ng-disabled="isInstanceBeingCreated" class="md-primary">{{newInstanceBtnText}}</md-button>
|
||||||
|
<md-list class="md-dense" flex>
|
||||||
|
<md-list-item ng-switch on="instance.isManager || instance.isK8sManager" class="md-2-line" ng-repeat="instance in instances | orderBy:'hostname'" 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>
|
||||||
|
<div class="md-list-item-text" layout="column">
|
||||||
|
<h3>{{instance.ip}}</h3>
|
||||||
|
<h4>{{instance.hostname}}</h4>
|
||||||
|
</div>
|
||||||
|
<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" ngf-drop class="drop-box" ngf-drag-over-class="'dragover'" ngf-max-size="100000000" ngf-change="uploadFiles($files, $invalidFiles)" ngf-multiple="true">
|
||||||
|
<md-card class="stats" md-theme="default" md-theme-watch>
|
||||||
|
<md-card-title>
|
||||||
|
<md-card-title-text>
|
||||||
|
<span class="md-headline">{{instance.name}}</span>
|
||||||
|
</md-card-title-text>
|
||||||
|
</md-card-title>
|
||||||
|
<md-card-content>
|
||||||
|
<div layout-gt-sm="row">
|
||||||
|
<md-input-container class="md-icon-float md-block">
|
||||||
|
<label>IP</label>
|
||||||
|
<input ng-model="instance.ip" type="text" readonly="readonly">
|
||||||
|
</md-input-container>
|
||||||
|
<md-chips ng-model="instance.ports" name="port" readonly="true" md-removable="false">
|
||||||
|
<md-chip-template>
|
||||||
|
<strong><a href="{{getProxyUrl(instance, $chip)}}" title="{{getProxyUrl(instance, $chip)}}" target="_blank">{{$chip}}</a></strong>
|
||||||
|
</md-chip-template>
|
||||||
|
</md-chips>
|
||||||
|
<md-chips ng-model="instance.swarmPorts" name="port" readonly="true" md-removable="false">
|
||||||
|
<md-chip-template>
|
||||||
|
<strong><a href="{{getProxyUrl(instance, $chip)}}" title="{{getProxyUrl(instance, $chip)}}" target="_blank">{{$chip}}</a></strong>
|
||||||
|
</md-chip-template>
|
||||||
|
</md-chips>
|
||||||
|
</div>
|
||||||
|
<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-content>
|
||||||
|
<md-card-actions>
|
||||||
|
<md-button class="md-warn md-raised" ng-click="deleteInstance(instance)" ng-disabled="isInstanceBeingDeleted">{{deleteInstanceBtnText}}</md-button>
|
||||||
|
</md-card-actions>
|
||||||
|
</md-card>
|
||||||
|
<md-card flex md-theme="default" md-theme-watch >
|
||||||
|
<div ng-show="uploadMessage" class="uploadStatus">
|
||||||
|
<md-progress-linear md-mode="determinate" value="{{uploadProgress}}"></md-progress-linear>
|
||||||
|
<div class="bottom-block">
|
||||||
|
<span>{{uploadMessage}}</span>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div ng-show="instance.status=='reconnect'" class="uploadStatus">Connection has been lost. Sometimes this happens when a windows instance is joining a swarm. Trying to reconnect terminal...</div>
|
||||||
|
<md-card-content flex id="terminal-{{instance.name}}" class="terminal-container">
|
||||||
|
</md-card-content>
|
||||||
|
</md-card>
|
||||||
|
</md-content>
|
||||||
|
</section>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
|
<script type="text/ng-template" id="settings-modal.html">
|
||||||
|
<md-toolbar md-theme="kube">
|
||||||
|
<div class="md-toolbar-tools">
|
||||||
|
<h2>Settings</h2>
|
||||||
|
<span flex></span>
|
||||||
|
<md-button class="md-icon-button" ng-click="$ctrl.close()">
|
||||||
|
<md-icon class="material-icon" aria-label="Close dialog">close</md-icon>
|
||||||
|
</md-button>
|
||||||
|
</div>
|
||||||
|
</md-toolbar>
|
||||||
|
|
||||||
|
<md-dialog-content>
|
||||||
|
<div class="md-dialog-content" style="width:600px;">
|
||||||
|
<div layout="row">
|
||||||
|
<div flex="50">
|
||||||
|
<md-input-container class="md-block" flex-gt-sm>
|
||||||
|
<label>Keyboard Shortcut Preset</label>
|
||||||
|
<md-select ng-model="$ctrl.currentShortcutConfig" ng-model-options="{getterSetter: true}" placeholder="Keyboard shortcut prefix">
|
||||||
|
<md-option ng-repeat="preset in $ctrl.keyboardShortcutPresets" value="{{preset}}">
|
||||||
|
{{preset.name}}
|
||||||
|
</md-option>
|
||||||
|
</md-select>
|
||||||
|
</md-input-container>
|
||||||
|
</div>
|
||||||
|
<div flex="10"></div>
|
||||||
|
<div flex="40">
|
||||||
|
<div ng-if="$ctrl.selectedShortcutPreset">
|
||||||
|
Preset details:
|
||||||
|
<ul>
|
||||||
|
<li ng-if="$ctrl.selectedShortcutPreset.presets.length == 0">No presets defined</li>
|
||||||
|
<li ng-repeat="preset in $ctrl.selectedShortcutPreset.presets">
|
||||||
|
<code>{{preset.command}}</code> - {{preset.description}}
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div layout="row">
|
||||||
|
<div flex="50">
|
||||||
|
<md-input-container class="md-block" flex-gt-sm>
|
||||||
|
<label>Instance Image</label>
|
||||||
|
<md-select ng-model="$ctrl.currentDesiredInstanceImage" ng-model-options="{getterSetter: true}" placeholder="New Instance Image">
|
||||||
|
<md-option ng-repeat="image in $ctrl.instanceImages" value="{{image}}">
|
||||||
|
{{ image }}
|
||||||
|
</md-option>
|
||||||
|
</md-select>
|
||||||
|
</md-input-container>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<div layout="row">
|
||||||
|
<div flex="50">
|
||||||
|
<md-input-container class="md-block" flex-gt-sm>
|
||||||
|
<label>Terminal Font Size</label>
|
||||||
|
<md-select ng-model="$ctrl.currentTerminalFontSize" ng-model-options="{getterSetter: true}">
|
||||||
|
<md-option ng-repeat="size in $ctrl.terminalFontSizes" value="{{size}}">
|
||||||
|
{{ size }}
|
||||||
|
</md-option>
|
||||||
|
</md-select>
|
||||||
|
</md-input-container>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
</md-dialog-content>
|
||||||
|
|
||||||
|
<md-dialog-actions layout="row">
|
||||||
|
<span flex></span>
|
||||||
|
<md-button ng-click="$ctrl.close()">
|
||||||
|
Close
|
||||||
|
</md-button>
|
||||||
|
</md-dialog-actions>
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/reconnecting-websocket/1.0.0/reconnecting-websocket.min.js" integrity="sha256-A4JwlcDvqO4JXpvEtvWY1RH8JAEMu5W21wP8GUXLUNs=" crossorigin="anonymous"></script>
|
||||||
|
<script
|
||||||
|
src="https://code.jquery.com/jquery-3.2.1.min.js"
|
||||||
|
integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
|
||||||
|
crossorigin="anonymous"></script>
|
||||||
|
|
||||||
|
<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://cdnjs.cloudflare.com/ajax/libs/danialfarid-angular-file-upload/12.2.13/ng-file-upload-all.min.js" integrity="sha256-LrZq3efIkFX0BooX7x/rjWyYDvMKfFV2HJpy6HBw7cE=" crossorigin="anonymous"></script>
|
||||||
|
|
||||||
|
|
||||||
|
<script src="/assets/app.js"></script>
|
||||||
|
<script src="/assets/xterm.js"></script>
|
||||||
|
<script src="/assets/xterm-addons/fit.js"></script>
|
||||||
|
<script src="/assets/xterm-addons/fullscreen.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>
|
||||||
|
|
||||||
153
www/k8s/landing.html
Normal file
153
www/k8s/landing.html
Normal file
@@ -0,0 +1,153 @@
|
|||||||
|
|
||||||
|
<!DOCTYPE html>
|
||||||
|
<html lang="en" ng-app="PWDLanding" ng-controller="LoginController">
|
||||||
|
<head>
|
||||||
|
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular.min.js"></script>
|
||||||
|
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.6/angular-cookies.js"></script>
|
||||||
|
<meta charset="utf-8">
|
||||||
|
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
|
||||||
|
<meta name="description" content="">
|
||||||
|
<meta name="author" content="">
|
||||||
|
|
||||||
|
<title>Play with Kubernetes</title>
|
||||||
|
|
||||||
|
<!-- Bootstrap core CSS -->
|
||||||
|
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css" integrity="sha384-/Y6pD6FV/Vv2HJnA6t+vslU6fwYXjCFtcEpHbNJ0lyAFsXTsjBbfaDjzALeQsN6M" crossorigin="anonymous">
|
||||||
|
|
||||||
|
<!-- Custom styles for this template -->
|
||||||
|
<link href="/assets/landing.css" rel="stylesheet">
|
||||||
|
|
||||||
|
</head>
|
||||||
|
|
||||||
|
<body>
|
||||||
|
|
||||||
|
<div class="container">
|
||||||
|
<div class="header clearfix">
|
||||||
|
<nav>
|
||||||
|
<ul class="nav nav-pills float-right">
|
||||||
|
<li class="nav-item">
|
||||||
|
<a class="nav-link" href="https://github.com/play-with-docker/play-with-docker">Contribute</a>
|
||||||
|
</li>
|
||||||
|
</ul>
|
||||||
|
</nav>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="jumbotron" ng-cloak>
|
||||||
|
<img src="https://zdnet2.cbsistatic.com/hub/i/r/2015/07/21/bb0de0fc-5d9c-47c3-96dd-42ed50858fdb/resize/370xauto/8999227b80cc063f94a76f2b628b0499/kubernetes-logo.png" />
|
||||||
|
<h1 class="display-3">Play with Kubernetes</h1>
|
||||||
|
<p class="lead">A simple, interactive and fun playground to learn Kuberentes</p>
|
||||||
|
<div ng-hide="loggedIn" class="btn-group" role="group">
|
||||||
|
<button id="btnGroupDrop1" type="button" class="btn btn-primary dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
|
||||||
|
Login
|
||||||
|
</button>
|
||||||
|
<div class="dropdown-menu" aria-labelledby="btnGroupDrop1">
|
||||||
|
<a ng-repeat="provider in providers" class="dropdown-item" ng-click="login(provider)">{{provider}}</a>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
<form id="landingForm" method="POST" action="/">
|
||||||
|
<p ng-show="loggedIn"><a class="btn btn-lg btn-success" href="#" ng-click="start()" role="button">Start</a></p>
|
||||||
|
<input id="stack" type="hidden" name="stack" value=""/>
|
||||||
|
<input id="stack_name" type="hidden" name="stack_name" value=""/>
|
||||||
|
<input id="image_name" type="hidden" name="image_name" value=""/>
|
||||||
|
</form>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div class="row marketing">
|
||||||
|
<div class="col-lg-12">
|
||||||
|
<p>Play with Kuberentes (PWK) is a project hacked by <a href="https://www.twitter.com/marcosnils">Marcos Lilljedahl</a> and <a href="https://www.twitter.com/xetorthio">Jonathan Leibiusky</a> and sponsored by Docker Inc.</p>
|
||||||
|
<p>PWK is a K8s playground which allows users to run K8s clusters in a matter of seconds. It gives the experience of having a free Alpine Linux Virtual Machine in browser. Under the hood Docker-in-Docker (DinD) is used to give the effect of multiple VMs/PCs.</p>
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<footer class="footer">
|
||||||
|
<p>© Play with K8s 2017</p>
|
||||||
|
</footer>
|
||||||
|
|
||||||
|
</div>
|
||||||
|
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
|
||||||
|
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.11.0/umd/popper.min.js" integrity="sha384-b/U6ypiBEHpOf/4+1nzFpr53nxSS+GLCkfwBdFNTxtclqqenISfwAzpKaMNFNmj4" crossorigin="anonymous"></script>
|
||||||
|
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js" integrity="sha384-h0AbiXch4ZDo7tp9hKZ4TsHbi047NrKGLO3SEJAg45jXxnGIfYzk4Si90RDIqNm1" crossorigin="anonymous"></script>
|
||||||
|
<script>
|
||||||
|
angular.module('PWDLanding', [])
|
||||||
|
.controller('LoginController', ['$scope', '$http', '$window', function($scope, $http, $window) {
|
||||||
|
$scope.providers = [];
|
||||||
|
$scope.loggedIn = false;
|
||||||
|
$scope.user = null;
|
||||||
|
|
||||||
|
function checkLoggedIn() {
|
||||||
|
$http({
|
||||||
|
method: 'GET',
|
||||||
|
url: '/users/me'
|
||||||
|
}).then(function(response) {
|
||||||
|
$scope.user = response.data;
|
||||||
|
$scope.loggedIn = true;
|
||||||
|
}, function(response) {
|
||||||
|
console.log('ERROR', response);
|
||||||
|
$scope.user = null;
|
||||||
|
$scope.loggedIn = false;
|
||||||
|
});
|
||||||
|
}
|
||||||
|
|
||||||
|
checkLoggedIn();
|
||||||
|
|
||||||
|
$http({
|
||||||
|
method: 'GET',
|
||||||
|
url: '/oauth/providers'
|
||||||
|
}).then(function(response) {
|
||||||
|
$scope.providers = response.data;
|
||||||
|
if ($scope.providers.length == 0) {
|
||||||
|
$scope.loggedIn = true;
|
||||||
|
}
|
||||||
|
}, function(response) {
|
||||||
|
console.log('ERROR', response);
|
||||||
|
});
|
||||||
|
|
||||||
|
|
||||||
|
$scope.login = function(provider) {
|
||||||
|
var width = screen.width*0.6;
|
||||||
|
// fixed height as the login window is not responsive
|
||||||
|
var height = 620;
|
||||||
|
var x = screen.width/2 - width/2;
|
||||||
|
var y = screen.height/2 - height/2;
|
||||||
|
$window.open('/oauth/providers/' + provider + '/login', 'PWDLogin', 'width='+width+',height='+height+',left='+x+',top='+y);
|
||||||
|
var eventMethod = window.addEventListener ? "addEventListener" : "attachEvent";
|
||||||
|
var eventer = window[eventMethod];
|
||||||
|
var messageEvent = eventMethod == "attachEvent" ? "onmessage" : "message";
|
||||||
|
// Listen to message from child window
|
||||||
|
eventer(messageEvent,function(e) {
|
||||||
|
if (e.data === 'done') {
|
||||||
|
checkLoggedIn();
|
||||||
|
}
|
||||||
|
}, false);
|
||||||
|
}
|
||||||
|
|
||||||
|
$scope.start = function() {
|
||||||
|
function getParameterByName(name, url) {
|
||||||
|
if (!url) url = window.location.href;
|
||||||
|
name = name.replace(/[\[\]]/g, "\\$&");
|
||||||
|
var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
|
||||||
|
results = regex.exec(url);
|
||||||
|
if (!results) return null;
|
||||||
|
if (!results[2]) return '';
|
||||||
|
return decodeURIComponent(results[2].replace(/\+/g, " "));
|
||||||
|
}
|
||||||
|
|
||||||
|
var stack = getParameterByName('stack');
|
||||||
|
if (stack) {
|
||||||
|
document.getElementById('stack').value = stack;
|
||||||
|
}
|
||||||
|
var stackName = getParameterByName('stack_name');
|
||||||
|
if (stackName) {
|
||||||
|
document.getElementById('stack_name').value = stackName;
|
||||||
|
}
|
||||||
|
var imageName = getParameterByName('image_name');
|
||||||
|
if (imageName) {
|
||||||
|
document.getElementById('image_name').value = imageName;
|
||||||
|
}
|
||||||
|
document.getElementById('landingForm').submit();
|
||||||
|
}
|
||||||
|
}]);
|
||||||
|
</script>
|
||||||
|
</body>
|
||||||
|
</html>
|
||||||
|
|
||||||
Reference in New Issue
Block a user