Convert size with a pipe

dashboard/src/app/app.module.ts

@@ -16,6 +16,7 @@ import { AppRoutingModule } from './app-routing.module';
 import { ConvertMsPipe } from './convertms.pipe';
 import { ConvertMoreExactPipe } from './convert-more-exact.pipe';
 import { SortByPipe } from './sort-by.pipe';
+import { ConvertSizeToStringPipe } from './convert-size-to-string.pipe';
 
 @NgModule({
   imports: [
@@ -32,7 +33,8 @@ import { SortByPipe } from './sort-by.pipe';
     SongTableComponent,
     ConvertMsPipe,
     ConvertMoreExactPipe,
-    SortByPipe
+    SortByPipe,
+    ConvertSizeToStringPipe
   ],
   providers: [
     ElsService

dashboard/src/app/convert-size-to-string.pipe.spec.ts

@@ -0,0 +1,8 @@
+import { ConvertSizeToStringPipe } from './convert-size-to-string.pipe';
+
+describe('ConvertSizeToStringPipe', () => {
+  it('create an instance', () => {
+    const pipe = new ConvertSizeToStringPipe();
+    expect(pipe).toBeTruthy();
+  });
+});

dashboard/src/app/convert-size-to-string.pipe.ts

@@ -0,0 +1,22 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'convertSizeToString'
+})
+export class ConvertSizeToStringPipe implements PipeTransform {
+
+  transform(size: number): any {
+    const units = ['Bytes', 'KiB', 'MiB', 'GiB', 'TiB'];
+
+    if (size === 0) {
+      return '0 Byte';
+    }
+
+    const i = Math.floor(Math.log(size) / Math.log(1024));
+    let calcSize = size / Math.pow(1024, i);
+    calcSize = Math.round(calcSize * 100) / 100;
+
+    return calcSize + ' ' + units[i];
+  }
+
+}

dashboard/src/app/dashboard.component.html

@@ -30,8 +30,8 @@
                     </div>
                     <div class="col-xs-9 text-right">
                         <div>
-                            <h3 *ngIf="!totalSizeSt"><span class="glyphicon glyphicon-refresh loading"></span></h3>
-                            <h3 *ngIf="totalSizeSt">{{totalSizeSt}}</h3>
+                            <h3 *ngIf="!totalSize"><span class="glyphicon glyphicon-refresh loading"></span></h3>
+                            <h3 *ngIf="totalSize">{{totalSize | convertSizeToString}}</h3>
                         </div>
                         <div><br>Total size</div>
                     </div>

dashboard/src/app/dashboard.component.ts

@@ -15,7 +15,6 @@ import { Artist } from './object/artist';
 export class DashboardComponent implements OnInit {
   totalTime = 0;
   totalSize = 0;
-  totalSizeSt = '';
   trackCountSong = 0;
   trackCountArtist = 0;
   trackCountAlbum = 0;
@@ -38,10 +37,7 @@ export class DashboardComponent implements OnInit {
       this.totalTime = result;
     });
 
-    this.elsService.getSize().then(result => {
-      this.totalSize = result;
-      this.totalSizeSt = this.convertSizeToString(result);
-    });
+    this.elsService.getSize().then(result => this.totalSize = result);
 
     this.elsService.getCountSong('song')
       .then(result => this.trackCountSong = result);
@@ -93,23 +89,4 @@ export class DashboardComponent implements OnInit {
       }
     });
   }
-
-
-  /**
-   * UTILS FUNCTION - TODO MOVE
-   */
-
-  convertSizeToString(size: number) {
-    const units = ['Bytes', 'KiB', 'MiB', 'GiB', 'TiB'];
-
-    if (size === 0) {
-      return '0 Byte';
-    }
-
-    const i = Math.floor(Math.log(size) / Math.log(1024));
-    let calcSize = size / Math.pow(1024, i);
-    calcSize = Math.round(calcSize * 100) / 100;
-
-    return calcSize + ' ' + units[i];
-  }
 }