Fix duplicated containers and wifi style in the webui

glances/outputs/static/js/components/glances/view.html

@@ -60,22 +60,15 @@
         <div class="row">
             <div class="col-sm-6 sidebar" ng-if="!vm.arguments.disable_left_sidebar">
                 <div class="table">
-                    <glances-plugin-network id="plugin-network" class="plugin table-row-group"
-                                            ng-if="!vm.arguments.disable_network"></glances-plugin-network>
-                    <glances-plugin-wifi id="plugin-wifi" class="plugin table-row-group"
-                                         ng-if="!vm.arguments.disable_wifi"></glances-plugin-wifi>
-                    <glances-plugin-ports id="plugin-ports" class="plugin table-row-group"
-                                          ng-if="!vm.arguments.disable_ports"></glances-plugin-ports>
-                    <glances-plugin-diskio id="plugin-diskio" class="plugin table-row-group"
-                                           ng-if="!vm.arguments.disable_diskio"></glances-plugin-diskio>
-                    <glances-plugin-fs id="plugin-fs" class="plugin table-row-group"
-                                       ng-if="!vm.arguments.disable_fs"></glances-plugin-fs>
+                    <glances-plugin-network id="plugin-network" class="plugin table-row-group" ng-if="!vm.arguments.disable_network"></glances-plugin-network>
+                    <glances-plugin-wifi id="plugin-wifi" class="plugin table-row-group" ng-if="!vm.arguments.disable_wifi"></glances-plugin-wifi>
+                    <glances-plugin-ports id="plugin-ports" class="plugin table-row-group" ng-if="!vm.arguments.disable_ports"></glances-plugin-ports>
+                    <glances-plugin-diskio id="plugin-diskio" class="plugin table-row-group" ng-if="!vm.arguments.disable_diskio"></glances-plugin-diskio>
+                    <glances-plugin-fs id="plugin-fs" class="plugin table-row-group" ng-if="!vm.arguments.disable_fs"></glances-plugin-fs>
                     <glances-plugin-irq id="plugin-irq" ng-if="vm.arguments.enable_irq"></glances-plugin-irq>
-                    <glances-plugin-folders id="plugin-folders"
-                                            ng-if="!vm.arguments.disable_folders"></glances-plugin-folders>
+                    <glances-plugin-folders id="plugin-folders" ng-if="!vm.arguments.disable_folders"></glances-plugin-folders>
                     <glances-plugin-raid id="plugin-raid" ng-if="!vm.arguments.raid"></glances-plugin-raid>
-                    <glances-plugin-sensors id="plugin-sensors"
-                                            ng-if="!vm.arguments.disable_sensors"></glances-plugin-sensors>
+                    <glances-plugin-sensors id="plugin-sensors" ng-if="!vm.arguments.disable_sensors"></glances-plugin-sensors>
                 </div>
             </div>
             <div class="col-sm-18">

glances/outputs/static/js/components/plugin-amps/controller.js

