updates for replacing alert with modal-dialog of UI.

static/resources/js/components/modal-dialog/modal-dialog.directive.html

@@ -9,7 +9,7 @@
       </div>
       <div class="modal-footer">
         <button type="button" class="btn btn-primary" id="btnOk">// 'ok' | tr //</button>
-        <button type="button" class="btn btn-default" data-dismiss="modal">// 'close' | tr //</button>
+        <button type="button" ng-show="!vm.confirmOnly" class="btn btn-default" data-dismiss="modal">// 'close' | tr //</button>
       </div>
     </div><!-- /.modal-content -->
   </div><!-- /.modal-dialog -->

static/resources/js/components/modal-dialog/modal-dialog.directive.js

@@ -10,6 +10,7 @@
   
   function ModalDialogController($scope) {
     var vm = this;
+    vm.confirmOnly = false;
   }
   
   function modalDialog() {
@@ -21,7 +22,8 @@
         'contentType': '@',
         'title': '@',
         'message': '@',
-        'action': '&'
+        'action': '&',
+        'confirmOnly': '@'
       },
       'controller': ModalDialogController,
       'controllerAs': 'vm',
@@ -49,11 +51,22 @@
         }
       });
       
+      scope.$on('showDialog', function(e, val) {
+        console.log('modal-dialog show:' + ctrl.show);
+        if(val) {
+          element.find('#myModal').modal('show');
+        }else{
+          element.find('#myModal').modal('hide');
+        }
+        
+      });
+      
       element.find('#btnOk').on('click', clickHandler);
 
       function clickHandler(e) {
         ctrl.action();
         element.find('#myModal').modal('hide');
+        ctrl.show = false;
       }
     }
   }

static/resources/js/layout/account-setting/account-setting.controller.js

@@ -17,7 +17,7 @@
     
     vm.reset = reset;    
     vm.toggleChangePassword = toggleChangePassword;
-    vm.confirmToUpdate = confirmToUpdate;
+    vm.confirm = confirm;
     vm.updateUser = updateUser;
     vm.cancel = cancel;
     
@@ -39,43 +39,32 @@
       }     
     }
     
