refactored structures and added project member interactions.

static/ng/resources/js/components/details/add-member.directive.html

@@ -0,0 +1,27 @@
+<div class="well panel-group">
+  <div class="row">
+    <div class="col-xs-10 col-md-10">
+      <form>  
+        <div class="form-group">               
+          <input type="text" class="form-control" id="addUsername" placeholder="Username">
+        </div>
+      </form>
+      <form class="form-inline clearfix">
+        <div class="form-group">
+          <label for="roleIdList">Role:</label>&nbsp;&nbsp;
+          <input type="radio" name="roleId" value="1">&nbsp;Project Admin&nbsp;&nbsp;
+          <input type="radio" name="roleId" value="2">&nbsp;Developer&nbsp;&nbsp;
+          <input type="radio" name="roleId" value="3">&nbsp;Guest
+        </div>
+      </form>
+    </div>
+    <div class="col-xs-2 col-md-2"> 
+      <form>                        
+        <div class="form-group" style="margin-top: 20%;">               
+          <button type="button" class="btn btn-default" id="btnCancel">Cancel</button>
+          <button type="button" class="btn btn-primary" id="btnSave">Save</button>     
+        </div>
+      </form>
+    </div>
+  </div>
+</div>

static/ng/resources/js/components/details/add-member.directive.js

@@ -0,0 +1,28 @@
+(function() {
+  
+  'use strict';
+  
+  angular
+    .module('harbor.details')
+    .directive('addMember', addMember);
+    
+  function AddMemberController() {
+    var vm = this;
+    
+  }
+  
+  function addMember() {
+    var directive = {
+      'restrict': 'E',
+      'templateUrl': '/static/ng/resources/js/components/details/add-member.directive.html',
+      'scope': {
+        
+      },
+      'controller': AddMemberController,
+      'controllerAs': 'vm',
+      'bindToController': true
+    }
+    return directive;
+  }
+  
+})();

static/ng/resources/js/components/details/details.config.js

@@ -14,8 +14,8 @@
         controllerAs: 'vm'
        })
       .when('/users', {
-        templateUrl: '/static/ng/resources/js/layout/user/user.controller.html',
+        templateUrl: '/static/ng/resources/js/layout/project-member/project-member.controller.html',
-        controller: 'UserController',
+        controller: 'ProjectMemberController',
         controllerAs: 'vm'
       })
       .when('/logs', {

static/ng/resources/js/components/details/switch-roles.directive.html

@@ -1,6 +1,6 @@
 <ng-switch on="vm.editMode">
   <span ng-switch-default>//vm.currentRole.name//</span>
-  <select ng-switch-when="true" >
+  <select ng-switch-when="true">
-    <option value="//role.id//" ng-click="vm.selectRole(role)" ng-repeat="role in vm.roles">//role.name//</option>
+    <option value="//role.id//" ng-selected="//role.id == vm.currentRole.id//" ng-click="vm.selectRole(role)" ng-repeat="role in vm.roles">//role.name//</option>
   </select>
 </ng-switch>

static/ng/resources/js/components/details/switch-roles.directive.js

@@ -39,13 +39,18 @@
         'roles': '=',
         'editMode': '=',
         'userId': '=',
-        'roleId': '=',
+        'roleId': '='
       },
+      'link' : link,
       'controller' : SwitchRolesController,
       'controllerAs': 'vm',
       'bindToController': true
     };
     return directive;
+    
+    function link(scope, element, attrs, ctrl) {
+     
+    }
   } 
   
 })();

static/ng/resources/js/components/project-member/add-project-member.controller.js

@@ -3,7 +3,7 @@
   'use strict';
   
   angular
-    .module('harbor.projectmember')
+    .module('harbor.project.member')
     .controller('AddProjectMemberController', AddProjectMemberController);
     
   AddProjectMemberController.$inject = ['AddProjectMemberService'];

static/ng/resources/js/components/project-member/delete-project-member.controller.js

@@ -3,7 +3,7 @@
   'use strict';
   
   angular
-    .module('harbor.projectmember')
+    .module('harbor.project.member')
     .controller('DeleteProjectMemberController', DeleteProjectMemberController);
     
   DeleteProjectMemberController.$inject = ['DeleteProjectMemberService'];

static/ng/resources/js/components/project-member/edit-project-member.directive.html

@@ -1,10 +1,8 @@
-<td>user1</td>
+<td style="padding: 15px;">user1</td>
 <td><switch-roles roles="vm.roles" edit-mode="vm.editMode" user-id="vm.userId" role-id="vm.roleId"></switch-roles></td>
 <td>
   <a href="javascript:;" ng-click="vm.update({roleId: vm.roleId})">