@@ -15,13 +15,13 @@ function GlancesPluginAmpsController($scope, GlancesStats, favicoService) {
     var loadData = function (data) {
         var processes = data.stats['amps'];
 
-        this.processes = [];
+        vm.processes = [];
         angular.forEach(processes, function (process) {
             if (process.result !== null) {
-                this.processes.push(process);
+                vm.processes.push(process);
             }
         }, this);
-    }
+    };
 
     vm.getDescriptionDecoration = function (process) {
         var count = process.count;
@@ -30,13 +30,13 @@ function GlancesPluginAmpsController($scope, GlancesStats, favicoService) {
         var decoration = "ok";
 
         if (count > 0) {
-            if ((countMin == null || count >= countMin) && (countMax == null || count <= countMax)) {
+            if ((countMin === null || count >= countMin) && (countMax === null || count <= countMax)) {
                 decoration = 'ok';
             } else {
                 decoration = 'careful';
             }
         } else {
-            decoration = countMin == null ? 'ok' : 'critical';
+            decoration = countMin === null ? 'ok' : 'critical';
         }
 
         return decoration;

glances/outputs/static/js/components/plugin-cpu/controller.js

@@ -55,7 +55,7 @@ function GlancesPluginCpuController($scope, GlancesStats) {
         }
     }
 
-    this.getDecoration = function (value) {
+    vm.getDecoration = function (value) {
         if (_view[value] === undefined) {
             return;
         }

glances/outputs/static/js/components/plugin-diskio/controller.js

@@ -14,15 +14,13 @@ function GlancesPluginDiskioController($scope, $filter, GlancesStats, ARGUMENTS)
     });
 
     var loadData = function (data) {
-        var stats = data.stats['diskio'];
+        var stats = data.stats['diskio'] || [];
         stats = $filter('orderBy')(stats, 'disk_name');
 
-        vm.disks = [];
-        for (var i = 0; i < stats.length; i++) {
-            var diskioData = stats[i];
+        vm.disks = stats.map(function(diskioData) {
             var timeSinceUpdate = diskioData['time_since_update'];
 
-            vm.disks.push({
+            return {
                 'name': diskioData['disk_name'],
                 'bitrate': {
                     'txps': $filter('bytes')(diskioData['read_bytes'] / timeSinceUpdate),
@@ -33,7 +31,7 @@ function GlancesPluginDiskioController($scope, $filter, GlancesStats, ARGUMENTS)
                     'rxps': $filter('bytes')(diskioData['write_count'] / timeSinceUpdate)
                 },
                 'alias': diskioData['alias'] !== undefined ? diskioData['alias'] : null
-            });
-        }
+            };
+        });
     }
 }

glances/outputs/static/js/components/plugin-diskio/view.html

@@ -6,7 +6,7 @@
     <div class="table-cell" ng-show="vm.arguments.diskio_iops">IOR/s</div>
     <div class="table-cell" ng-show="vm.arguments.diskio_iops">IOW/s</div>
 </div>
-<div class="table-row" ng-repeat="disk in vm.disks track by name">
+<div class="table-row" ng-repeat="disk in vm.disks">
     <div class="table-cell text-left">{{(disk.alias ? disk.alias : disk.name) | min_size}}</div>
     <div class="table-cell" ng-show="!vm.arguments.diskio_iops">{{disk.bitrate.txps }}</div>
     <div class="table-cell" ng-show="!vm.arguments.diskio_iops">{{disk.bitrate.rxps }}</div>

glances/outputs/static/js/components/plugin-docker/controller.js

@@ -15,16 +15,14 @@ function GlancesPluginDockerController($scope, GlancesStats) {
 
     var loadData = function (data) {
         var stats = data.stats['docker'];
-        this.containers = [];
+        vm.containers = [];
 
         if (_.isEmpty(stats)) {
             return;
         }
 
-        for (var i = 0; i < stats['containers'].length; i++) {
-            var containerData = stats['containers'][i];
-
-            var container = {
+        vm.containers = stats['containers'].map(function(containerData) {
+            return {
                 'id': containerData.Id,
                 'name': containerData.Names[0].split('/').splice(-1)[0],
                 'status': containerData.Status,
@@ -39,9 +37,7 @@ function GlancesPluginDockerController($scope, GlancesStats) {
                 'command': containerData.Command,
                 'image': containerData.Image
             };
-
-            vm.containers.push(container);
-        }
+        });
 
         vm.version = stats['version']['Version'];
     }

glances/outputs/static/js/components/plugin-docker/view.html

-<section id="containers" class="plugin" ng-if="vm.containers.length">
+<section id="containers-plugin" class="plugin" ng-if="vm.containers.length">
     <span class="title">CONTAINERS</span> {{ vm.containers.length }} (served by Docker {{ vm.version }})
 
     <div class="table">
@@ -13,7 +13,7 @@
             <div class="table-cell">TX/s</div>
             <div class="table-cell text-left">Command</div>
         </div>
-        <div class="table-row" ng-repeat="container in vm.containers">
+        <div class="table-row" ng-repeat="container in vm.containers track by container.id">
             <div class="table-cell text-left">{{ container.name }}</div>
             <div class="table-cell" ng-class="container.status == 'Paused' ? 'careful' : 'ok'">{{ container.status }}
             </div>

glances/outputs/static/js/components/plugin-load/controller.js

@@ -25,9 +25,9 @@ function GlancesPluginLoadController($scope, GlancesStats) {
         vm.min1 = stats['min1'];
         vm.min5 = stats['min5'];
         vm.min15 = stats['min15'];
-    }
+    };
 
-    this.getDecoration = function (value) {
+    vm.getDecoration = function (value) {
         if (_view[value] === undefined) {
             return;
         }

glances/outputs/static/js/components/plugin-mem/controller.js

@@ -27,7 +27,7 @@ function GlancesPluginMemController($scope, GlancesStats) {
         vm.free = stats['free'];
     }
 
-    this.getDecoration = function (value) {
+    vm.getDecoration = function (value) {
         if (_view[value] === undefined) {
             return;
         }

glances/outputs/static/js/components/plugin-memswap/controller.js

@@ -25,9 +25,9 @@ function GlancesPluginMemswapController($scope, GlancesStats) {
         vm.total = stats['total'];
         vm.used = stats['used'];
         vm.free = stats['free'];
-    }
+    };
 
-    this.getDecoration = function (value) {
+    vm.getDecoration = function (value) {
         if (_view[value] === undefined) {
             return;
         }

glances/outputs/static/js/components/plugin-quicklook/controller.js

@@ -39,9 +39,9 @@ function GlancesPluginQuicklookController($scope, GlancesStats, ARGUMENTS) {
                 'total': cpu.total
             });
         }, this);
-    }
+    };
 
-    this.getDecoration = function (value) {
+    vm.getDecoration = function (value) {
         if (_view[value] === undefined) {
             return;
         }

glances/outputs/static/js/components/plugin-raid/controller.js

@@ -40,11 +40,11 @@ function GlancesPluginRaidController($scope, GlancesStats) {
         });
 
         vm.disks = disks;
-    }
+    };
 
     vm.hasDisks = function () {
-        return this.disks.length > 0;
-    }
+        return vm.disks.length > 0;
+    };
 
     vm.getAlert = function (disk) {
         if (disk.inactive) {
@@ -56,5 +56,5 @@ function GlancesPluginRaidController($scope, GlancesStats) {
         }
 
         return 'ok'
-    }
+    };
 }

