updates for project and details of UI

static/ng/resources/js/components/details/retrieve-projects.directive.js

@@ -6,41 +6,20 @@
     .module('harbor.details')
     .directive('retrieveProjects', retrieveProjects);
   
-  RetrieveProjectsController.$inject = ['$scope', 'nameFilter', '$filter', 'ListProjectService', '$routeParams', '$location'];
+  RetrieveProjectsController.$inject = ['$scope', 'nameFilter', '$filter', 'CurrentProjectMemberService', 'ListProjectService', '$routeParams', '$location'];
    
-  function RetrieveProjectsController($scope, nameFilter, $filter, ListProjectService, $routeParams, $location) {
+  function RetrieveProjectsController($scope, nameFilter, $filter, CurrentProjectMemberService, ListProjectService, $routeParams, $location) {
     var vm = this;
    
     vm.projectName = '';
     vm.isPublic = 0;        
+    vm.publicity = false;
     
-    ListProjectService(vm.projectName, vm.isPublic)
+    vm.retrieve = retrieve;
-      .success(getProjectSuccess)
-      .error(getProjectFailed);
     
-    function getProjectSuccess(data, status) {
+    vm.retrieve();
-      vm.projects = data;
     
-      if($routeParams.project_id){
+    vm.checkProjectMember = checkProjectMember;
-        angular.forEach(vm.projects, function(value, index) {
-          if(value['ProjectId'] == $routeParams.project_id) {
-            vm.selectedProject = value;
-          }
-        });
-      }else{
-        vm.selectedProject = vm.projects[0];  
-      }
-      vm.resultCount = vm.projects.length;
-    
-      $scope.$watch('vm.filterInput', function(current, origin) {  
-        vm.resultCount = $filter('name')(vm.projects, vm.filterInput, 'Name').length;
-      });
-      
-    }
-    
-    function getProjectFailed(response) {
-      console.log('Failed to list projects:' + response);
-    }
     
     $scope.$watch('vm.selectedProject', function(current, origin) {
       if(current) {        
@@ -51,11 +30,64 @@
     vm.filterInput = "";
     vm.selectItem = selectItem;  
     
+    $scope.$watch('vm.publicity', function(current, origin) { 
+      if(typeof current != "undefined") {
+        vm.isPublic = current ? 1 : 0;        
+        vm.retrieve();
+      }
+    });
+       
+    function retrieve() {
+      ListProjectService(vm.projectName, vm.isPublic)
+        .success(getProjectSuccess)
+        .error(getProjectFailed);
+    }
+    
+    function getProjectSuccess(data, status) {
+      vm.projects = data;
+      vm.selectedProject = vm.projects[0];  
+      if($routeParams.project_id){
+        angular.forEach(vm.projects, function(value, index) {
+          if(value['ProjectId'] == $routeParams.project_id) {
+            vm.selectedProject = value;
+          }
+        }); 
+      }
+      $location.search('project_id', vm.selectedProject.ProjectId);
+      vm.checkProjectMember(vm.selectedProject.ProjectId);
+      vm.resultCount = vm.projects.length;
+    
+      $scope.$watch('vm.filterInput', function(current, origin) {  
+        vm.resultCount = $filter('name')(vm.projects, vm.filterInput, 'Name').length;
+      });
+    }
+    
+    function getProjectFailed(response) {
+      console.log('Failed to list projects:' + response);
+    }
+    
+    function checkProjectMember(projectId) {
+      CurrentProjectMemberService(projectId)
+        .success(getCurrentProjectMemberSuccess)
+        .error(getCurrentProjectMemberFailed);
+    }
+    
+    function getCurrentProjectMemberSuccess(data, status) {
+      console.log('Successful get current project member:' + status);
+      vm.isProjectMember = true;
+    }
+    
+    function getCurrentProjectMemberFailed(data, status) {
+      console.log('Failed get current project member:' + status);
+      vm.isProjectMember = false;
+    }
   
     function selectItem(item) {
       vm.selectedId = item.ProjectId;
       vm.selectedProject = item;
+      vm.checkProjectMember(vm.selectedProject.ProjectId);
       vm.isOpen = false;
+      
       $location.search('project_id', vm.selectedProject.ProjectId);
     }       
     
@@ -67,7 +99,9 @@
       templateUrl: '/static/ng/resources/js/components/details/retrieve-projects.directive.html',
       scope: {
         'isOpen': '=',
-        'selectedProject': '='
+        'selectedProject': '=',
+        'publicity': '=',
+        'isProjectMember': '='
       },
       link: link,
       replace: true,

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

@@ -17,7 +17,6 @@
     vm.cancel = cancel;
     
     function save() {
-      
       AddProjectMemberService(2, vm.optRole, vm.username)
         .success(addProjectMemberComplete)
         .error(addProjectMemberFailed);
@@ -29,6 +28,8 @@
    
     function cancel() {
       vm.isOpen = false;  
+      vm.username = "";
+      vm.optRole = 1;
     }
     
     function addProjectMemberComplete(data, status, header) {

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

@@ -1,9 +1,11 @@
 <td style="padding: 15px;">//vm.username//</td>
 <td><switch-role roles="vm.roles" edit-mode="vm.editMode" user-id="vm.userId" role-name="vm.roleName"></switch-role></td>
 <td>
-  <a href="javascript:void(0);" ng-click="vm.updateProjectMember({projectId: vm.projectId, userId: vm.userId, roleId: vm.roleId})">
+  <a ng-show="vm.userId != vm.currentUserId" href="javascript:void(0);" ng-click="vm.updateProjectMember({projectId: vm.projectId, userId: vm.userId, roleId: vm.roleId})">
-      <span ng-if="!vm.editMode" class="glyphicon glyphicon-pencil"></span><span ng-if="vm.editMode" class="glyphicon glyphicon-ok"></span>
+    <span ng-if="!vm.editMode" class="glyphicon glyphicon-pencil" title="Edit"></span><span ng-if="vm.editMode" class="glyphicon glyphicon-ok" title="Confirm">
-    </ng-switch>
   </a>
-  <a href="javascript:void(0);" ng-click="vm.deleteProjectMember({projectId: vm.projectId, userId: vm.userId})"><span class="glyphicon glyphicon-trash"></span></a>
+  <a ng-show="vm.userId != vm.currentUserId" href="javascript:void(0);" ng-click="vm.cancelUpdate()" title="Cancel">
+    <span ng-if="vm.editMode" class="glyphicon glyphicon-repeat"></span>
+  </a>
+  <a ng-show="vm.userId != vm.currentUserId" href="javascript:void(0);" ng-click="vm.deleteProjectMember({projectId: vm.projectId, userId: vm.userId})" title="Delete"><span class="glyphicon glyphicon-trash"></span></a>
 </td>

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

@@ -11,31 +11,34 @@
   function EditProjectMemberController($scope, roles, getRole, EditProjectMemberService, DeleteProjectMemberService) {
     var vm = this;
         
-    
-    $scope.$on('changedRoleId', function(e, val) {
-      vm.roleId = val;
-    });
-    
     vm.roles = roles();
     vm.editMode = false;
+    vm.lastRoleName = vm.roleName;
+    
+    $scope.$watch('vm.roleName', function(current, origin) {
+      if(current) {
+        vm.currentRole = getRole({'key': 'roleName', 'value': current});  
+        vm.roleId = vm.currentRole.id;
+      }
+    });
+    
     vm.updateProjectMember = updateProjectMember;
     vm.deleteProjectMember = deleteProjectMember;
+    vm.cancelUpdate = cancelUpdate;
     
     function updateProjectMember(e) {            
       if(vm.editMode) {
         vm.editMode = false;
-      
+        console.log('update project member, roleId:' + e.roleId);         
         EditProjectMemberService(e.projectId, e.userId, e.roleId)
           .success(editProjectMemberComplete)
           .error(editProjectMemberFailed);
-        
       }else {
         vm.editMode = true;      
       } 
     }
     
     function deleteProjectMember(e) {
-      
       DeleteProjectMemberService(e.projectId, e.userId)
         .success(editProjectMemberComplete)
         .error(editProjectMemberFailed);
@@ -43,11 +46,18 @@
     }
     
     function editProjectMemberComplete(data, status, headers) {
-      console.log('editProjectMemberComplete: ' + status);
+      console.log('edit project member complete: ' + status);
+      vm.lastRoleName = vm.roleName;
     }
     
     function editProjectMemberFailed(e) {
-      console.log('editProjectMemberFailed:' + e);
+      console.log('Failed to edit project member:' + e);
+    }
+    
+    function cancelUpdate() {
+      vm.editMode = false;
+      console.log('lastRoleName:' + vm.lastRoleName);
+      vm.roleName = vm.lastRoleName;
     }
     
   }
@@ -59,15 +69,21 @@
       'scope': {
         'username': '=',
         'userId': '=',
+        'currentUserId': '=',
         'roleName': '=',
         'projectId': '=',
         'reload': '&'
       },
+      'link': link,
       'controller': EditProjectMemberController,
       'controllerAs': 'vm',
       'bindToController': true
     };
     return directive;
+    
+    function link(scope, element, attrs, ctrl) {
+    
+    }
   }
 
 })();

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

@@ -7,7 +7,8 @@
           <button class="btn btn-primary" type="button" ng-click="vm.search({projectId: vm.projectId, username: vm.username})"><span class="glyphicon glyphicon-search"></span></button>
         </span>
       </div>
-      <button class="btn btn-success" type="button" ng-click="vm.addProjectMember()"><span class="glyphicon glyphicon-plus"></span>Add Member</button>
+      <button ng-if="!vm.isOpen" class="btn btn-success" type="button" ng-click="vm.addProjectMember()"><span class="glyphicon glyphicon-plus"></span>Add Member</button>
+      <button ng-if="vm.isOpen" class="btn btn-default" disabled="disabled" type="button"><span class="glyphicon glyphicon-plus"></span>Add Member</button>
     </div>
     <div class="pane"> 	           
       <add-project-member ng-show="vm.isOpen" is-open="vm.isOpen" reload='vm.search({projectId: vm.projectId, username: vm.username})'></add-project-member>
@@ -17,7 +18,7 @@
     			   <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 username="pr.username" project-id="vm.projectId" user-id="pr.UserId" role-name="pr.Rolename" reload='vm.search({projectId: vm.projectId, username: vm.username})'></tr> 
+            <tr ng-repeat="pr in vm.projectMembers" edit-project-member username="pr.username" project-id="vm.projectId" user-id="pr.UserId" current-user-id="vm.currentUser.UserId" role-name="pr.Rolename" reload='vm.search({projectId: vm.projectId, username: vm.username})'></tr> 
           </tbody>
     		</table>
       </div>

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

@@ -6,24 +6,27 @@
     .module('harbor.project.member')
     .directive('listProjectMember', listProjectMember);
     
-  ListProjectMemberController.$inject = ['$scope', '$q', 'ListProjectMemberService', '$routeParams'];
+  ListProjectMemberController.$inject = ['$scope', 'CurrentUserService', 'ListProjectMemberService', '$routeParams'];
     
-  function ListProjectMemberController($scope, $q, ListProjectMemberService, $routeParams) {
+  function ListProjectMemberController($scope, CurrentUserService, ListProjectMemberService, $routeParams) {
     var vm = this;
     
     vm.isOpen = false;
-    vm.username = "";
        
     vm.search = search; 
     vm.addProjectMember = addProjectMember;
     vm.retrieve = retrieve;
     
     vm.projectId = $routeParams.project_id;
-    vm.retrieve(vm.projectId, vm.username);
+    vm.username = "";
+    
+    vm.retrieve();
               
     function search(e) {
+      vm.projectId = e.projectId;
+      vm.username = e.username;
       console.log('project_id:' + e.projectId);
-      retrieve(e.projectId, e.username);
+      retrieve();
     }
     
     function addProjectMember() {
@@ -34,12 +37,27 @@
       }
     }
     
-    function retrieve(projectId, username) {    
+    function retrieve() {
-      ListProjectMemberService(projectId, {'username': username})
+      $.when(
+        CurrentUserService()
+          .success(getCurrentUserSuccess)
+          .error(getCurrentUserFailed))
+      .then(function(){    
+        ListProjectMemberService(vm.projectId, {'username': vm.username})
           .then(getProjectMemberComplete)
           .catch(getProjectMemberFailed);      
+      });
     }
     
+    function getCurrentUserSuccess(data, status) {
+      vm.currentUser = data;
+    }
+    
+    function getCurrentUserFailed(e) {
+      console.log('Failed in getCurrentUser:' + e);
+    }
+
+    
     function getProjectMemberComplete(response) {
       vm.projectMembers = response.data;  
     } 

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

@@ -4,6 +4,8 @@
   
   angular
     .module('harbor.project.member', [
-      'harbor.services.project.member']);
+      'harbor.services.project.member',
+      'harbor.services.user'
+    ]);
 
 })();

static/ng/resources/js/components/project-member/switch-role.directive.js

@@ -11,12 +11,16 @@
   function SwitchRoleController(getRole, $scope) {
     var vm = this;
     
-    vm.currentRole = getRole({'key': 'roleName', 'value': vm.roleName});            
+    $scope.$watch('vm.roleName', function(current,origin) {
+      if(current) {
+        vm.currentRole = getRole({'key': 'roleName', 'value': current});            
+      }
+    });
     vm.selectRole = selectRole;
     
     function selectRole(role) {
       vm.currentRole = getRole({'key': 'roleName', 'value': role.roleName});  
-      $scope.$emit('changedRoleId', vm.currentRole.id);
+      vm.roleName = role.roleName;
     }
     
   }

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

@@ -26,11 +26,12 @@
       AddProjectService(vm.projectName, vm.isPublic)
         .success(addProjectSuccess)
         .error(addProjectFailed);
-      
     }
     
     function addProjectSuccess(data, status) {
       vm.isOpen = false;
+      vm.projectName = "";
+      vm.isPublic = false;
       $scope.$emit('addedSuccess', true);
     }
     
