add auto resizing feature of UI.

static/resources/css/index.css

@@ -1,8 +1,8 @@
 body {
   margin: 0;
   padding: 0;
-  height: 100%;
   width: 100%;
+  height: 100%;  
   position: fixed;
 }
 
@@ -30,9 +30,7 @@ body {
 }
 
 .container-fluid-custom {
-  background-color: #EFEFEF;
+  background-color: #EFEFEF;	
-  max-height: 100%;
-  height: 100%;
   width: 100%;
   min-width: 1px;
   overflow: auto;

static/resources/css/project.css

@@ -1,24 +1,20 @@
 .container-custom {
   position: relative;
-  height: 100%;
+  min-height: 1px;
 }
 
 .extend-height {
   height: 100%;
   min-height: 1px;
   min-width: 1024px;
-  overflow: hidden;
 }
 
 .section {
-  position: relative;
   padding: 15px;
   margin-top: 20px;
   background-color: #FFFFFF;
-  height: 100%;
   width: 100%;
-  min-height: 1px;
+  min-height: 490px;
-  max-height: 100%;
 }
 
 .search-pane {
@@ -42,19 +38,25 @@
 .pane {
   height: auto;
   min-height: 1px;
-  max-height: 600px;
-  overflow-y: auto;
 }
 
 .sub-pane {
   margin: 15px;
-  height: 380px;
+  min-height: 300px;
   overflow-y: auto;
 }
 
 .well-custom {
-  position: relative;
+  position: absolute;
-  width: 100%;
+  width: 1064px;
+  background-color: #f5f5f5;
+  background-image: none;
+  margin: 0 10px;
+  z-index: 10;
+}
+
+.form-custom {
+  margin-top: 1em;
 }
 
 .empty-hint {

static/resources/js/components/element-height/element-height.inspector.js

@@ -0,0 +1,44 @@
+(function() {
+  
+  'use strict';
+  
+  angular
+    .module('harbor.layout.element.height')
+    .directive('elementHeight', elementHeight);
+    
+  function elementHeight($window) {
+    var directive = {
+      'restrict': 'A',
+      'link': link
+    };
+    
+    return directive;
+    
+    function link(scope, element, attrs) {
+      var w = angular.element($window);
+      scope.getDimension = function() {
+        return {'h' : w.height()};
+      };
+
+      if(!angular.isDefined(scope.subsHeight))  scope.subsHeight = 110;
+      if(!angular.isDefined(scope.subsSection))  scope.subsSection = 32;
+      if(!angular.isDefined(scope.subsSubPane)) scope.subsSubPane = 226;
+      if(!angular.isDefined(scope.subsTabPane)) scope.subsTabPane = 226;
+
+      scope.$watch(scope.getDimension, function(current) {
+        if(current) {
+          var h = current.h;
+          element.css({'height' : (h - scope.subsHeight) + 'px'});   
+          element.find('.section').css({'height': (h - scope.subsHeight - scope.subsSection) + 'px'});
+          element.find('.sub-pane').css({'height': (h - scope.subsHeight - scope.subsSubPane) + 'px'});
+          element.find('.tab-pane').css({'height': (h - scope.subsHeight - scope.subsTabPane) + 'px'});
+        }
+      }, true);
+     
+      w.on('pageshow, resize', function() {
+        scope.$apply();
+      });
+    }
+  }
+  
+})();

static/resources/js/components/element-height/element-height.module.js

@@ -0,0 +1,8 @@
+(function() {
+  
+  'use strict';
+  
+  angular
+    .module('harbor.layout.element.height', []);
+  
+})();

static/resources/js/components/log/advanced-search.directive.html

@@ -1,4 +1,4 @@
-<div class="well panel-group">
+<div class="well panel-group well-custom" style="margin-left: 0;">
   <div class="row">
     <div class="col-xs-10 col-md-10">
       <form class="form">

static/resources/js/components/project-member/add-project-member.directive.html

@@ -1,4 +1,4 @@
-<div class="well panel-group">
+<div class="well panel-group well-custom" style="margin: 0;">
   <div class="row">
     <form name="form" class="css-form" novalidate>  
       <div class="col-xs-10 col-md-10">  

static/resources/js/components/project-member/list-project-member.directive.html

@@ -11,9 +11,9 @@
       <button ng-if="vm.isOpen" class="btn btn-default" disabled="disabled" type="button"><span class="glyphicon glyphicon-plus"></span>// 'add_member' | tr //</button>
     </div>
     <div class="pane"> 	           
-      <add-project-member ng-show="vm.isOpen" is-open="vm.isOpen" project-id="//vm.projectId//" reload='vm.search({projectId: vm.projectId, username: vm.username})'></add-project-member>
       <modal-dialog modal-title="// vm.modalTitle //" modal-message="// vm.modalMessage //" confirm-only="true"></modal-dialog>
-      <div class="sub-pane">
+      <add-project-member ng-show="vm.isOpen" is-open="vm.isOpen" project-id="//vm.projectId//" reload='vm.search({projectId: vm.projectId, username: vm.username})'></add-project-member>
+      <div class="sub-pane">  
         <table class="table table-pane" >
     			 <thead>
     			   <th width="30%">// 'username' | tr //</th><th width="40%">// 'role' | tr //</th><th width="30%">// 'operation' | tr //</th>

static/resources/js/components/project/add-project.directive.html

@@ -1,5 +1,5 @@
-<div class="well panel-group">
+<div class="well well-custom">
-  <form name="form" class="css-form" novalidate>
+  <form name="form" class="css-form form-custom" novalidate>
     <div class="row"> 
       <div class="col-xs-10 col-md-10">  
         <div class="form-group col-md-7">               

static/resources/js/components/user/list-user.directive.html

@@ -8,34 +8,33 @@
     </div>
   </div> 
 </div>
-<div class="pane project-pane">
+<modal-dialog modal-title="// 'confirm_to_delete_user_title' | tr //" modal-message="// 'confirm_to_delete_user' | tr //" action="vm.deleteUser()"></modal-dialog>
-  <modal-dialog modal-title="// 'confirm_to_delete_user_title' | tr //" modal-message="// 'confirm_to_delete_user' | tr //" action="vm.deleteUser()"></modal-dialog>
+<div class="sub-pane">     
-  <div class="sub-pane">     
+  <table class="table">
-    <table class="table">
+    <thead>
-      <thead>
+      <th>// 'username' | tr //</th>
-        <th>// 'username' | tr //</th>
+      <th>// 'email' | tr //</th>
-        <th>// 'email' | tr //</th>
+      <th>// 'registration_time' | tr //</th>
-        <th>// 'registration_time' | tr //</th>
+      <th>// 'administrator' | tr //</th>
-        <th>// 'administrator' | tr //</th>
+      <th>// 'operation' | tr //</th>
-        <th>// 'operation' | tr //</th>
+    </thead>
-      </thead>
+    <tbody>
-      <tbody>
+      <tr ng-repeat="u in vm.users">
-        <tr ng-repeat="u in vm.users">
+        <td>//u.username//</td>
-          <td>//u.username//</td>
+        <td>//u.email//</td>
-          <td>//u.email//</td>
+        <td>//u.creation_time | dateL : 'YYYY-MM-DD HH:mm:ss'//</td>
-          <td>//u.creation_time | dateL : 'YYYY-MM-DD HH:mm:ss'//</td>
+        <td>
-          <td>
+          <toggle-admin has-admin-role="u.has_admin_role == 1" user-id="//u.user_id//"></toggle-admin>
-            <toggle-admin has-admin-role="u.has_admin_role == 1" user-id="//u.user_id//"></toggle-admin>
+        </td>
-          </td>
+        <td>
-          <td>
+          &nbsp;&nbsp;<a href="javascript:void(0)" data-toggle="modal" data-target="#myModal" ng-click="vm.confirmToDelete(u.user_id)"><span class="glyphicon glyphicon-trash"></span></a>
-            &nbsp;&nbsp;<a href="javascript:void(0)" data-toggle="modal" data-target="#myModal" ng-click="vm.confirmToDelete(u.user_id)"><span class="glyphicon glyphicon-trash"></span></a>
+        </td>
-          </td>
+      	</tr>
-        	</tr>
+    </tbody>
-      </tbody>
+  </table>
-    </table>
+</div>
-  </div>
+<div class="col-xs-4 col-md-12 well well-sm well-custom">
-  <div class="col-xs-4 col-md-12 well well-sm well-custom">
+  <div class="col-md-offset-10">//vm.users ? vm.users.length : 0// items</div>
-      <div class="col-md-offset-10">//vm.users ? vm.users.length : 0// items</div>
-    </div>
 </div>
 
+

static/resources/js/components/user/list-user.directive.js

@@ -6,11 +6,11 @@
     .module('harbor.user')
     .directive('listUser', listUser);
     
-  ListUserController.$inject = ['ListUserService', 'DeleteUserService'];
+  ListUserController.$inject = ['$scope', 'ListUserService', 'DeleteUserService'];
   
-  function ListUserController(ListUserService, DeleteUserService) {
+  function ListUserController($scope, ListUserService, DeleteUserService) {
     var vm = this;
-    
+        
     vm.username = '';
     vm.searchUser = searchUser;
     vm.deleteUser = deleteUser;
@@ -61,12 +61,16 @@
     var directive = {
       'restrict': 'E',
       'templateUrl': '/static/resources/js/components/user/list-user.directive.html',
-      'scope': true,
+      'link': link,
       'controller': ListUserController,
       'controllerAs': 'vm',
       'bindToController': true
     };
     return directive;
+    
+    function link(scope, element, attrs) {
+      
+    }
   }
   
 })();

static/resources/js/harbor.module.js

@@ -6,6 +6,7 @@
       'ngMessages',
       'ngCookies',
       'harbor.session',
+      'harbor.layout.element.height',
       'harbor.layout.header',
       'harbor.layout.footer',
       'harbor.layout.navigation',

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

@@ -9,6 +9,7 @@
   AccountSettingController.$inject = ['ChangePasswordService', 'UpdateUserService', '$filter', 'trFilter', '$scope', '$window', 'currentUser'];
   
   function AccountSettingController(ChangePasswordService, UpdateUserService, $filter, trFilter, $scope, $window, currentUser) {
+
     var vm = this;
     vm.isOpen = false;
  

static/resources/js/layout/admin-option/admin-option.controller.js

@@ -6,9 +6,11 @@
     .module('harbor.layout.admin.option')
     .controller('AdminOptionController', AdminOptionController);
   
-  AdminOptionController.$inject = [];
+  AdminOptionController.$inject = ['$scope'];
   
-  function AdminOptionController() {
+  function AdminOptionController($scope) {
+    
+    $scope.subsSubPane = 276;   
     var vm = this;
     vm.toggle = false;
     vm.toggleAdminOption = toggleAdminOption;

static/resources/js/layout/dashboard/dashboard.controller.js

@@ -6,8 +6,10 @@
     .module('harbor.layout.dashboard')
     .controller('DashboardController', DashboardController);
   
-  function DashboardController() {
+  DashboardController.$inject = ['$scope'];
   
+  function DashboardController($scope) {
+
   }
   
 })();

static/resources/js/layout/details/details.controller.js

@@ -6,9 +6,11 @@
     .module('harbor.details')
     .controller('DetailsController', DetailsController);
 
-  function DetailsController() {
+  DetailsController.$inject = ['$scope'];
+
+  function DetailsController($scope) {
     var vm = this;
-   
+          
     vm.publicity = false;
     vm.isProjectMember = false;
     

static/resources/js/layout/index/index.controller.js

@@ -6,11 +6,16 @@
     .module('harbor.layout.index')
     .controller('IndexController', IndexController);
     
-  IndexController.$inject = ['$filter', 'trFilter'];
+  IndexController.$inject = ['$scope', '$filter', 'trFilter'];
+    
+  function IndexController($scope, $filter, trFilter) {
+    
+    $scope.subsHeight = 110;
+    $scope.subsSection = 32;
+    $scope.subsSubPane = 226;
     
-  function IndexController($filter, trFilter) {
     var vm = this;
-    
+        
     var indexDesc = $filter('tr')('index_desc', []);
     var indexDesc1 = $filter('tr')('index_desc_1', []);
     var indexDesc2 = $filter('tr')('index_desc_2', []);

static/resources/js/layout/project/project.controller.js

@@ -10,7 +10,7 @@
 
   function ProjectController($scope, ListProjectService, $timeout, currentUser, getRole) {
     var vm = this;
-    
+ 
     vm.isOpen = false;
     vm.projectName = '';
     vm.publicity = 0;
@@ -53,9 +53,9 @@
     
     function showAddProject() {
       if(vm.isOpen){
-        vm.isOpen = false;
+        vm.isOpen = false;        
       }else{
-        vm.isOpen = true;
+        vm.isOpen = true;        
       }
     }
     

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

@@ -6,12 +6,12 @@
     .module('harbor.session')
     .controller('CurrentUserController', CurrentUserController);
  
-  CurrentUserController.$inject = ['CurrentUserService', 'currentUser', '$window'];
+  CurrentUserController.$inject = ['$scope', 'CurrentUserService', 'currentUser', '$window', '$document'];
   
-  function CurrentUserController(CurrentUserService, currentUser, $window) {
+  function CurrentUserController($scope, CurrentUserService, currentUser, $window, $document) {
     
     var vm = this;
-    
+         
     CurrentUserService()
       .then(getCurrentUserComplete)
       .catch(getCurrentUserFailed);

views/account-settings.htm

@@ -1,4 +1,4 @@
-<div class="container-fluid container-fluid-custom" ng-controller="AccountSettingController as vm">
+<div class="container-fluid container-fluid-custom" element-height ng-controller="AccountSettingController as vm">
   <div class="container container-custom">
     <div class="row extend-height">
 	    <div class="section">

views/admin-options.htm

@@ -1,18 +1,16 @@
-<div class="container-fluid container-fluid-custom" ng-controller="AdminOptionController as vm">
+<div class="container-fluid container-fluid-custom" element-height ng-controller="AdminOptionController as vm">
   <div class="container container-custom">
     <div class="row extend-height">
-      <div class="col-xs-12 col-md-12 extend-height">
+	    <div class="section">
-  	    <div class="section">
+		    <h4 class="page-header">
-  		    <h4 class="page-header">
+          <span ng-if="!vm.toggle">// 'users' | tr //</span>
-            <span ng-if="!vm.toggle">// 'users' | tr //</span>
+          <a ng-if="vm.toggle" href="#" ng-click="vm.toggleAdminOption()">// 'users' | tr //</a>
-            <a ng-if="vm.toggle" href="#" ng-click="vm.toggleAdminOption()">// 'users' | tr //</a>
+          <span class="gutter">|</span>
-            <span class="gutter">|</span>
+          <span ng-if="vm.toggle">// 'system_management' | tr //</span>
-            <span ng-if="vm.toggle">// 'system_management' | tr //</span>
+          <a ng-if="!vm.toggle" href="#/destinations" class="title-color" ng-click="vm.toggleAdminOption()">// 'system_management' | tr //</a>
-            <a ng-if="!vm.toggle" href="#/destinations" class="title-color" ng-click="vm.toggleAdminOption()">// 'system_management' | tr //</a>
+        </h4> 
-          </h4> 
+        <list-user ng-if="!vm.toggle"></list-user>
-          <list-user ng-if="!vm.toggle"></list-user>
+        <system-management ng-if="vm.toggle"></system-management>
-          <system-management ng-if="vm.toggle"></system-management>
-        </div>
       </div>
     </div>
   </div>

views/dashboard.htm

@@ -1,4 +1,4 @@
-<div class="container-fluid container-fluid-custom" ng-controller="DashboardController as vm">
+<div class="container-fluid container-fluid-custom" element-height ng-controller="DashboardController as vm">
   <div class="container">
     <div class="row row-custom">
 	    <div class="col-xs-4 col-md-4"> 

views/forgot-password.htm

@@ -1,4 +1,4 @@
-<div class="container-fluid container-fluid-custom" ng-controller="ForgotPasswordController as vm">
+<div class="container-fluid container-fluid-custom" element-height ng-controller="ForgotPasswordController as vm">
   <div class="container container-custom">
     <div class="row extend-height">
 	    <div class="section">

views/index.htm

@@ -1,4 +1,4 @@
-<div class="container-fluid container-fluid-custom" ng-controller="IndexController as vm">
+<div class="container-fluid container-fluid-custom" element-height ng-controller="IndexController as vm">
   <div class="container">
     <div class="row">
       <div class="col-md-4">

views/project.htm

@@ -1,4 +1,4 @@
-<div class="container-fluid container-fluid-custom" ng-controller="ProjectController as vm">
+<div class="container-fluid container-fluid-custom" element-height ng-controller="ProjectController as vm">
   <div class="container container-custom">
     <div class="row extend-height">
       <div class="col-xs-12 col-md-12 extend-height">
@@ -21,8 +21,7 @@
               <button ng-if="vm.isOpen" class="btn btn-default" disabled="disabled" type="button"><span class="glyphicon glyphicon-plus"></span> // 'new_project' | tr //</button>
               <button ng-if="!vm.isOpen" class="btn btn-success" type="button" ng-show="vm.showAddButton()" ng-click="vm.showAddProject()"><span class="glyphicon glyphicon-plus"></span> // 'new_project' | tr //</button>               
     		    </div>    
-          </div>
+          </div> 
-          <div class="pane project-pane">  
             <add-project ng-show="vm.isOpen" is-open="vm.isOpen"></add-project>
             <div class="sub-pane">
       		    <table class="table">
@@ -43,7 +42,6 @@
                 </tbody>
               </table>
             </div>
-          </div>
           <div class="col-xs-4 col-md-12 well well-sm well-custom"><div class="col-md-offset-10">//vm.projects ? vm.projects.length : 0// // 'items' | tr //</div></div>               
   	    </div>
       </div>

views/repository.htm

@@ -1,4 +1,4 @@
-<div class="container-fluid container-fluid-custom" ng-controller="DetailsController as vm">
+<div class="container-fluid container-fluid-custom" element-height ng-controller="DetailsController as vm">
   <div class="container container-custom">
     <div class="row extend-height">
     	  <div class="col-xs-12 col-md-12 extend-height">

views/reset-password.htm

@@ -1,4 +1,4 @@
-<div class="container-fluid container-fluid-custom" ng-controller="ResetPasswordController as vm">
+<div class="container-fluid container-fluid-custom" element-height ng-controller="ResetPasswordController as vm">
   <div class="container container-custom">
     <div class="row extend-height">
 	    <div class="section">

views/search.htm

@@ -1,4 +1,4 @@
-<div class="container-fluid container-fluid-custom" ng-controller="SearchController as vm">
+<div class="container-fluid container-fluid-custom" element-height ng-controller="SearchController as vm">
   <div class="container container-custom">
     <div class="row extend-height">
 	    <div class="section">

views/sections/header-include.htm

@@ -91,6 +91,9 @@
 <script src="/static/resources/js/layout/search/search.module.js"></script>
 <script src="/static/resources/js/layout/search/search.controller.js"></script>
 
+<script src="/static/resources/js/components/element-height/element-height.module.js"></script>
+<script src="/static/resources/js/components/element-height/element-height.inspector.js"></script>
+
 <script src="/static/resources/js/services/i18n/services.i18n.module.js"></script>
 
 {{ if  eq .Lang  "zh-CN" }}

views/sign-up.htm

@@ -1,4 +1,4 @@
-<div class="container-fluid container-fluid-custom" ng-controller="SignUpController as vm">
+<div class="container-fluid container-fluid-custom" element-height ng-controller="SignUpController as vm">
   <div class="container container-custom">
     <div class="row extend-height">
 	    <div class="section">