-    <ng-switch on="vm.editMode">
+      <span ng-if="!vm.editMode" class="glyphicon glyphicon-pencil"></span><span ng-if="vm.editMode" class="glyphicon glyphicon-ok"></span>
-      <span ng-switch-default class="glyphicon glyphicon-pencil"></span>&nbsp;&nbsp;
-      <span ng-switch-when="true" class="glyphicon glyphicon-ok"></span>
     </ng-switch>
   </a>
   <a href="#"><span class="glyphicon glyphicon-trash"></span></a>

static/ng/resources/js/components/project-member/edit-project-member.directive.js

@@ -3,7 +3,7 @@
   'use strict';
   
   angular
-    .module('harbor.projectmember')
+    .module('harbor.project.member')
     .constant('roles', roles)
     .directive('editProjectMember', editProjectMember);
   
@@ -29,7 +29,6 @@
       }else {
         vm.editMode = true;
       } 
-      vm.roleId = e.roleId;
     }
     
   }
@@ -37,16 +36,21 @@
   function editProjectMember() {
     var directive = {
       'restrict': 'A',
-      'templateUrl': '/static/ng/resources/js/components/projectmember/edit-projectmember.directive.html',
+      'templateUrl': '/static/ng/resources/js/components/project-member/edit-project-member.directive.html',
       'scope': {
         'userId': '=',
         'roleId': '='
       },
+      'link': link,
       'controller': EditProjectMemberController,
       'controllerAs': 'vm',
       'bindToController': true
     };
     return directive;
+    
+    function link(scope, element, attrs) {
+
+    }
   }
 
 })();

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

@@ -0,0 +1,26 @@
+<div class="tab-pane" id="users">
+  <div class="col-xs-12 col-md-12 each-tab-pane">
+    <div class="form-inline">
+      <div class="input-group">
+        <input type="text" class="form-control" placeholder="" size="30">
+        <span class="input-group-btn">
+          <button class="btn btn-primary" type="button"><span class="glyphicon glyphicon-search"></span></button>
+        </span>
+      </div>
+      <button class="btn btn-success" type="button" ng-click="vm.addMember()"><span class="glyphicon glyphicon-plus"></span>Add Member</button>
+    </div>
+    <div class="pane"> 	           
+      <add-member ng-show="vm.isOpen"></add-member>
+      <div class="sub-pane">
+        <table class="table table-pane" >
+    			 <thead>
+    			   <th width="30%">Username</th><th width="40%">Role</th><th width="30%">Operation</th>
+    			 </thead>
+    			 <tbody>
+            <tr ng-repeat="pr in vm.projectMembers" edit-project-member user-id="pr.id" role-id="pr.roleId"></tr> 
+          </tbody>
+    		</table>
+      </div>
+    </div>
+  </div>              
+</div>

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

@@ -0,0 +1,52 @@
+(function() {
+
+  'use strict';
+  
+  angular
+    .module('harbor.project.member')
+    .constant('mockupProjectMembers', mockupProjectMembers)
+    .directive('listProjectMember', listProjectMember);
+    
+  function mockupProjectMembers() {
+    var projectMembers = [
+      {'id': '1', 'username': 'user1', 'roleId': '1'},
+      {'id': '2', 'username': 'user2', 'roleId': '3'},
+      {'id': '3', 'username': 'user3', 'roleId': '2'}
+    ];
+    return projectMembers;
+  }
+  
+  ListProjectMemberController.$inject = ['mockupProjectMembers', 'ListProjectMemberService'];
+    
+  function ListProjectMemberController(mockupProjectMembers, ListProjectMemberService) {
+    var vm = this;
+    
+    vm.isOpen = false;
+    vm.addMember = addMember;
+    
+    function addMember() {
+      if(vm.isOpen) {
+        vm.isOpen = false;
+      }else{
+        vm.isOpen = true;
+      }
+    }
+    
+    vm.projectMembers = mockupProjectMembers();
+    
+  }
+  
+  function listProjectMember() {
+    var directive = {
+      restrict: 'E',
+      templateUrl: '/static/ng/resources/js/components/project-member/list-project-member.directive.html',
+      replace: true,
+      controller: ListProjectMemberController,
+      controllerAs: 'vm',
+      bindToController: true
+    }
+    
+    return directive;
+  }
+  
+})();

static/ng/resources/js/components/project-member/project-member.module.js

@@ -0,0 +1,9 @@
+(function() {
+
+  'use strict';
+  
+  angular
+    .module('harbor.project.member', [
+      'harbor.services.project.member']);
+
+})();

static/ng/resources/js/components/projectmember/projectmember.module.js