@@ -40,6 +41,8 @@
     
     function cancel(){
       vm.isOpen = false;
+      vm.projectName = "";
+      vm.isPublic = false;
     }
   }
   

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

@@ -8,16 +8,16 @@
         </span>
       </div>
     </div>
-    <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="false">
+    <div class="panel-group" id="accordion" role="tablist" aria-multiselectable="true">
       <div class="panel panel-default" ng-repeat="repo in vm.repositories">
         <div class="panel-heading" role="tab" id="heading//$index + 1//">
           <h4 class="panel-title">
-            <a role="button" data-toggle="collapse" data-parent="#accordion" href="ng/repository#/repositories#collapse//$index + 1//" aria-expanded="true" aria-controls="collapse//$index + 1//" ng-click="vm.expand({repoName: repo})">
+            <a role="button" data-toggle="collapse" data-parent="" href="?project_id=//vm.projectId//#collapse//$index + 1//" aria-expanded="true" aria-controls="collapse//$index+1//">
               <span class="glyphicon glyphicon-book"></span> //repo//
             </a>
           </h4>
         </div>
-        <list-tag associate-id="$index + 1" repo-name="repo" tags="vm.tags"></list-tag>
+        <list-tag associate-id="$index + 1" repo-name="repo"></list-tag>
       </div>
     </div>
   </div>