-    function confirmToUpdate(user) {     
+    function confirm() {     
-      vm.user = user;
+      $window.location.href = '/dashboard';
-      if(vm.isOpen) {
-        if(vm.user && angular.isDefined(user.oldPassword) && angular.isDefined(user.password)) {
-          vm.modalTitle = $filter('tr')('change_password', []);
-          vm.modalMessage = $filte('tr')('confirm_to_change_password', []);
-          return true;
-        }
-      }else{
-        if(vm.user && angular.isDefined(vm.user.username) && angular.isDefined(vm.user.password) && 
-            angular.isDefined(vm.user.realname)) {
-          vm.modalTitle = $filter('tr')('change_profile', []);
-          vm.modalMessage = $filter('tr')('confirm_to_change_profile', []);
-          return true;
-        }
-      }
-      
-      vm.modalTitle = $filter('tr')('form_is_invalid');
-      vm.modalMessage = $filter('tr')('form_is_invalid_message', []);
-      return false;
     }    
                 
-    function updateUser() {
+    function updateUser(user) {
       if(vm.isOpen){
-        ChangePasswordService(userId, vm.user.oldPassword, vm.user.password)
+        if(user && angular.isDefined(user.oldPassword) && angular.isDefined(user.password)) {
-          .success(changePasswordSuccess)
+          ChangePasswordService(userId, user.oldPassword, user.password)
-          .error(changePasswordFailed);
+            .success(changePasswordSuccess)
+            .error(changePasswordFailed);
+        }
       }else{
-        UpdateUserService(userId, vm.user)
+        if(user && angular.isDefined(user.username) && angular.isDefined(user.password) && 
-          .success(updateUserSuccess)
+            angular.isDefined(user.realname)) {
-          .error(updateUserFailed); 
+          UpdateUserService(userId, user)
-        currentUser.set(vm.user);        
+            .success(updateUserSuccess)
+            .error(updateUserFailed); 
+          currentUser.set(user);        
+        }
       }
     }
     
     function changePasswordSuccess(data, status) {
-      $window.location.href = '/dashboard';
+      vm.modalTitle = $filter('tr')('change_password', []);
+      vm.modalMessage = $filter('tr')('successful_changed_password', []);
+      $scope.$broadcast('showDialog', true);
     }
     
     function changePasswordFailed(data, status) {
@@ -87,7 +76,9 @@
     }
     
     function updateUserSuccess(data, status) {
-      $window.location.href = '/dashboard';
+      vm.modalTitle = $filter('tr')('change_profile', []);
+      vm.modalMessage = $filter('tr')('successful_changed_profile', []);
+      $scope.$broadcast('showDialog', true);
     }
     
     function updateUserFailed(data, status) {

static/resources/js/layout/forgot-password/forgot-password.controller.js

@@ -6,17 +6,20 @@
     .module('harbor.layout.forgot.password')
     .controller('ForgotPasswordController', ForgotPasswordController);
   
-  ForgotPasswordController.$inject = ['SendMailService', '$window'];
+  ForgotPasswordController.$inject = ['SendMailService', '$window', '$scope'];
   
-  function ForgotPasswordController(SendMailService, $window) {
+  function ForgotPasswordController(SendMailService, $window, $scope) {
     var vm = this;
     
     vm.hasError = false;
+    vm.show = false;
     vm.errorMessage = '';
     
     vm.reset = reset;
     vm.sendMail = sendMail;
     
+    vm.confirm = confirm;
+    
     function reset(){
       vm.hasError = false;
       vm.errorMessage = '';
@@ -31,7 +34,7 @@
     }
     
     function sendMailSuccess(data, status) {
-      $window.location.href = '/';
+      $scope.$broadcast('showDialog', true);
     }
     
     function sendMailFailed(data) {
@@ -39,6 +42,12 @@
       vm.errorMessage = data;
       console.log('Failed send mail:' + data);
     }
+    
+    function confirm() {
+      $window.location.href = '/';
+    }
+   
+    
   }
   
 })();

static/resources/js/layout/header/header.controller.js

@@ -6,10 +6,24 @@
     .module('harbor.layout.header')
     .controller('HeaderController', HeaderController);
   
-  HeaderController.$inject = ['$scope', '$window', 'getParameterByName'];
+  HeaderController.$inject = ['$scope', '$window', 'getParameterByName', '$location', 'currentUser'];
   
-  function HeaderController($scope, $window, getParameterByName) {
+  function HeaderController($scope, $window, getParameterByName, $location, currentUser) {
     var vm = this;
+    vm.user = currentUser.get();
+        
+    if(location.pathname === '/dashboard') {
+      vm.defaultUrl = '/dashboard';
+    }else{
+      vm.defaultUrl = '/';
+    }
+    
+    $scope.$watch('vm.user', function(current) {
+      if(current) {
+        vm.defaultUrl = '/dashboard';
+      }
+    });
+    
     if($window.location.search) {
       vm.searchInput = getParameterByName('q', $window.location.search);
       console.log('vm.searchInput at header:' + vm.searchInput);

static/resources/js/layout/sign-up/sign-up.controller.js

@@ -6,13 +6,14 @@
     .module('harbor.layout.sign.up')
     .controller('SignUpController', SignUpController);
  
-  SignUpController.$inject = ['SignUpService', '$window'];
+  SignUpController.$inject = ['$scope', 'SignUpService', '$window'];
   
-  function SignUpController(SignUpService, $window) {
+  function SignUpController($scope, SignUpService, $window) {
     var vm = this;
      
     vm.user = {};
     vm.signUp = signUp;
+    vm.confirm = confirm;
     
     function signUp(user) {
       var userObject = {
@@ -26,17 +27,21 @@
         .success(signUpSuccess)
         .error(signUpFailed);        
     }
+    
    
     function signUpSuccess(data, status) {
       console.log('Signed up successfully:' + status);
-      alert('Signed up successfully');
+      $scope.$broadcast('showDialog', true);
-      $window.location.href = '/';
     }
     
     function signUpFailed(data, status) {
       console.log('Signed up failed.');
     }
     
+    function confirm() {
+      $window.location.href = '/';
+    }
+    
   }
   
 })();

static/resources/js/services/i18n/locale_messages_en-US.js

@@ -9,11 +9,11 @@ var locale_messages = {
   'user_management_and_role_assignment': 'User management and role assignment',
   'why_use_harbor': 'Why use Harbor?',
   'index_desc': 'Project Harbor is to build an enterprise-class, reliable registry server. Enterprises can set up a private registry server in their own environment to improve productivity as well as security. Project Harbor can be used in both development and production environment.',
-  'index_desc_1': 'Security: Keep their intellectual properties within their organizations.',
+  'index_desc_1': '<strong>Security:</strong> Keep their intellectual properties within their organizations.',
-  'index_desc_2': 'Efficiency: A private registry server is set up within the organization\'s network and can reduce significantly the internet traffic to the public service. ',
+  'index_desc_2': '<strong>Efficiency:</strong> A private registry server is set up within the organization\'s network and can reduce significantly the internet traffic to the public service. ',
-  'index_desc_3': 'Access Control: RBAC (Role Based Access Control) is provided. User management can be integrated with existing enterprise identity services like AD/LDAP. ',
+  'index_desc_3': '<strong>Access Control:</strong> RBAC (Role Based Access Control) is provided. User management can be integrated with existing enterprise identity services like AD/LDAP. ',
-  'index_desc_4': 'Audit: All access to the registry are logged and can be used for audit purpose.',
+  'index_desc_4': '<strong>Audit:</strong> All access to the registry are logged and can be used for audit purpose.',
-  'index_desc_5': 'GUI: User friendly single-pane-of-glass management console.',
+  'index_desc_5': '<strong>GUI:</strong> User friendly single-pane-of-glass management console.',
   'view_all': 'View all...',
   'repositories': 'Repositories',
   'project_repo_name': 'Project/Repository Name',
@@ -161,12 +161,15 @@ var locale_messages = {
   'endpoint': 'Endpoint',
   'test_connection': 'Test connection',
   'add_new_destination': 'New Destination',
-  'confirm_to_change_password': 'Are you sure to change your password?',
+  'successful_changed_password': 'Password has been changed successfully.',
   'change_profile': 'Change Profile',
-  'confirm_to_change_profile': 'Are you sure to change your profile?',
+  'successful_changed_profile': 'User profile has been changed successfully.',
   'form_is_invalid': 'Form content is invalid',
   'form_is_invalid_message': 'Form content is invalid, please fill the required fields.',
   'administrator': 'Administrator',
   'popular_repositories': 'Popular Repositories',
-  'harbor_intro_title': 'About Harbor'
+  'harbor_intro_title': 'About Harbor',
+  'mail_has_been_sent': 'Resetting Email has been sent.',
+  'send': 'Send',
+  'successful_signed_up': 'Signed up successfully.'
 };

static/resources/js/services/i18n/locale_messages_zh-CN.js

@@ -9,11 +9,11 @@ var locale_messages = {
   'user_management_and_role_assignment': '用户管理和角色分派',
   'why_use_harbor': '为什么要使用Harbor？',
   'index_desc': 'Harbor是可靠的企业级Registry服务器。企业用户可使用Harbor搭建私有容器Registry服务，提高生产效率和安全度，既可应用于生产环境，也可以在开发环境中使用。',
-  'index_desc_1': '安全: 确保知识产权在自己组织内部的管控之下。',
+  'index_desc_1': '<strong>安全:</strong> 确保知识产权在自己组织内部的管控之下。',
-  'index_desc_2': '效率: 搭建组织内部的私有容器Registry服务，可显著降低访问公共Registry服务的网络需求。',
+  'index_desc_2': '<strong>效率:</strong> 搭建组织内部的私有容器Registry服务，可显著降低访问公共Registry服务的网络需求。',
-  'index_desc_3': '访问控制: 提供基于角色的访问控制，可集成企业目前拥有的用户管理系统（如:AD/LDAP）。',
+  'index_desc_3': '<strong>访问控制:</strong> 提供基于角色的访问控制，可集成企业目前拥有的用户管理系统（如:AD/LDAP）。',
-  'index_desc_4': '审计: 所有访问Registry服务的操作均被记录，便于日后审计。',
+  'index_desc_4': '<strong>审计:</strong> 所有访问Registry服务的操作均被记录，便于日后审计。',
-  'index_desc_5': '管理界面: 具有友好易用图形管理界面。',
+  'index_desc_5': '<strong>管理界面:</strong> 具有友好易用图形管理界面。',
   'view_all': '显示全部...',
   'repositories': '镜像仓库',
   'project_repo_name': '项目/镜像仓库名称',
@@ -160,12 +160,15 @@ var locale_messages = {
   'endpoint_is_required': '终端URL为必填项。',
   'test_connection': '测试连接',
   'add_new_destination': '新建目标',
-  'confirm_to_change_password': '确认要修改密码吗？',
+  'successful_changed_password': '修改密码操作成功。',
   'change_profile': '修改个人信息',
-  'confirm_to_change_profile': '确认要修改个人信息吗？',
+  'successful_changed_profile': '修改个人信息操作成功。',
   'form_is_invalid': '表单内容无效',
   'form_is_invalid_message': '表单内容无效，请填写必填字段。',
   'administrator': '管理员',
   'popular_repositories': '热门镜像仓库',
-  'harbor_intro_title': '关于 Harbor'
+  'harbor_intro_title': '关于 Harbor',
+  'mail_has_been_sent': '重置密码邮件已发送。',
+  'send': '发送',
+  'successful_signed_up': '注册成功。'
 };

static/resources/js/session/session.current-user.js

@@ -19,6 +19,9 @@
     function getCurrentUserComplete(response) {
       if(angular.isDefined(response)) {
         currentUser.set(response.data);  
+        if(location.pathname === '/') {
+          $window.location.href = '/dashboard';
+        }
       }   
     }
     

views/account-settings.htm

@@ -4,7 +4,7 @@
 	    <div class="section">
 		    <h1 class="col-md-12 col-md-offset-2 main-title title-color">// 'account_setting' | tr //</h1>
         <div class="col-md-12 col-md-offset-2 main-content">
-          <modal-dialog title="//vm.modalTitle//" message="//vm.modalMessage//" action="vm.updateUser()"></modal-dialog>
+          <modal-dialog title="//vm.modalTitle//" message="//vm.modalMessage//" action="vm.confirm()" confirm-only="true"></modal-dialog>
           <form name="form" class="css-form form-horizontal" novalidate>              
             <div class="form-group">
               <label for="username" class="col-sm-3 control-label">// 'username' | tr //:</label>
@@ -102,7 +102,7 @@
             </div>
             <div class="form-group">
               <div class="col-md-offset-7 col-md-10">
-                <input type="submit" class="btn btn-primary" ng-click="vm.confirmToUpdate(user)" data-toggle="modal" data-target="#myModal" value="// 'save' | tr //">                    
+                <input type="submit" class="btn btn-primary" ng-click="vm.updateUser(user)" value="// 'save' | tr //">                    
                 <input type="button" class="btn btn-default" ng-click="vm.cancel(form)" value="// 'cancel' | tr //">
               </div>
             </div>  

views/forgot-password.htm

@@ -2,10 +2,11 @@
   <div class="container container-custom">
     <div class="row extend-height">
 	    <div class="section">
+        <modal-dialog title="// 'forgot_password' | tr //" message="// 'mail_has_been_sent' | tr //" confirm-only="true" action="vm.confirm()"></modal-dialog>
 		    <h1 class="col-md-12 col-md-offset-2 main-title title-color">// 'forgot_password' | tr //</h1>
         <div class="row">
           <div class="col-md-12 col-md-offset-2 main-content">
-            <form name="form" class="form-horizontal css-form" ng-submit="form.$valid" >                     
+            <form name="form" class="form-horizontal css-form">                     
               <div class="form-group">
                 <label for="email" class="col-sm-3 control-label">// 'email' | tr //:</label>
                 <div class="col-sm-7">
@@ -17,14 +18,14 @@
                 </div>
               </div>
               <div class="error-message">
-                <div ng-messages="form.uEmail.$error">
+                <div ng-messages="form.$submitted && form.uEmail.$error">
                   <span ng-message="required">// 'email_is_required' | tr //</span>
                 </div>
                 <span ng-show="vm.hasError">// vm.errorMessage | tr //</span>
               </div>
               <div class="form-group">
                 <div class="col-md-offset-8 col-md-10">
-                  <input type="submit" class="btn btn-success" ng-disabled="form.$invalid" ng-click="vm.sendMail(user)" value="Send">                    
+                  <input type="submit" class="btn btn-success" ng-click="form.$valid && vm.sendMail(user)" value="// 'send' | tr //">                    
                 </div>
               </div>  
             </form>

views/header.htm

@@ -1,24 +0,0 @@
-<nav class="navbar navbar-default navbar-custom" ng-controller="HeaderController as vm">
-  <div class="container container-custom">
-    <!-- Brand and toggle get grouped for better mobile display -->
-    <div class="navbar-header">
-      <button type="button" class="navbar-toggle collapsed" data-toggle="collapse" data-target="#bs-harbor-navbar-collapse-1" aria-expanded="false">
-        <span class="sr-only">Toggle navigation</span>
-        <span class="icon-bar"></span>
-      </button>
-      <a class="navbar-brand" href="/main"><img class="img-responsive" src="/static/resources/img/Harbor_Logo_rec.png" alt="Harbor's Logo"/></a>
-    </div>
-    <!-- Collect the nav links, forms, and other content for toggling -->
-    <div class="collapse navbar-collapse" id="bs-harbor-navbar-collapse-1">
-		  <optional-menu current="vm.current"></optional-menu>     
-	    <ul class="nav navbar-nav navbar-right">
-		    <li>
-		      <navigation-header></navigation-header>
-		    </li>
-	      <li>
-	        <search-input search-input='vm.searchInput'></search-input>
-		    </li>
-	    </ul>
-    </div><!-- /.navbar-collapse -->
-  </div><!-- /.container-fluid -->
-</nav>

views/index.htm

@@ -39,18 +39,11 @@
       <div class="col-md-4">
     	    <div class="row">
     	      <div class="down-section">
-              <modal-dialog title="// 'harbor_intro_title' | tr //" message='// vm.message //' content-type="text/html"></modal-dialog>
+              <modal-dialog title="// 'harbor_intro_title' | tr //" message='// vm.message //' content-type="text/html" confirm-only="true"></modal-dialog>
     	        <h4 class="page-header underlined">// 'why_use_harbor' | tr //</h4>
-              <p class="page-content text-justify">
+              <p class="page-content text-justify" style="line-height: 2.5em;">
       			  // 'index_desc' | tr //
         			</p>
-    		      <ul>
-        			  <li class="long-line">▪︎ // 'index_desc_1' | tr //</li>
-        			  <li class="long-line">▪︎ // 'index_desc_2' | tr //</li>
-        			  <li class="long-line">▪︎ // 'index_desc_3' | tr //</li>
-        			  <li class="long-line">▪︎ // 'index_desc_4' | tr //</li>
-        			  <li class="long-line">▪︎ // 'index_desc_5' | tr //</li>
-        			</ul>
     		      <div class="page-content pull-right">
     		        <a href="javascript:void(0);" data-toggle="modal" data-target="#myModal"><span class="glyphicon glyphicon-triangle-right"></span> // 'view_all' | tr //</a>
     		      </div>

views/sections/header-content.htm

@@ -6,7 +6,7 @@
         <span class="sr-only">Toggle navigation</span>
         <span class="icon-bar"></span>
       </button>
-      <a class="navbar-brand" href="/"><img class="img-responsive" src="/static/resources/img/Harbor_Logo_rec.png" alt="Harbor's Logo"/></a>
+      <a class="navbar-brand" href="//vm.defaultUrl//"><img class="img-responsive" src="/static/resources/img/Harbor_Logo_rec.png" alt="Harbor's Logo"/></a>
     </div>
     <!-- Collect the nav links, forms, and other content for toggling -->
     <div class="collapse navbar-collapse" id="bs-harbor-navbar-collapse-1">

views/sign-up.htm

@@ -2,6 +2,7 @@
   <div class="container container-custom">
     <div class="row extend-height">
 	    <div class="section">
+        <modal-dialog title="// 'sign_up' | tr //" message="// 'successful_signed_up' | tr //" confirm-only="true" action="vm.confirm()"></modal-dialog>
 		    <h1 class="col-md-12 col-md-offset-2 main-title title-color">// 'sign_up' | tr //</h1>
         <div class="row">
           <div class="col-md-12 col-md-offset-2 main-content">