fix(general): fix the size display using the filesize library (#246)

* fix(general): fix the size display using the filesize library

* refactor(humansize): use default value for filter

app/components/dashboard/dashboard.html

@@ -53,7 +53,7 @@
             </tr>
             <tr>
               <td>Total memory</td>
-              <td>{{ infoData.MemTotal|humansize }}</td>
+              <td>{{ infoData.MemTotal|humansize: 2 }}</td>
             </tr>
           </tbody>
         </table>

app/components/stats/statsController.js

@@ -87,7 +87,7 @@ function (Settings, $scope, Messages, $timeout, Container, ContainerTop, $stateP
     },
     {
       scaleLabel: function (valueObj) {
-        return humansizeFilter(parseInt(valueObj.value, 10));
+        return humansizeFilter(parseInt(valueObj.value, 10), 2);
       },
       responsive: true
       //scaleOverride: true,
@@ -100,7 +100,7 @@ function (Settings, $scope, Messages, $timeout, Container, ContainerTop, $stateP
       datasets: [networkRxDataset, networkTxDataset]
     }, {
       scaleLabel: function (valueObj) {
-        return humansizeFilter(parseInt(valueObj.value, 10));
+        return humansizeFilter(parseInt(valueObj.value, 10), 2);
       },
       responsive: true
     });

app/components/swarm/swarm.html

@@ -42,8 +42,8 @@
             </tr>
             <tr>
               <td>Total memory</td>
-              <td ng-if="!swarm_mode">{{ info.MemTotal|humansize }}</td>
-              <td ng-if="swarm_mode">{{ totalMemory|humansize }}</td>
+              <td ng-if="!swarm_mode">{{ info.MemTotal|humansize: 2 }}</td>
+              <td ng-if="swarm_mode">{{ totalMemory|humansize: 2 }}</td>
             </tr>
             <tr ng-if="!swarm_mode">
               <td>Operating system</td>

app/shared/filters.js

@@ -123,15 +123,13 @@ angular.module('portainer.filters', [])
 })
 .filter('humansize', function () {
   'use strict';
-  return function (bytes) {
-    var sizes = ['Bytes', 'KB', 'MB', 'GB', 'TB'];
-    if (bytes === 0) {
-      return 'n/a';
+  return function (bytes, round) {
+    if (!round) {
+      round = 1;
+    }
+    if (bytes || bytes === 0) {
+      return filesize(bytes, {base: 10, round: round});
     }
-    var i = parseInt(Math.floor(Math.log(bytes) / Math.log(1024)), 10);
-    var value = bytes / Math.pow(1024, i);
-    var decimalPlaces = (i < 1) ? 0 : (i - 1);
-    return value.toFixed(decimalPlaces) + ' ' + sizes[[i]];
   };
 })
 .filter('containername', function () {

bower.json

@@ -34,6 +34,7 @@
     "angular-ui-select": "~0.17.1",
     "bootstrap": "~3.3.6",
     "font-awesome": "~4.6.3",
+    "filesize": "~3.3.0",
     "Hover": "2.0.2",
     "jquery": "1.11.1",
     "jquery.gritter": "1.7.4",

gruntFile.js

@@ -71,6 +71,7 @@ module.exports = function (grunt) {
                 'bower_components/bootstrap/dist/js/bootstrap.min.js',
                 'bower_components/Chart.js/Chart.min.js',
                 'bower_components/lodash/dist/lodash.min.js',
+                'bower_components/filesize/lib/filesize.min.js',
                 'bower_components/moment/min/moment.min.js',
                 'bower_components/xterm.js/src/xterm.js',
                 'assets/js/jquery.gritter.js', // Using custom version to fix error in minified build due to "use strict"

test/unit/app/shared/filters.spec.js

@@ -82,32 +82,6 @@ describe('filters', function () {
         }));
     });
 
-    describe('humansize', function () {
-        it('should return n/a when size is zero', inject(function (humansizeFilter) {
-            expect(humansizeFilter(0)).toBe('n/a');
-        }));
-
-        it('should handle Bytes values', inject(function (humansizeFilter) {
-            expect(humansizeFilter(512)).toBe('512 Bytes');
-        }));
-
-        it('should handle KB values', inject(function (humansizeFilter) {
-            expect(humansizeFilter(5 * 1024)).toBe('5 KB');
-        }));
-
-        it('should handle MB values', inject(function (humansizeFilter) {
-            expect(humansizeFilter(5 * 1024 * 1024)).toBe('5.0 MB');
-        }));
-
-        it('should handle GB values', inject(function (humansizeFilter) {
-            expect(humansizeFilter(5 * 1024 * 1024 * 1024)).toBe('5.00 GB');
-        }));
-
-        it('should handle TB values', inject(function (humansizeFilter) {
-            expect(humansizeFilter(5 * 1024 * 1024 * 1024 * 1024)).toBe('5.000 TB');
-        }));
-    });
-
     describe('containername', function () {
         it('should strip the leading slash from container name', inject(function (containernameFilter) {
             var container = {