@@ -1,9 +0,0 @@
-(function() {
-
-  'use strict';
-  
-  angular
-    .module('harbor.projectmember', [
-      'harbor.services.projectmember']);
-
-})();

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

@@ -1,53 +1 @@
-<div class="tab-pane" id="users">
+<list-user></list-user>
-  <div class="col-xs-12 col-md-12 each-tab-pane">
-    <div class="form-inline">
-      <div class="input-group">
-        <input type="text" class="form-control" placeholder="" size="30">
-        <span class="input-group-btn">
-          <button class="btn btn-primary" type="button"><span class="glyphicon glyphicon-search"></span></button>
-        </span>
-      </div>
-      <button class="btn btn-success" type="button"><span class="glyphicon glyphicon-plus"></span>Add Member</button>
-    </div>
-           
-    <div class="pane"> 	    
-      <div class="well panel-group">
-        <div class="row">
-          <div class="col-xs-10 col-md-10">
-            <form>  
-              <div class="form-group">               
-                <input type="text" class="form-control" id="addUsername" placeholder="Username">
-              </div>
-            </form>
-            <form class="form-inline clearfix">
-              <div class="form-group">
-                <label for="roleIdList">Role:</label>&nbsp;&nbsp;
-                <input type="radio" name="roleId" value="1">&nbsp;Project Admin&nbsp;&nbsp;
-                <input type="radio" name="roleId" value="2">&nbsp;Developer&nbsp;&nbsp;
-                <input type="radio" name="roleId" value="3">&nbsp;Guest
-              </div>
-            </form>
-          </div>
-          <div class="col-xs-2 col-md-2"> 
-            <form>                        
-              <div class="form-group" style="margin-top: 20%;">               
-                <button type="button" class="btn btn-default" id="btnCancel">Cancel</button>
-                <button type="button" class="btn btn-primary" id="btnSave">Save</button>     
-              </div>
-            </form>
-          </div>
-        </div>
-      </div>
-      <div class="sub-pane">
-        <table class="table table-pane">
-    			 <thead>
-    			   <th>Username</th><th>Role</th><th>Operation</th>
-    			 </thead>
-    			 <tbody>
-            <tr edit-project-member user-id="1" role-id="2"></tr> 
-          </tbody>
-    		</table>
-      </div>
-    </div>
-  </div>              
-</div>

static/ng/resources/js/harbor.module.js

@@ -5,16 +5,17 @@
       'ngRoute',
       'harbor.layout.navigation',
       'harbor.layout.repository',
+      'harbor.layout.project.member',
       'harbor.layout.user',
       'harbor.layout.log',
       'harbor.services.user',
       'harbor.services.repository',
-      'harbor.services.projectmember',
+      'harbor.services.project.member',
       'harbor.session',
       'harbor.header',
       'harbor.details',
       'harbor.repository',
-      'harbor.projectmember',
+      'harbor.project.member',
       'harbor.user',
       'harbor.log'
     ]);

static/ng/resources/js/layout/project-member/project-member.controller.html

@@ -0,0 +1 @@
+<list-project-member></list-project-member>

static/ng/resources/js/layout/project-member/project-member.controller.js

@@ -0,0 +1,13 @@
+(function() {
+  
+  'use strict';
+  
+  angular
+    .module('harbor.layout.project.member')
+    .controller('ProjectMemberController', ProjectMemberController);
+    
+  function ProjectMemberController() {
+    
+  }
+  
+})();

static/ng/resources/js/layout/project-member/project-member.module.js

@@ -0,0 +1,9 @@
+(function() {
+  
+  'use strict';
+  
+  angular
+    .module('harbor.layout.project.member', []);
+  
+  
+})();

static/ng/resources/js/services/project-member/services.add-project-member.js

@@ -3,7 +3,7 @@
   'use strict';
   
   angular
-    .module('harbor.services.projectmember')
+    .module('harbor.services.project.member')
     .factory('AddProjectMemberService', AddProjectMemberService);
     
   AddProjectMemberService.$inject = ['$http', '$log'];

static/ng/resources/js/services/project-member/services.delete-project-member.js

@@ -3,7 +3,7 @@
   'use strict';
   
   angular
-    .module('harbor.services.projectmember')
+    .module('harbor.services.project.member')
     .factory('DeleteProjectMemberService', DeleteProjectMemberService);
     
   DeleteProjectMemberService.$inject = ['$http', '$log'];

static/ng/resources/js/services/project-member/services.edit-project-member.js

@@ -3,7 +3,7 @@
   'use strict';
   
   angular