static/ng/resources/js/components/repository/list-repository.directive.js

@@ -12,7 +12,6 @@
         
     vm.filterInput = "";
     vm.retrieve = retrieve;
-    vm.expand = expand;
     vm.projectId = $routeParams.project_id;
     
     vm.retrieve();
@@ -31,20 +30,7 @@
       console.log('failed to list repositories:' + response);      
     }
    
-    function expand(e) {
-      vm.tags = [];
-      ListTagService(e.repoName)
-        .then(getTagComplete)
-        .catch(getTagFailed);
     
-      function getTagComplete(response) {
-        vm.tags = response.data;
-      }
-      
-      function getTagFailed(response) {
-        
-      }
-    }
   }
   
   function listRepository() {

static/ng/resources/js/components/repository/list-tag.directive.js

@@ -6,10 +6,28 @@
     .module('harbor.repository')
     .directive('listTag', listTag);
     
-  ListTagController.$inject = ['ListTagService'];
+  ListTagController.$inject = ['$scope', 'ListTagService'];
   
-  function ListTagController(ListTagService) {
+  function ListTagController($scope, ListTagService) {
+    var vm = this;
     
+    vm.tags = [];
+    
+    $scope.$watch('vm.repoName', function(current, origin) {    
+      if(current) {
+        console.log('vm.repoName in tags:' + current);
+        ListTagService(current)
+          .then(getTagComplete)
+          .catch(getTagFailed);
+      }
+    });
+    function getTagComplete(response) {
+      vm.tags = response.data;
+    }
+      
+    function getTagFailed(response) {
+      
+    }
   }
   
   function listTag() {
@@ -18,8 +36,7 @@
       'templateUrl': '/static/ng/resources/js/components/repository/list-tag.directive.html',
       'scope': {
         'associateId': '=',
-        'repoName': '=',
+        'repoName': '='
-        'tags': '='
       },
       'replace': true,
       'controller': ListTagController,

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

@@ -6,16 +6,23 @@
     .module('harbor.details')
     .controller('DetailsController', DetailsController);
     
-  DetailsController.$inject = ['ListProjectService', '$scope', '$location', '$routeParams'];
+  DetailsController.$inject = ['$scope', '$location', '$routeParams'];
   
-  function DetailsController(ListProjectService, $scope, $location, $routeParams) {
+  function DetailsController($scope, $location, $routeParams) {
     var vm = this;
     vm.isOpen = false;
+    vm.publicity = false;
+    vm.isProjectMember = true;
     vm.closeRetrievePane = closeRetrievePane;   
+    vm.togglePublicity = togglePublicity;
     
     function closeRetrievePane() {
       $scope.$broadcast('isOpen', false);
     }
+    function togglePublicity(e) {
+      vm.publicity = e.publicity;
+      console.log('current project publicity:' + vm.publicity);
+    }
   }
   
 })();

static/ng/resources/js/layout/details/details.module.js

@@ -4,7 +4,8 @@
   
   angular
     .module('harbor.details', [
-    'harbor.services.project'
+    'harbor.services.project',
+    'harbor.services.project.member'
     ]);
   
 })();

