From a6a4d6d320548c24aa40119f5b20fbbd4c767dd6 Mon Sep 17 00:00:00 2001
From: lijun <lijun@qiyi.com>
Date: Tue, 7 Jun 2016 21:23:20 +0800
Subject: [PATCH] select/unselect all tags in the repos detail page

Signed-off-by: lijun <lijun@qiyi.com>
---
 app/tag/tag-controller.js       | 51 ++++++++++++++++++++++++++++-----
 app/tag/tag-list-directive.html | 11 +++++--
 2 files changed, 53 insertions(+), 9 deletions(-)

diff --git a/app/tag/tag-controller.js b/app/tag/tag-controller.js
index 5bd7c50..6f4fe21 100644
--- a/app/tag/tag-controller.js
+++ b/app/tag/tag-controller.js
@@ -34,12 +34,12 @@ angular.module('tag-controller', ['registry-services'])
       if(! $scope.tagsCurrentPage){
         $scope.tagsCurrentPage = 1;
       }else{
-        $scope.tagsCurrentPage = parseInt($scope.tagsCurrentPage) 
+        $scope.tagsCurrentPage = parseInt($scope.tagsCurrentPage)
         if($scope.tagsCurrentPage > $scope.maxTagsPage || $scope.tagsCurrentPage < 1){
-          $scope.tagsCurrentPage = 1; 
+          $scope.tagsCurrentPage = 1;
         }
       }
-      // Select wanted tags 
+      // Select wanted tags
       var idxShift = 0;
       $scope.displayedTags = $scope.tags;
       if($scope.tagsPerPage){
@@ -52,21 +52,58 @@ angular.module('tag-controller', ['registry-services'])
         if(!isNaN(idx)){
           tmpIdx = parseInt(idx) + idxShift;
           if ( result[tmpIdx].hasOwnProperty('name') ) {
-              result[tmpIdx].details = Manifest.query({repoUser: $scope.repositoryUser, repoName: $scope.repositoryName, tagName: result[tmpIdx].name});
+              Manifest.query({repoUser: $scope.repositoryUser, repoName: $scope.repositoryName, tagName: result[tmpIdx].name})
+              .$promise.then((function(tmpIdx){
+              return function(data){
+                        // FIXME: delete property 'history' because it will occur recursive checks in the process of watching $displayedTags
+                        // will this result in some bad things?
+                        if(data.history) delete data.history;
+                        result[tmpIdx].details = data;
+                      };
+            })(tmpIdx));
           }
         }
       }
     });
-      
 
-    
     // Copy collection for rendering in a smart-table
     $scope.displayedTags = [].concat($scope.tags);
 
-    
     // selected tags
     $scope.selection = [];
 
+    $scope.$watch("displayedTags|filter:{selected: true}", function(nv){
+      $scope.selection = nv;
+    }, true);
+
+    // select all tags in the page
+    $scope.$watch("selectAll", function(nv){
+      angular.forEach($filter('filter')($scope.displayedTags, $scope.search), function(elem){
+        elem.selected = nv;
+      });
+    });
+
+    // reset tags that are not in the filter result
+    $scope.resetTags = function(){
+      var filterResult = $filter('filter')($scope.displayedTags, $scope.search),
+          i = 0,
+          j = 0;
+
+      while(i<$scope.displayedTags.length && j<filterResult.length){
+        if($scope.displayedTags[i] != filterResult[j]){
+          $scope.displayedTags[i]['selected'] = false;
+          i++;
+        }
+        else{
+          i++, j++;
+        }
+      }
+      while(i<$scope.displayedTags.length) {
+        $scope.displayedTags[i]['selected'] = false;
+        i++;
+      }
+    }
+
     // helper method to get selected tags
     $scope.selectedTags = function selectedTags() {
       return filterFilter($scope.displayedTags, { selected: true });
diff --git a/app/tag/tag-list-directive.html b/app/tag/tag-list-directive.html
index b933706..96a472d 100644
--- a/app/tag/tag-list-directive.html
+++ b/app/tag/tag-list-directive.html
@@ -10,6 +10,7 @@
   <table  class="table table-hover">
     <thead>
       <tr>
+        <th></th>
         <th  ng-class="{strike: deleted}"><span class="glyphicon glyphicon-tag"></span> Tag</th>
         <th ><span class="glyphicon glyphicon-qrcode"></span> Image ID</th>
         <th ><span class="glyphicon glyphicon-calendar"></span> Created</th>
@@ -19,11 +20,17 @@
         <!-- <th><span class="glyphicon glyphicon-compressed"></span> Size (MB)</th> -->
       </tr>
       <tr>
-  			<th><input class="input-sm form-control" placeholder="Filter tags on this page" type="search" ng-model="search.name"/></th>
-		  </tr>
+        <th>
+          <checkbox ng-model="selectAll"></checkbox>
+        </th>
+        <th><input ng-change="resetTags()" class="input-sm form-control" placeholder="Filter tags on this page" type="search" ng-model="search.name"/></th>
+      </tr>
     </thead>
     <tbody>
       <tr ng-repeat="tag in displayedTags | filter:search ">
+        <td>
+          <checkbox ng-model="tag.selected"></checkbox>
+        </td>
         <td>
           <a ng-bind-html="tag.name" href="tag/{{repositoryUser}}/{{repositoryName}}/{{tag.name}}">{{tag.name}}</a>
         </td>