IGNITE-843 Reworked login and landing page.
Project: http://git-wip-us.apache.org/repos/asf/ignite/repo Commit: http://git-wip-us.apache.org/repos/asf/ignite/commit/882b4791 Tree: http://git-wip-us.apache.org/repos/asf/ignite/tree/882b4791 Diff: http://git-wip-us.apache.org/repos/asf/ignite/diff/882b4791 Branch: refs/heads/ignite-843 Commit: 882b4791e5bb20559de4be730f07407174557203 Parents: f782cbc Author: vsisko <vsi...@gridgain.com> Authored: Wed Sep 23 16:39:07 2015 +0700 Committer: Alexey Kuznetsov <akuznet...@apache.org> Committed: Wed Sep 23 16:39:07 2015 +0700 ---------------------------------------------------------------------- .../src/main/js/controllers/common-module.js | 28 +++----- .../src/main/js/public/stylesheets/style.scss | 18 +++-- .../src/main/js/views/includes/controls.jade | 27 ++++---- .../src/main/js/views/includes/header.jade | 2 +- .../src/main/js/views/index.jade | 70 +++++++++++++++++--- .../src/main/js/views/login.jade | 62 ----------------- .../main/js/views/templates/agent-download.jade | 2 +- 7 files changed, 96 insertions(+), 113 deletions(-) ---------------------------------------------------------------------- http://git-wip-us.apache.org/repos/asf/ignite/blob/882b4791/modules/control-center-web/src/main/js/controllers/common-module.js ---------------------------------------------------------------------- diff --git a/modules/control-center-web/src/main/js/controllers/common-module.js b/modules/control-center-web/src/main/js/controllers/common-module.js index c193db5..fbc7068 100644 --- a/modules/control-center-web/src/main/js/controllers/common-module.js +++ b/modules/control-center-web/src/main/js/controllers/common-module.js @@ -1830,10 +1830,12 @@ controlCenterModule.controller('activeLink', [ controlCenterModule.controller('auth', [ '$scope', '$modal', '$http', '$window', '$common', '$focus', function ($scope, $modal, $http, $window, $common, $focus) { - $scope.action = 'login'; + $scope.loginAction = 'login'; $scope.userDropdown = [{text: 'Profile', href: '/profile'}]; + $focus('login_user_email'); + if (!$scope.becomeUsed) { if ($scope.user && $scope.user.admin) $scope.userDropdown.push({text: 'Admin Panel', href: '/admin'}); @@ -1844,34 +1846,20 @@ controlCenterModule.controller('auth', [ if ($scope.token && !$scope.error) $focus('user_password'); - // Pre-fetch modal dialogs. - var loginModal = $modal({scope: $scope, templateUrl: '/login', show: false}); - - // Show login modal. - $scope.login = function () { - loginModal.$promise.then(function () { - loginModal.show(); - - $focus('user_email'); - }); - }; - // Try to authorize user with provided credentials. $scope.auth = function (action, user_info) { $http.post('/' + action, user_info) .success(function () { - loginModal.hide(); - $window.location = '/configuration/clusters'; }) - .error(function (data, status) { + .error(function (err, status) { if (status == 403) { - loginModal.hide(); - $window.location = '/password/reset'; } + else if (action == 'login') + $common.showPopoverMessage(undefined, undefined, 'login_user_email', err); else - $common.showError(data, 'top', '#errors-container'); + $common.showPopoverMessage(undefined, undefined, 'signup_user_email', err); }); }; @@ -1882,7 +1870,7 @@ controlCenterModule.controller('auth', [ $common.showInfo('Password successfully changed'); $scope.user_info = {email: data}; - $scope.login(); + $window.location = '/'; }) .error(function (data, state) { $common.showError(data); http://git-wip-us.apache.org/repos/asf/ignite/blob/882b4791/modules/control-center-web/src/main/js/public/stylesheets/style.scss ---------------------------------------------------------------------- diff --git a/modules/control-center-web/src/main/js/public/stylesheets/style.scss b/modules/control-center-web/src/main/js/public/stylesheets/style.scss index 6410f7b..c5bd9f6 100644 --- a/modules/control-center-web/src/main/js/public/stylesheets/style.scss +++ b/modules/control-center-web/src/main/js/public/stylesheets/style.scss @@ -323,16 +323,16 @@ h1, h2, h3, h4, h5, h6 { } } -.modal-body { +.login-footer { + @extend .modal-footer; + margin-left: 20px; margin-right: 20px; } -.block-display-image img { - max-width: 100%; - max-height: 450px; - margin: auto; - display: block; +.modal-body { + margin-left: 20px; + margin-right: 20px; } .greedy { @@ -1255,6 +1255,12 @@ a { } } +.modal-advanced-options { + @extend .advanced-options; + margin-top: 10px; + margin-bottom: 10px; +} + .margin-left-dflt { margin-left: 10px; } http://git-wip-us.apache.org/repos/asf/ignite/blob/882b4791/modules/control-center-web/src/main/js/views/includes/controls.jade ---------------------------------------------------------------------- diff --git a/modules/control-center-web/src/main/js/views/includes/controls.jade b/modules/control-center-web/src/main/js/views/includes/controls.jade index 96e7bda..8bd3ad0 100644 --- a/modules/control-center-web/src/main/js/views/includes/controls.jade +++ b/modules/control-center-web/src/main/js/views/includes/controls.jade @@ -15,19 +15,20 @@ limitations under the License. mixin block-callout(workflowTitle, workflowContent, whatsNextTitle, whatsNextContent) - table.block-callout-parent - tbody - tr(height='100%') - td.block-callout-left(width='50%') - i.fa.fa-check-square.block-callout-header-left - label.block-callout-header-left #{workflowTitle} - ul - li(ng-repeat='item in #{workflowContent}' ng-bind='item') - td.block-callout-right(width='50%') - i.fa.fa-check-square.block-callout-header-right - label.block-callout-header-right #{whatsNextTitle} - ul - li(ng-repeat='item in #{whatsNextContent}' ng-bind-html='item') + .block-callout-parent + table + tbody + tr(height='100%') + td.block-callout-left(width='50%') + i.fa.fa-check-square.block-callout-header-left + label.block-callout-header-left #{workflowTitle} + ul + li(ng-repeat='item in #{workflowContent}' ng-bind='item') + td.block-callout-right(width='50%') + i.fa.fa-check-square.block-callout-header-right + label.block-callout-header-right #{whatsNextTitle} + ul + li(ng-repeat='item in #{whatsNextContent}' ng-bind-html='item') mixin tipField(lines) i.tipField.fa.fa-question-circle(ng-if=lines bs-tooltip='joinTip(#{lines})' type='button') http://git-wip-us.apache.org/repos/asf/ignite/blob/882b4791/modules/control-center-web/src/main/js/views/includes/header.jade ---------------------------------------------------------------------- diff --git a/modules/control-center-web/src/main/js/views/includes/header.jade b/modules/control-center-web/src/main/js/views/includes/header.jade index 2c78d8f..368f61a 100644 --- a/modules/control-center-web/src/main/js/views/includes/header.jade +++ b/modules/control-center-web/src/main/js/views/includes/header.jade @@ -39,4 +39,4 @@ header#header.header a.dropdown-toggle(data-toggle='dropdown' ng-class='{active: isActive("/profile") || isActive("/admin")}' bs-dropdown='userDropdown' data-placement='bottom-right') {{user.username}} span.caret li.nav-login(ng-if='!user') - a(ng-click='login()') Log In + a(href='/') Log In http://git-wip-us.apache.org/repos/asf/ignite/blob/882b4791/modules/control-center-web/src/main/js/views/index.jade ---------------------------------------------------------------------- diff --git a/modules/control-center-web/src/main/js/views/index.jade b/modules/control-center-web/src/main/js/views/index.jade index 999c4f8..6465672 100644 --- a/modules/control-center-web/src/main/js/views/index.jade +++ b/modules/control-center-web/src/main/js/views/index.jade @@ -16,15 +16,65 @@ extends templates/layout +mixin lbl(txt) + label.col-xs-5.col-sm-4.required #{txt} + block container - .row + .row(ng-controller='auth') + .docs-header + h1 + | Apache Ignite Web Console .docs-content - div - p - | Apache Ignite<sup>tm</sup> In-Memory Data Fabric is a high-performance, - | integrated and distributed in-memory platform for computing and transacting on large-scale data - | sets in real-time, orders of magnitude faster than possible with traditional disk-based or flash technologies. - .block-image.block-display-image - img(ng-src='https://www.filepicker.io/api/file/lydEeGB6Rs9hwbpcQxiw' alt='Apache Ignite stack') - .text-center(ng-controller='auth') - button.btn.btn-primary(ng-click='login()' href='#') Configure Now + p Apache Ignite Web Console is utility for the configuration of Apache Ignite<sup>tm</sup> Grid. + p With Apache Ignite Web Console you can: + ul + li Create cluster configurations + li Load metadata from database + li Execute SQL queries + .col-xs-6.col-sm-6.col-md-6(ng-init='loginAction == "login"') + form(name='loginForm') + .modal-body.row + .col-sm-10.col-sm-offset-1 + p(ng-show='loginAction == "password/forgot"') + | That's ok! Simply enter your email below and a reset password link will be sent to you via email. You can then follow that link and select a new password. + .details-row + +lbl('Email:') + .col-xs-7.col-sm-8 + input#login_user_email.form-control(enter-focus-next='login_user_password' type='email' ng-model='user_info.email' placeholder='y...@domain.com' required on-enter='loginAction == "password/forgot" && loginForm.$valid && auth(loginAction, user_info)') + .details-row(ng-show='loginAction != "password/forgot"') + +lbl('Password:') + .col-xs-7.col-sm-8 + input#login_user_password.form-control(type='password' ng-model='user_info.password' placeholder='Password' ng-required='loginAction != "password/forgot"' on-enter='loginAction == "login" && loginForm.$valid && auth(loginAction, user_info)') + .col-xs-6.col-sm-6.col-md-6 + form(name='signupForm') + .modal-body.row + .col-sm-10.col-sm-offset-1 + .details-row + +lbl('Full Name:') + .col-xs-7.col-sm-8 + input#signup_user_name.form-control(enter-focus-next='signup_user_email' type='text' ng-model='user_info.username' placeholder='John Smith' required) + .details-row + +lbl('Email:') + .col-xs-7.col-sm-8 + input#signup_user_email.form-control(enter-focus-next='signup_user_password' type='email' ng-model='user_info.email' placeholder='y...@domain.com' required on-enter='signupForm.$valid && auth("register", user_info)') + .details-row + +lbl('Password:') + .col-xs-7.col-sm-8 + input#signup_user_password.form-control(enter-focus-next='signup_user_confirm' type='password' ng-model='user_info.password' placeholder='Password' required on-enter='signupForm.$valid && auth("register", user_info)') + .details-row + +lbl('Confirm:') + .col-xs-7.col-sm-8 + input#signup_user_confirm.form-control(type='password' ng-model='user_info.confirm' match='user_info.password' placeholder='Confirm password' required on-enter='signupForm.$valid && auth("register", user_info)') + .col-xs-6.col-sm-6.col-md-6 + .col-sm-10.col-sm-offset-1 + .login-footer(ng-show='loginAction == "login"') + a.labelField(ng-click='loginAction = "password/forgot"' on-click-focus='user_email') Forgot password? + button.btn.btn-primary(ng-click='auth(loginAction, user_info)' ng-disabled='loginForm.$invalid') Log In + .login-footer(ng-show='loginAction == "password/forgot"') + a.labelField(ng-click='loginAction = "login"' on-click-focus='user_email') Log In + button.btn.btn-primary(ng-click='auth(loginAction, user_info)' ng-disabled='loginForm.$invalid') Send it to me + .col-xs-6.col-sm-6.col-md-6 + .col-sm-10.col-sm-offset-1 + .login-footer + button#signup.btn.btn-primary(ng-click='auth("register", user_info)' ng-disabled='signupForm.$invalid') Sign In + http://git-wip-us.apache.org/repos/asf/ignite/blob/882b4791/modules/control-center-web/src/main/js/views/login.jade ---------------------------------------------------------------------- diff --git a/modules/control-center-web/src/main/js/views/login.jade b/modules/control-center-web/src/main/js/views/login.jade deleted file mode 100644 index 5356c94..0000000 --- a/modules/control-center-web/src/main/js/views/login.jade +++ /dev/null @@ -1,62 +0,0 @@ -//- - Licensed to the Apache Software Foundation (ASF) under one or more - contributor license agreements. See the NOTICE file distributed with - this work for additional information regarding copyright ownership. - The ASF licenses this file to You under the Apache License, Version 2.0 - (the "License"); you may not use this file except in compliance with - the License. You may obtain a copy of the License at - - http://www.apache.org/licenses/LICENSE-2.0 - - Unless required by applicable law or agreed to in writing, software - distributed under the License is distributed on an "AS IS" BASIS, - WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. - See the License for the specific language governing permissions and - limitations under the License. - -mixin lbl(txt) - label.col-sm-3.required #{txt} - -.modal.center(role='dialog') - .modal-dialog - .modal-content - #errors-container.modal-header.header - button.close(type='button' ng-click='$hide()' aria-hidden='true') × - h1.navbar-brand - a(href='/') Apache Ignite Web Configurator - h4.modal-title(style='padding-right: 55px') Authentication - p(style='padding-right: 55px') Log in or register in order to collaborate - form.form-horizontal(name='loginForm' ng-init='action == "login"') - .modal-body.row - .col-sm-10.col-sm-offset-1 - p(ng-show='action == "password/forgot"') - | That's ok! Simply enter your email below and a reset password link will be sent to you via email. You can then follow that link and select a new password. - .details-row(ng-show='action == "register"') - +lbl('Full Name:') - .col-sm-9 - input#user_name.form-control(enter-focus-next='user_email' type='text' ng-model='user_info.username' placeholder='John Smith' ng-required='action=="register"') - .details-row - +lbl('Email:') - .col-sm-9 - input#user_email.form-control(enter-focus-next='user_password' type='email' ng-model='user_info.email' placeholder='y...@domain.com' required on-enter='action == "password/forgot" && loginForm.$valid && auth(action, user_info)') - .details-row(ng-show='action != "password/forgot"') - +lbl('Password:') - .col-sm-9 - input#user_password.form-control(enter-focus-next='user_confirm' type='password' ng-model='user_info.password' placeholder='Password' ng-required='action != "password/forgot"' on-enter='action == "login" && loginForm.$valid && auth(action, user_info)') - .details-row(ng-if='action == "register"') - +lbl('Confirm:') - .col-sm-9 - input#user_confirm.form-control(type='password' ng-model='user_info.confirm' match='user_info.password' placeholder='Confirm password' ng-required='action == "register"' on-enter='loginForm.$valid && auth(action, user_info)') - .modal-footer(ng-show='action == "register"') - a.labelField(ng-click='action = "password/forgot"' on-click-focus='user_email') Forgot password? - a.labelLogin(ng-click='action = "login"' on-click-focus='user_email') Log In - button#signup.btn.btn-primary(ng-click='auth(action, user_info)' ng-disabled='loginForm.$invalid') Sign Up - - .modal-footer(ng-show='action == "password/forgot"') - a.labelField(ng-click='action = "login"' on-click-focus='user_email') Log In - button#forgot.btn.btn-primary(ng-click='auth(action, user_info)' ng-disabled='loginForm.$invalid') Send it to me - - .modal-footer(ng-show='action == "login"') - a.labelField(ng-click='action = "password/forgot"' on-click-focus='user_email') Forgot password? - a.labelLogin(ng-click='action = "register"' on-click-focus='user_name') Sign Up - button#login.btn.btn-primary(ng-click='auth(action, user_info)' ng-disabled='loginForm.$invalid') Log In http://git-wip-us.apache.org/repos/asf/ignite/blob/882b4791/modules/control-center-web/src/main/js/views/templates/agent-download.jade ---------------------------------------------------------------------- diff --git a/modules/control-center-web/src/main/js/views/templates/agent-download.jade b/modules/control-center-web/src/main/js/views/templates/agent-download.jade index ddd3890..082c551 100644 --- a/modules/control-center-web/src/main/js/views/templates/agent-download.jade +++ b/modules/control-center-web/src/main/js/views/templates/agent-download.jade @@ -36,7 +36,7 @@ li Refer to b README.txt | for more information. - .advanced-options + .modal-advanced-options i.fa.fa-chevron-circle-up(ng-show='agentLoad.showToken' ng-click='agentLoad.showToken = ! agentLoad.showToken') i.fa.fa-chevron-circle-down(ng-show='!agentLoad.showToken' ng-click='agentLoad.showToken = ! agentLoad.showToken') a(ng-click='agentLoad.showToken = ! agentLoad.showToken') {{agentLoad.showToken ? 'Hide security token...' : 'Show security token...'}}