-    .module('harbor.services.projectmember')
+    .module('harbor.services.project.member')
     .factory('EditProjectMemberService', EditProjectMemberService);
     
   EditProjectMemberService.$inject = ['$http', '$log'];

static/ng/resources/js/services/project-member/services.list-project-member.js

@@ -0,0 +1,20 @@
+(function() {
+  
+  'use strict';
+  
+   angular
+    .module('harbor.services.project.member')
+    .service('ListProjectMemberService', ListProjectMemberService);
+   
+  ListProjectMemberService.$inject = ['$http', '$log'];
+ 
+  function ListProjectMemberService() {
+    
+    return ListProjectMember;
+    
+    function ListProjectMember () {
+      
+    }
+  }
+  
+})();

static/ng/resources/js/services/project-member/services.project-member.module.js

@@ -3,6 +3,6 @@
   'use strict';
   
   angular
-    .module('harbor.services.projectmember', []);
+    .module('harbor.services.project.member', []);
   
 })();

views/ng/sections/headerInclude.htm

@@ -39,28 +39,32 @@
 <script src="/static/ng/resources/js/layout/repository/repository.module.js"></script>
 <script src="/static/ng/resources/js/layout/repository/repository.controller.js"></script>
 
+<script src="/static/ng/resources/js/layout/project-member/project-member.module.js"></script>
+<script src="/static/ng/resources/js/layout/project-member/project-member.controller.js"></script>
+
 <script src="/static/ng/resources/js/layout/user/user.module.js"></script>
 <script src="/static/ng/resources/js/layout/user/user.controller.js"></script>
 
+
 <script src="/static/ng/resources/js/layout/log/log.module.js"></script>
 <script src="/static/ng/resources/js/layout/log/log.controller.js"></script>
 
-<script src="/static/ng/resources/js/session/session.module.js"></script>
-<script src="/static/ng/resources/js/session/session.current-user.js"></script>
-
 <script src="/static/ng/resources/js/services/user/services.user.module.js"></script>
 <script src="/static/ng/resources/js/services/user/services.current-user.js"></script>
-<script src="/static/ng/resources/js/services/user/services.list-user.js"></script>
 
 <script src="/static/ng/resources/js/services/repository/services.repository.module.js"></script>
 <script src="/static/ng/resources/js/services/repository/services.list-repository.js"></script>
 
-<script src="/static/ng/resources/js/services/projectmember/services.projectmember.module.js"></script>
+<script src="/static/ng/resources/js/services/project-member/services.project-member.module.js"></script>
-<script src="/static/ng/resources/js/services/projectmember/services.edit-projectmember.js"></script>
+<script src="/static/ng/resources/js/services/project-member/services.list-project-member.js"></script>
+<script src="/static/ng/resources/js/services/project-member/services.edit-project-member.js"></script>
 
 <script src="/static/ng/resources/js/services/log/services.log.module.js"></script>
 <script src="/static/ng/resources/js/services/log/services.list-log.js"></script>
 
+<script src="/static/ng/resources/js/session/session.module.js"></script>
+<script src="/static/ng/resources/js/session/session.current-user.js"></script>
+
 <script src="/static/ng/resources/js/components/header/header.module.js"></script>
 
 <script src="/static/ng/resources/js/components/details/details.module.js"></script>
@@ -69,16 +73,17 @@
 
 <script src="/static/ng/resources/js/components/details/switch-pane-projects.directive.js"></script>
 <script src="/static/ng/resources/js/components/details/retrieve-projects.directive.js"></script>
+<script src="/static/ng/resources/js/components/details/add-member.directive.js"></script>
 <script src="/static/ng/resources/js/components/details/switch-roles.directive.js"></script>
 
 <script src="/static/ng/resources/js/components/repository/repository.module.js"></script>
 <script src="/static/ng/resources/js/components/repository/list-repository.directive.js"></script>
 
-<script src="/static/ng/resources/js/components/user/user.module.js"></script>
+<script src="/static/ng/resources/js/components/project-member/project-member.module.js"></script>
-<script src="/static/ng/resources/js/components/user/list-user.directive.js"></script>
+<script src="/static/ng/resources/js/components/project-member/list-project-member.directive.js"></script>
+<script src="/static/ng/resources/js/components/project-member/edit-project-member.directive.js"></script>
 
-<script src="/static/ng/resources/js/components/projectmember/projectmember.module.js"></script>
+<script src="/static/ng/resources/js/components/user/user.module.js"></script>
-<script src="/static/ng/resources/js/components/projectmember/edit-projectmember.directive.js"></script>
 
 <script src="/static/ng/resources/js/components/log/log.module.js"></script>
 <script src="/static/ng/resources/js/components/log/list-log.directive.js"></script>