glances/outputs/static/js/components/plugin-sensors/controller.js

@@ -20,7 +20,7 @@ function GlancesPluginSensorsController($scope, GlancesStats, GlancesPluginHelpe
         });
 
         vm.sensors = data;
-    }
+    };
 
     vm.getAlert = function (sensor) {
         var current = sensor.type == 'battery' ? 100 - sensor.value : sensor.value;

glances/outputs/static/js/components/plugin-wifi/controller.js

@@ -17,6 +17,7 @@ function GlancesPluginWifiController($scope, $filter, GlancesStats) {
     var loadData = function (data) {
         var stats = data.stats['wifi'];
         _view = data.views['wifi'];
+        //stats = [{"ssid": "Freebox-40A258", "encrypted": true, "signal": -45, "key": "ssid", "encryption_type": "wpa2", "quality": "65/70"}];
 
         vm.hotspots = [];
         for (var i = 0; i < stats.length; i++) {
@@ -35,10 +36,10 @@ function GlancesPluginWifiController($scope, $filter, GlancesStats) {
         }
 
         vm.hotspots = $filter('orderBy')(vm.hotspots, 'ssid');
-    }
+    };
 
     vm.getDecoration = function (hotpost, field) {
-        if (_view[hotpost.ssid][field] == undefined) {
+        if (_view[hotpost.ssid][field] === undefined) {
             return;
         }
 

glances/outputs/static/js/components/plugin-wifi/view.html

-<section id="wifi" class="plugin table-row-group" ng-if="vm.hotspots.length > 0">
-    <div class="table-row">
-        <div class="table-cell text-left title">WIFI</div>
-        <div class="table-cell"></div>
-        <div class="table-cell">dBm</div>
+<div class="table-row" ng-if="vm.hotspots.length > 0">
+    <div class="table-cell text-left title">WIFI</div>
+    <div class="table-cell"></div>
+    <div class="table-cell">dBm</div>
+</div>
+<div class="table-row" ng-repeat="hotspot in vm.hotspots">
+    <div class="table-cell text-left">{{ hotspot.ssid|limitTo:20 }} <span ng-if="hotspot.encrypted">{{ hotspot.encryption_type }}</span>
     </div>
-    <div class="table-row" ng-repeat="hotspot in vm.hotspots track by ssid">
-        <div class="table-cell text-left">{{ hotspot.ssid|limitTo:20 }} <span ng-if="hotspot.encrypted">{{ hotspot.encryption_type }}</span>
-        </div>
-        <div class="table-cell"></div>
-        <div class="table-cell" ng-class="vm.getDecoration(hotspot, 'signal')">{{ hotspot.signal }}</div>
-    </div>
-</section>
+    <div class="table-cell"></div>
+    <div class="table-cell" ng-class="vm.getDecoration(hotspot, 'signal')">{{ hotspot.signal }}</div>
+</div>