static/ng/resources/js/layout/navigation/navigation-details.directive.js

@@ -47,7 +47,10 @@
     
     function link(scope, element, attrs, ctrl) {
       
-      var visited = ctrl.url.substring(1, ctrl.url.indexOf('?') - 1);
+      var visited = ctrl.url.substring(1);
+      if(visited.indexOf('?') >= 0) {
+        visited = ctrl.url.substring(1, ctrl.url.indexOf('?') - 1);
+      }
      
       element.find('a[tag^="' + visited + '"]').addClass('active');
       element.on('click', click);

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

@@ -16,7 +16,6 @@
     vm.publicity = 0;
      
     vm.retrieve = retrieve;
-    vm.getCurrentUser = getCurrentUser;
     vm.showAddProject = showAddProject;
     vm.searchProject = searchProject;    
     vm.showAddButton = showAddButton;
@@ -44,12 +43,6 @@
       console.log('Failed to list Project:' + e);
     }
       
-    function getCurrentUser() {
-      CurrentUserService()
-        .success(getCurrentUserSuccess)
-        .error(getCurrentUserFailed);
-    }
-    
     function getCurrentUserSuccess(data, status) {
       vm.currentUser = data;
     }

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

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

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

@@ -0,0 +1,20 @@
+(function() {
+  
+  'use strict';
+  
+  angular
+    .module('harbor.services.project.member')
+    .factory('CurrentProjectMemberService', CurrentProjectMemberService);
+  
+  CurrentProjectMemberService.$inject = ['$http', '$log'];  
+    
+  function CurrentProjectMemberService($http, $log) {
+    return currentProjectMember;
+    
+    function currentProjectMember(projectId) {
+      return $http
+        .get('/api/projects/' + projectId + '/members/current');
+    }
+  }
+  
+})();