fix(ui): hidden containers (using label) are now removed from dashboard and swarm view (#46)

app/components/dashboard/dashboardController.js

@@ -1,5 +1,6 @@
 angular.module('dashboard', [])
-  .controller('DashboardController', ['$scope', 'Container', 'Image', 'Settings', 'LineChart', function ($scope, Container, Image, Settings, LineChart) {
+.controller('DashboardController', ['$scope', 'Config', 'Container', 'Image', 'Settings', 'LineChart',
+function ($scope, Config, Container, Image, Settings, LineChart) {
 
   $scope.containerData = {};
 
@@ -17,30 +18,52 @@ angular.module('dashboard', [])
     });
   };
 
-  Container.query({all: 1}, function (d) {
+  function fetchDashboardData() {
-    var running = 0;
+    Container.query({all: 1}, function (d) {
-    var ghost = 0;
+      var running = 0;
-    var stopped = 0;
+      var ghost = 0;
+      var stopped = 0;
 
-    // TODO: centralize that
+      var containers = d;
-    var containers = d.filter(function (container) {
+      if (hiddenLabels) {
-      return container.Image !== 'swarm';
+        containers = hideContainers(d);
-    });
-
-    for (var i = 0; i < containers.length; i++) {
-      var item = containers[i];
-      if (item.Status === "Ghost") {
-        ghost += 1;
-      } else if (item.Status.indexOf('Exit') !== -1) {
-        stopped += 1;
-      } else {
-        running += 1;
       }
-    }
-    $scope.containerData.running = running;
-    $scope.containerData.stopped = stopped;
-    $scope.containerData.ghost = ghost;
 
-    buildCharts(containers);
+      for (var i = 0; i < containers.length; i++) {
+        var item = containers[i];
+        if (item.Status === "Ghost") {
+          ghost += 1;
+        } else if (item.Status.indexOf('Exit') !== -1) {
+          stopped += 1;
+        } else {
+          running += 1;
+        }
+      }
+      $scope.containerData.running = running;
+      $scope.containerData.stopped = stopped;
+      $scope.containerData.ghost = ghost;
+
+      buildCharts(containers);
+    });
+  }
+
+  var hideContainers = function (containers) {
+    return containers.filter(function (container) {
+      var filterContainer = false;
+      hiddenLabels.forEach(function(label, index) {
+        if (_.has(container.Labels, label.name) &&
+        container.Labels[label.name] === label.value) {
+          filterContainer = true;
+        }
+      });
+      if (!filterContainer) {
+        return container;
+      }
+    });
+  };
+
+  Config.$promise.then(function (c) {
+    hiddenLabels = c.hiddenLabels;
+    fetchDashboardData();
   });
 }]);

app/components/swarm/swarm.html

@@ -54,10 +54,6 @@
               <td>Nodes</td>
               <td>{{ swarm.Nodes }}</td>
             </tr>
-            <tr>
-              <td>Containers</td>
-              <td>{{ info.Containers }}</td>
-            </tr>
             <tr>
               <td>Images</td>
               <td>{{ info.Images }}</td>
@@ -108,13 +104,6 @@
                   <span ng-show="sortType == 'IP' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
                 </a>
               </th>
-              <th>
-                <a ui-sref="swarm" ng-click="order('Containers')">
-                  Containers
-                  <span ng-show="sortType == 'Containers' && !sortReverse" class="glyphicon glyphicon-chevron-down"></span>
-                  <span ng-show="sortType == 'Containers' && sortReverse" class="glyphicon glyphicon-chevron-up"></span>
-                </a>
-              </th>
               <th>
                 <a ui-sref="swarm" ng-click="order('Engine')">
                   Engine
@@ -135,7 +124,6 @@
             <tr ng-repeat="node in (state.filteredNodes = (swarm.Status | filter:state.filter | orderBy:sortType:sortReverse))">
               <td>{{ node.name }}</td>
               <td>{{ node.ip }}</td>
-              <td>{{ node.containers }}</td>
               <td>{{ node.version }}</td>
               <td><span class="label label-{{ node.status|nodestatusbadge }}">{{ node.status }}</span></td>
             </tr>