Els Service: get Artists

Add link with angular-tag-cloud
It's OK with angular4-word-cloud
2017-10-13 20:32:28 +02:00 · 2017-10-13 20:00:09 +02:00 · 2017-10-13 19:59:44 +02:00 · 2017-10-12 01:19:10 +02:00 · 2017-10-12 00:31:20 +02:00 · 2017-10-12 00:27:50 +02:00
126 changed files with 26741 additions and 16079 deletions
--- a/.gitignore
+++ b/.gitignore
@@ -1,18 +0,0 @@
-node_modules/
-.vscode/
-/es-albums.json
-/es-artists.json
-/es-songs.json
-/iTunesLibrary.xml
-
-# Working files
-*.txt
-*.code-workspace
-
-# Snippets for tests
-snippet.py
-snippet.js
-dashboard/resultToStudy.json
-sand_box.py
-rating_test.py
-iTunesGraphParser.my.py
--- a/check_id.py
+++ b/check_id.py
@@ -1,26 +0,0 @@
-import json
-
-files = ['es-songs.json', 'es-artists.json', 'es-albums.json']
-
-ids = []
-bad_lines = {}
-
-for file in files:
-    with open(file) as fp:
-        line = fp.readline()
-
-        while line:
-            content = json.loads(line)
-            if 'index' in content:
-                id = content['index']['_id']
-                if id in ids:
-                    bad_lines[id] = content
-                else:
-                    ids.append(id)
-            line = fp.readline()
-
-if not bad_lines:
-    print("No duplicate ID's found, everything's fine!!")
-else:
-    print('KO')
-    print(bad_lines)
--- a/dashboard/.angular-cli.json
+++ b/dashboard/.angular-cli.json
@@ -0,0 +1,63 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "project": {
+    "name": "dashboard"
+  },
+  "apps": [
+    {
+      "root": "src",
+      "outDir": "dist",
+      "assets": [
+        "assets",
+        "favicon.ico"
+      ],
+      "index": "index.html",
+      "main": "main.ts",
+      "polyfills": "polyfills.ts",
+      "test": "test.ts",
+      "tsconfig": "tsconfig.app.json",
+      "testTsconfig": "tsconfig.spec.json",
+      "prefix": "app",
+      "styles": [
+        "styles.css",
+        "../node_modules/bootstrap/dist/css/bootstrap.min.css"
+      ],
+      "scripts": [
+        "../node_modules/angular4-word-cloud/d3.min.js"
+      ],
+      "environmentSource": "environments/environment.ts",
+      "environments": {
+        "dev": "environments/environment.ts",
+        "prod": "environments/environment.prod.ts"
+      }
+    }
+  ],
+  "e2e": {
+    "protractor": {
+      "config": "./protractor.conf.js"
+    }
+  },
+  "lint": [
+    {
+      "project": "src/tsconfig.app.json",
+      "exclude": "**/node_modules/**"
+    },
+    {
+      "project": "src/tsconfig.spec.json",
+      "exclude": "**/node_modules/**"
+    },
+    {
+      "project": "e2e/tsconfig.e2e.json",
+      "exclude": "**/node_modules/**"
+    }
+  ],
+  "test": {
+    "karma": {
+      "config": "./karma.conf.js"
+    }
+  },
+  "defaults": {
+    "styleExt": "css",
+    "component": {}
+  }
+}
--- a/dashboard/README.md
+++ b/dashboard/README.md
@@ -1,27 +0,0 @@
-# Dashboard
-
-This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 11.0.4.
-
-## Development server
-
-Run `ng serve` for a dev server. Navigate to `http://localhost:4200/`. The app will automatically reload if you change any of the source files.
-
-## Code scaffolding
-
-Run `ng generate component component-name` to generate a new component. You can also use `ng generate directive|pipe|service|class|guard|interface|enum|module`.
-
-## Build
-
-Run `ng build` to build the project. The build artifacts will be stored in the `dist/` directory. Use the `--prod` flag for a production build.
-
-## Running unit tests
-
-Run `ng test` to execute the unit tests via [Karma](https://karma-runner.github.io).
-
-## Running end-to-end tests
-
-Run `ng e2e` to execute the end-to-end tests via [Protractor](http://www.protractortest.org/).
-
-## Further help
-
-To get more help on the Angular CLI use `ng help` or go check out the [Angular CLI Overview and Command Reference](https://angular.io/cli) page.
--- a/dashboard/angular.json
+++ b/dashboard/angular.json
@@ -1,126 +0,0 @@
-{
-  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
-  "version": 1,
-  "newProjectRoot": "projects",
-  "projects": {
-    "dashboard": {
-      "projectType": "application",
-      "schematics": {},
-      "root": "",
-      "sourceRoot": "src",
-      "prefix": "app",
-      "architect": {
-        "build": {
-          "builder": "@angular-devkit/build-angular:browser",
-          "options": {
-            "outputPath": "dist/dashboard",
-            "index": "src/index.html",
-            "main": "src/main.ts",
-            "tsConfig": "tsconfig.app.json",
-            "polyfills": "src/polyfills.ts",
-            "aot": true,
-            "assets": [
-              "src/assets",
-              "src/favicon.ico"
-            ],
-            "styles": [
-              "src/styles.css",
-              "node_modules/bootstrap/dist/css/bootstrap.min.css"
-            ],
-            "scripts": []
-          },
-          "configurations": {
-            "production": {
-              "fileReplacements": [
-                {
-                  "replace": "src/environments/environment.ts",
-                  "with": "src/environments/environment.prod.ts"
-                }
-              ],
-              "optimization": true,
-              "outputHashing": "all",
-              "sourceMap": false,
-              "namedChunks": false,
-              "extractLicenses": true,
-              "vendorChunk": false,
-              "buildOptimizer": true,
-              "budgets": [
-                {
-                  "type": "initial",
-                  "maximumWarning": "2mb",
-                  "maximumError": "5mb"
-                },
-                {
-                  "type": "anyComponentStyle",
-                  "maximumWarning": "6kb",
-                  "maximumError": "10kb"
-                }
-              ]
-            }
-          }
-        },
-        "serve": {
-          "builder": "@angular-devkit/build-angular:dev-server",
-          "options": {
-            "browserTarget": "dashboard:build"
-          },
-          "configurations": {
-            "production": {
-              "browserTarget": "dashboard:build:production"
-            }
-          }
-        },
-        "extract-i18n": {
-          "builder": "@angular-devkit/build-angular:extract-i18n",
-          "options": {
-            "browserTarget": "dashboard:build"
-          }
-        },
-        "test": {
-          "builder": "@angular-devkit/build-angular:karma",
-          "options": {
-            "main": "src/test.ts",
-            "polyfills": "src/polyfills.ts",
-            "tsConfig": "tsconfig.spec.json",
-            "karmaConfig": "karma.conf.js",
-            "assets": [
-              "src/assets",
-              "src/favicon.ico"
-            ],
-            "styles": [
-              "src/styles.css",
-              "node_modules/bootstrap/dist/css/bootstrap.min.css"
-            ],
-            "scripts": []
-          }
-        },
-        "lint": {
-          "builder": "@angular-devkit/build-angular:tslint",
-          "options": {
-            "tsConfig": [
-              "tsconfig.app.json",
-              "tsconfig.spec.json",
-              "e2e/tsconfig.json"
-            ],
-            "exclude": [
-              "**/node_modules/**"
-            ]
-          }
-        },
-        "e2e": {
-          "builder": "@angular-devkit/build-angular:protractor",
-          "options": {
-            "protractorConfig": "e2e/protractor.conf.js",
-            "devServerTarget": "dashboard:serve"
-          },
-          "configurations": {
-            "production": {
-              "devServerTarget": "dashboard:serve:production"
-            }
-          }
-        }
-      }
-    }
-  },
-  "defaultProject": "dashboard"
-}
--- a/dashboard/e2e/app.e2e-spec.ts
+++ b/dashboard/e2e/app.e2e-spec.ts
@@ -0,0 +1,14 @@
+import { AppPage } from './app.po';
+
+describe('dashboard App', () => {
+  let page: AppPage;
+
+  beforeEach(() => {
+    page = new AppPage();
+  });
+
+  it('should display welcome message', () => {
+    page.navigateTo();
+    expect(page.getParagraphText()).toEqual('Welcome to app!');
+  });
+});
--- a/dashboard/e2e/app.po.ts
+++ b/dashboard/e2e/app.po.ts
@@ -0,0 +1,11 @@
+import { browser, by, element } from 'protractor';
+
+export class AppPage {
+  navigateTo() {
+    return browser.get('/');
+  }
+
+  getParagraphText() {
+    return element(by.css('app-root h1')).getText();
+  }
+}
--- a/dashboard/e2e/src/app.e2e-spec.ts
+++ b/dashboard/e2e/src/app.e2e-spec.ts
@@ -1,23 +0,0 @@
-import { AppPage } from './app.po';
-import { browser, logging } from 'protractor';
-
-describe('workspace-project App', () => {
-  let page: AppPage;
-
-  beforeEach(() => {
-    page = new AppPage();
-  });
-
-  it('should display welcome message', async () => {
-    await page.navigateTo();
-    expect(await page.getTitleText()).toEqual('dashboard app is running!');
-  });
-
-  afterEach(async () => {
-    // Assert that there are no errors emitted from the browser
-    const logs = await browser.manage().logs().get(logging.Type.BROWSER);
-    expect(logs).not.toContain(jasmine.objectContaining({
-      level: logging.Level.SEVERE,
-    } as logging.Entry));
-  });
-});
--- a/dashboard/e2e/src/app.po.ts
+++ b/dashboard/e2e/src/app.po.ts
@@ -1,11 +0,0 @@
-import { browser, by, element } from 'protractor';
-
-export class AppPage {
-  async navigateTo(): Promise<unknown> {
-    return browser.get(browser.baseUrl);
-  }
-
-  async getTitleText(): Promise<string> {
-    return element(by.css('app-root .content span')).getText();
-  }
-}
--- a/dashboard/e2e/tsconfig.e2e.json
+++ b/dashboard/e2e/tsconfig.e2e.json
@@ -1,12 +1,13 @@
-/* To learn more about this file see: https://angular.io/config/tsconfig. */
 {
  "extends": "../tsconfig.json",
  "compilerOptions": {
    "outDir": "../out-tsc/e2e",
+    "baseUrl": "./",
    "module": "commonjs",
-    "target": "es2018",
+    "target": "es5",
    "types": [
      "jasmine",
+      "jasminewd2",
      "node"
    ]
  }
--- a/dashboard/karma.conf.js
+++ b/dashboard/karma.conf.js
@@ -4,33 +4,23 @@
 module.exports = function (config) {
  config.set({
    basePath: '',
-    frameworks: ['jasmine', '@angular-devkit/build-angular'],
+    frameworks: ['jasmine', '@angular/cli'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher'),
      require('karma-jasmine-html-reporter'),
-      require('karma-coverage'),
-      require('@angular-devkit/build-angular/plugins/karma')
+      require('karma-coverage-istanbul-reporter'),
+      require('@angular/cli/plugins/karma')
    ],
-    client: {
-      jasmine: {
-        // you can add configuration options for Jasmine here
-        // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
-        // for example, you can disable the random execution with `random: false`
-        // or set a specific seed with `seed: 4321`
-      },
+    client:{
      clearContext: false // leave Jasmine Spec Runner output visible in browser
    },
-    jasmineHtmlReporter: {
-      suppressAll: true // removes the duplicated traces
+    coverageIstanbulReporter: {
+      reports: [ 'html', 'lcovonly' ],
+      fixWebpackSourcePaths: true
    },
-    coverageReporter: {
-      dir: require('path').join(__dirname, './coverage/dashboard'),
-      subdir: '.',
-      reporters: [
-        { type: 'html' },
-        { type: 'text-summary' }
-      ]
+    angularCli: {
+      environment: 'dev'
    },
    reporters: ['progress', 'kjhtml'],
    port: 9876,
@@ -38,7 +28,6 @@ module.exports = function (config) {
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome'],
-    singleRun: false,
-    restartOnFileChange: true
+    singleRun: false
  });
 };
--- a/dashboard/package-lock.json
+++ b/dashboard/package-lock.json
--- a/dashboard/package.json
+++ b/dashboard/package.json
@@ -1,6 +1,7 @@
 {
  "name": "dashboard",
  "version": "0.0.0",
+  "license": "MIT",
  "scripts": {
    "ng": "ng",
    "start": "ng serve",
@@ -11,36 +12,42 @@
  },
  "private": true,
  "dependencies": {
-    "@angular/animations": "~11.0.4",
-    "@angular/common": "~11.0.4",
-    "@angular/compiler": "~11.0.4",
-    "@angular/core": "~11.0.4",
-    "@angular/forms": "~11.0.4",
-    "@angular/platform-browser": "~11.0.4",
-    "@angular/platform-browser-dynamic": "~11.0.4",
-    "@angular/router": "~11.0.4",
-    "rxjs": "~6.6.0",
-    "zone.js": "~0.10.2",
-    "bootstrap": "^3.3.7",
-    "tslib": "^2.0.0"
+    "@angular/animations": "^4.2.4",
+    "@angular/common": "^4.2.4",
+    "@angular/compiler": "^4.2.4",
+    "@angular/core": "^4.2.4",
+    "@angular/forms": "^4.2.4",
+    "@angular/http": "^4.2.4",
+    "@angular/platform-browser": "^4.2.4",
+    "@angular/platform-browser-dynamic": "^4.2.4",
+    "@angular/router": "^4.2.4",
+    "angular-tag-cloud-module": "^1.4.0",
+    "angular4-word-cloud": "^0.1.2",
+    "bootstrap": "3.3.7",
+    "core-js": "^2.4.1",
+    "d3": "^4.11.0",
+    "rxjs": "^5.4.2",
+    "zone.js": "^0.8.14"
  },
  "devDependencies": {
-    "@angular-devkit/build-angular": "~0.1100.4",
-    "@angular/cli": "~11.0.4",
-    "@angular/compiler-cli": "~11.0.4",
-    "@types/jasmine": "~3.6.0",
-    "@types/node": "^12.11.1",
-    "codelyzer": "^6.0.0",
-    "jasmine-core": "~3.6.0",
-    "jasmine-spec-reporter": "~5.0.0",
-    "karma": "~5.1.0",
-    "karma-chrome-launcher": "~3.1.0",
-    "karma-coverage": "~2.0.3",
-    "karma-jasmine": "~4.0.0",
-    "karma-jasmine-html-reporter": "^1.5.0",
-    "protractor": "~7.0.0",
-    "ts-node": "~8.3.0",
-    "tslint": "~6.1.0",
-    "typescript": "~4.0.2"
+    "@angular/cli": "1.3.2",
+    "@angular/compiler-cli": "^4.2.4",
+    "@angular/language-service": "^4.2.4",
+    "@types/jasmine": "~2.5.53",
+    "@types/jasminewd2": "~2.0.2",
+    "@types/node": "~6.0.60",
+    "codelyzer": "~3.1.1",
+    "jasmine-core": "~2.6.2",
+    "jasmine-spec-reporter": "~4.1.0",
+    "karma": "~1.7.0",
+    "karma-chrome-launcher": "~2.1.1",
+    "karma-cli": "~1.0.1",
+    "karma-coverage-istanbul-reporter": "^1.2.1",
+    "karma-jasmine": "~1.1.0",
+    "karma-jasmine-html-reporter": "^0.2.2",
+    "protractor": "~5.1.2",
+    "ts-node": "~3.2.0",
+    "tslint": "~5.3.2",
+    "typescript": "~2.3.3"
  }
 }
--- a/dashboard/protractor.conf.js
+++ b/dashboard/protractor.conf.js
@@ -0,0 +1,28 @@
+// Protractor configuration file, see link for more information
+// https://github.com/angular/protractor/blob/master/lib/config.ts
+
+const { SpecReporter } = require('jasmine-spec-reporter');
+
+exports.config = {
+  allScriptsTimeout: 11000,
+  specs: [
+    './e2e/**/*.e2e-spec.ts'
+  ],
+  capabilities: {
+    'browserName': 'chrome'
+  },
+  directConnect: true,
+  baseUrl: 'http://localhost:4200/',
+  framework: 'jasmine',
+  jasmineNodeOpts: {
+    showColors: true,
+    defaultTimeoutInterval: 30000,
+    print: function() {}
+  },
+  onPrepare() {
+    require('ts-node').register({
+      project: 'e2e/tsconfig.e2e.json'
+    });
+    jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
+  }
+};
--- a/dashboard/src/app/album/album.component.css
+++ b/dashboard/src/app/album/album.component.css
@@ -0,0 +1,37 @@
+/* Thank to https://codyhouse.co/gem/back-to-top/ */
+
+.btn-top {
+  display: inline-block;
+  height: 40px;
+  width: 40px;
+  position: fixed;
+  bottom: 20px;
+  right: 20px;
+  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
+  /* image replacement properties */
+  /*overflow: hidden;*/
+  /*text-indent: 100%;*/
+  /*white-space: nowrap;*/
+  /*background: rgba(232, 98, 86, 0.8);*/
+  /*background: #ff9000;*/
+  visibility: hidden;
+  opacity: 0;
+  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
+  -moz-transition: opacity .3s 0s, visibility 0s .3s;
+  transition: opacity .3s 0s, visibility 0s .3s;
+}
+.btn-top.btn-top-is-visible, .no-touch .btn-top:hover {
+  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
+  -moz-transition: opacity .3s 0s, visibility 0s 0s;
+  transition: opacity .3s 0s, visibility 0s 0s;
+}
+.btn-top.btn-top-is-visible {
+  /* the button becomes visible */
+  visibility: visible;
+  opacity: 1;
+}
+
+.btn-sort {
+  bottom: 20px;
+  right: 70px;
+}
--- a/dashboard/src/app/album/album.component.html
+++ b/dashboard/src/app/album/album.component.html
@@ -10,7 +10,7 @@
  </div>

  <div class="row cardAdmin">
-      <div class="col-lg-3 col-md-3 col-sm-6">
+      <div class="col-lg-3 col-md-3">
          <div class="panel panel-yellow">
              <div class="panel-heading">
                  <div class="row">
@@ -28,7 +28,7 @@
              </div>
          </div>
      </div>
-      <div class="col-lg-3 col-md-3 col-sm-6">
+      <div class="col-lg-3 col-md-3">
          <div class="panel panel-green">
              <div class="panel-heading">
                  <div class="row">
@@ -46,7 +46,7 @@
              </div>
          </div>
      </div>
-      <div class="col-lg-3 col-md-3 col-sm-6">
+      <div class="col-lg-3 col-md-3">
          <div class="panel panel-purple">
              <div class="panel-heading">
                  <div class="row">
@@ -64,7 +64,7 @@
              </div>
          </div>
      </div>
-      <div class="col-lg-3 col-md-3 col-sm-6">
+      <div class="col-lg-3 col-md-3">
          <div class="panel panel-blue">
              <div class="panel-heading">
                  <div class="row">
@@ -84,9 +84,38 @@
      </div>
  </div>

-  <app-song-table [songs]=songs (atBottom)=loadSongs()></app-song-table>
+  <table class="table table-striped" (window:scroll)="onScroll($event)">
+  <thead>
+      <tr>
+          <th></th>
+          <th>Name</th>
+          <th>Artist</th>
+          <th>Album</th>
+          <th>Album Artist</th>
+          <th>Play Count</th>
+          <th>Genre</th>
+      </tr>
+  </thead>
+  <tbody>
+      <tr *ngFor="let song of songs | sortBy : 'Track Number'">
+          <td>{{song['Track Number'] ? (("0" + song['Track Number']).slice(-2)) : "--"}}</td>
+          <td>{{song.Name}}</td>
+          <td><a [routerLink]="['/artist', song.Artist]">{{song.Artist}}</a></td>
+          <td><a [routerLink]="['/album', song.Album]">{{song.Album}}</a></td>
+          <td>{{song['Album Artist']}}</td>
+          <td>{{song['Play Count']}}</td>
+          <td><a [routerLink]="['/genre', song.Genre]">{{song.Genre}}</a></td>
+      </tr>
+  </tbody>
+  </table>

  <button type="button" *ngIf="moreDataAvailable" class="btn btn-default" aria-label="More" (click)="loadSongs()">
      <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> More...
  </button>
+
+  <!-- Go to Top Button-->
+  <button type="button" class="btn btn-warning btn-top" [class.btn-top-is-visible]="atBottom"
+      aria-label="Top" (click)="scrollTop()">
+      <span class="glyphicon glyphicon-menu-up" aria-hidden="true"></span>
+  </button>
  </div>
--- a/dashboard/src/app/album/album.component.ts
+++ b/dashboard/src/app/album/album.component.ts
@@ -1,28 +1,23 @@
-import { Component, OnInit, ViewChild } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Params } from '@angular/router';
 import { Location } from '@angular/common';

 import { ElsService } from './../els.service';
-import { Song } from './../model/song';
-import { Album } from './../model/album';
-import { SongTableComponent } from '../song-table/song-table.component';
+import { Song } from './../object/song';
+import { Album } from './../object/album';

@Component({
  selector: 'app-album',
  templateUrl: './album.component.html',
-  styleUrls: [ './album.component.css', './../dashboard/dashboard.component.css' ]
+  styleUrls: [ './album.component.css', './../dashboard.component.css' ]
 })

 export class AlbumComponent implements OnInit {
-  @ViewChild(SongTableComponent) private songtable: SongTableComponent;
-
  albumName = '';
  songs: Array<Song> = [];
  album: Album = new Album(); // If album not found, will be replaced by 'undefined'
-
-  // Prevent useless data load + activate button in interface var
-  moreDataAvailable = true;
-  lockLoadData = false;
+  moreDataAvailable = false;
+  atBottom = false;

  constructor(
    private elsService: ElsService,
@@ -40,16 +35,6 @@ export class AlbumComponent implements OnInit {
  }

  loadSongs(): void {
-    if (this.lockLoadData) {
-      console.log('Loading data locked');
-      return;
-    }
-
-    if (!this.moreDataAvailable) {
-      return;
-    }
-
-    this.lockLoadData = true;
    this.elsService.getAlbumSongs(this.albumName, this.songs.length).subscribe(
      data => {
        this.moreDataAvailable = data.length === ElsService.DEFAULT_SIZE;
@@ -59,14 +44,37 @@ export class AlbumComponent implements OnInit {
        if (this.songs.length === 0) {
          this.songs = data;
        } else {
-          this.songtable.setSortable(true);
          data.forEach(song => {
            this.songs.push(song);
          });
        }
-        console.log('Unlock load data');
-        this.lockLoadData = false;
      }
    );
  }
+
+  scrollTop(): void {
+    window.scrollTo(0, 0);
+  }
+
+  /**
+   * Handle scroll:
+   * - load data if at bottom of screen (if needed)
+   * - hide/show "go to top" button
+   *
+   * @param event scroll event
+   */
+  onScroll(event: any) {
+    if (this.moreDataAvailable &&
+          (window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
+        this.loadSongs();
+    }
+
+    if (window.scrollY > window.innerHeight) {
+      this.atBottom = true;
+    }
+
+    if (window.scrollY === 0) {
+      this.atBottom = false;
+    }
+  }
 }
--- a/dashboard/src/app/albums/albums.component.css
+++ b/dashboard/src/app/albums/albums.component.css
@@ -1,34 +0,0 @@
-/***  BOTTOM BUTTON PART  ***/
-/* Thank to https://codyhouse.co/gem/back-to-top/ */
-.btn-top {
-  display: inline-block;
-  height: 40px;
-  width: 40px;
-  position: fixed;
-  bottom: 20px;
-  right: 20px;
-  box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
-  /* image replacement properties */
-  /*overflow: hidden;*/
-  /*text-indent: 100%;*/
-  /*white-space: nowrap;*/
-  /*background: rgba(232, 98, 86, 0.8);*/
-  /*background: #ff9000;*/
-  visibility: hidden;
-  opacity: 0;
-  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
-  -moz-transition: opacity .3s 0s, visibility 0s .3s;
-  transition: opacity .3s 0s, visibility 0s .3s;
-}
-.btn-top.btn-top-is-visible, .no-touch .btn-top:hover {
-  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
-  -moz-transition: opacity .3s 0s, visibility 0s 0s;
-  transition: opacity .3s 0s, visibility 0s 0s;
-}
-.btn-top.btn-top-is-visible {
-  /* the button becomes visible */
-  visibility: visible;
-  opacity: 1;
-}
-
-/***  END BOTTOM BUTTON PART  ***/
--- a/dashboard/src/app/albums/albums.component.html
+++ b/dashboard/src/app/albums/albums.component.html
@@ -1,74 +0,0 @@
-<div class="container">
-  <h1>Albums - {{this.albums.length}}</h1>
-
-<div class="col-md-12">
-  <table class="table table-striped" style="white-space: nowrap;">
-      <thead>
-          <tr>
-              <th>Album</th>
-              <th>Track Count</th>
-              <th></th>
-              <th></th>
-              <th>Artist/Album Artist</th>
-              <th>Avg Bit Rate (min)</th>
-              <th>Play Count</th>
-              <th>Rating</th>
-          </tr>
-      </thead>
-      <tbody>
-          <tr *ngFor="let album of albums">
-              <td>
-                <a [routerLink]="['/album', album.Album]">{{album.Album}}</a>&nbsp;
-                <span class="glyphicon glyphicon-remove-circle" style="cursor:pointer;color:red;" (click)="exlude('Album', album)"></span>
-              </td>
-
-              <td>{{album['Track Count']}}</td>
-
-              <ng-template [ngIf]="album['Album Artist']" [ngIfElse]="artistSection">
-                <td>
-                  <span class="glyphicon glyphicon-ban-circle" style="cursor:pointer;color:red;" (click)="exlude('Album Artist', album)"></span>
-                </td>
-                <td>
-                  <span class="glyphicon glyphicon-zoom-in" style="cursor:pointer;" (click)="select('Album Artist', album)"></span>
-                </td>
-                <td>
-                    <a [routerLink]="['/artist', album['Album Artist']]">{{album['Album Artist']}}</a>&nbsp;
-                </td>
-              </ng-template>
-
-              <ng-template #artistSection>
-                <td>
-                  <span class="glyphicon glyphicon-ban-circle" style="cursor:pointer;color:red;" (click)="exlude('Artist', album)"></span>
-                </td>
-                <td>
-                  <span class="glyphicon glyphicon-zoom-in" style="cursor:pointer;" (click)="select('Artist', album)"></span>
-                </td>
-                <td>
-                    <a [routerLink]="['/artist', album.Artist[0]]">{{album.Artist}}</a>&nbsp;
-                </td>
-              </ng-template>
-
-              <td>
-                {{album['Avg Bit Rate']}}
-                <span *ngIf="album['Avg Bit Rate'] != album['Min Bit Rate']">({{album['Min Bit Rate']}})</span>
-              </td>
-
-              <td>
-                {{album['Play Count']}} ({{album['Play Count']/album['Track Count'] | number:'1.0-0'}}/songs)
-              </td>
-
-              <td class="star" [title]="(album['Album Rating Computed']?'Computed Rating: ':'Rating: ') + album['Album Rating']">
-              <span *ngFor="let item of numberToArray(album['Album Rating'], 20)">
-                <span class="glyphicon" [ngClass]="album['Album Rating Computed']?'glyphicon-star-empty':'glyphicon-star'"></span>
-              </span>
-              </td>
-          </tr>
-      </tbody>
-  </table>
-</div>
-
-<button type="button" class="btn btn-danger btn-top" [class.btn-top-is-visible]="queryEdited"
-  aria-label="Reset filters" (click)="resetQuery()" title="Reset filters and reload datas">
-  <span class="glyphicon glyphicon-refresh" aria-hidden="true"></span>
-</button>
-</div>
--- a/dashboard/src/app/albums/albums.component.spec.ts
+++ b/dashboard/src/app/albums/albums.component.spec.ts
@@ -1,25 +0,0 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { AlbumsComponent } from './albums.component';
-
-describe('AlbumsComponent', () => {
-  let component: AlbumsComponent;
-  let fixture: ComponentFixture<AlbumsComponent>;
-
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
-      declarations: [ AlbumsComponent ]
-    })
-    .compileComponents();
-  });
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(AlbumsComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
--- a/dashboard/src/app/albums/albums.component.ts
+++ b/dashboard/src/app/albums/albums.component.ts
@@ -1,71 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-import { ElsAlbumService } from '../els-album.service';
-
-import { Album } from '../model/album';
-
-import { Utils } from '../utils';
-
-enum query_edit_type {
-  exclude = 'must_not',
-  select = 'must'
-}
-
-@Component({
-  selector: 'app-albums',
-  templateUrl: './albums.component.html',
-  styleUrls: ['./albums.component.css']
-})
-export class AlbumsComponent implements OnInit {
-  numberToArray = Utils.numberToArray;
-  albums: Album[] = [];
-  filterQuery = Object.assign({}, ElsAlbumService.GET_ALBUMS_DEFAULT_QUERY);
-  queryEdited = false;
-
-  constructor(private elsService : ElsAlbumService) { }
-
-  ngOnInit(): void {
-    this.loadData();
-  }
-
-  private editQuery(field: string, value: string, type: query_edit_type): void {
-    // TODO Move this method to a service
-    if (value[field] instanceof Array) {
-      value[field] = value[field][0]
-    }
-
-    // If firt edit, add needed fields in ELS Query
-    if (!this.filterQuery['query']) {
-      this.filterQuery['query']['bool'][type].push({ 'must': [] })
-      this.filterQuery['query']['bool'][type].push({ 'must_not': [] })
-    }
-
-
-    this.filterQuery['query']['bool'][type].push({
-      'match_phrase': {
-        [field]: value[field]
-      }
-    })
-
-    this.queryEdited = true;
-  }
-
-  exlude(field: string, value: string): void {
-    this.editQuery(field, value, query_edit_type.exclude)
-    this.loadData()
-  }
-
-  select(field: string, value: string): void {
-    this.editQuery(field, value, query_edit_type.select)
-    this.loadData()
-  }
-
-  resetQuery(): void {
-    this.filterQuery = Object.assign({}, ElsAlbumService.GET_ALBUMS_DEFAULT_QUERY);
-    this.loadData();
-  }
-
-  loadData(): void {
-    // console.log(JSON.stringify(this.filterQuery))
-    this.elsService.getAlbums(this.filterQuery).subscribe(data => this.albums = data);
-  }
-}
--- a/dashboard/src/app/app-routing.module.ts
+++ b/dashboard/src/app/app-routing.module.ts
@@ -1,21 +1,17 @@
 import { NgModule } from '@angular/core';
 import { RouterModule, Routes } from '@angular/router';

-import { DashboardComponent } from './dashboard/dashboard.component';
+import { DashboardComponent } from './dashboard.component';
 import { AlbumComponent } from './album/album.component';
 import { ArtistComponent } from './artist/artist.component';
 import { GenreComponent } from './genre/genre.component';
-import { TopPlayedComponent } from './top-played/top-played.component';
-import { AlbumsComponent } from './albums/albums.component';

 const routes: Routes = [
  { path: '', redirectTo: '/dashboard', pathMatch: 'full' },
  { path: 'dashboard',  component: DashboardComponent },
  { path: 'album/:name',      component: AlbumComponent },
-  { path: 'album',      component: AlbumsComponent },
  { path: 'artist/:name',      component: ArtistComponent },
-  { path: 'genre/:name',      component: GenreComponent },
-  { path: 'top-played',      component: TopPlayedComponent }
+  { path: 'genre/:name',      component: GenreComponent }
 ];

@NgModule({
--- a/dashboard/src/app/app.component.html
+++ b/dashboard/src/app/app.component.html
@@ -1,5 +1,4 @@
 <nav>
-  <a class="btn-top" routerLink="/dashboard" routerLinkActive="active"><span class="glyphicon glyphicon-home"></span></a><br />
-  <a class="btn-top" routerLink="/album" routerLinkActive="active"><span class="glyphicon glyphicon-cd"></span></a>
+  <a class="btn-top" routerLink="/dashboard" routerLinkActive="active"><span class="glyphicon glyphicon-home"></span></a>
 </nav>
 <router-outlet></router-outlet>
--- a/dashboard/src/app/app.module.ts
+++ b/dashboard/src/app/app.module.ts
@@ -1,51 +1,42 @@
 import { NgModule } from '@angular/core';
 import { BrowserModule } from '@angular/platform-browser';
-import { HttpClientModule } from '@angular/common/http';
+import { HttpModule } from '@angular/http';
+
+import { TagCloudModule } from 'angular-tag-cloud-module';
+import { AgWordCloudModule } from 'angular4-word-cloud';

 import { AppComponent } from './app.component';
-import { DashboardComponent } from './dashboard/dashboard.component';
+import { DashboardComponent } from './dashboard.component';
 import { AlbumComponent } from './album/album.component';
 import { ArtistComponent } from './artist/artist.component';
 import { GenreComponent } from './genre/genre.component';
-import { SongTableComponent } from './song-table/song-table.component';
-import { TopPlayedComponent } from './top-played/top-played.component';

 import { ElsService } from './els.service';
-import { ElsAlbumService } from './els-album.service';

 import { AppRoutingModule } from './app-routing.module';

-import { ConvertMsPipe } from './pipes/convertms.pipe';
-import { ConvertMoreExactPipe } from './pipes/convert-more-exact.pipe';
-import { SortByPipe } from './pipes/sort-by.pipe';
-import { ConvertSizeToStringPipe } from './pipes/convert-size-to-string.pipe';
-import { RoundPipe } from './pipes/round.pipe';
-import { AlbumsComponent } from './albums/albums.component';
+import { ConvertMsPipe } from './convertms.pipe';
+import { SortByPipe } from './sort-by.pipe';

@NgModule({
  imports: [
    BrowserModule,
-    HttpClientModule,
+    HttpModule,
+    TagCloudModule,
+    AgWordCloudModule.forRoot(),
    AppRoutingModule
  ],
  declarations: [
    AppComponent,
    DashboardComponent,
    AlbumComponent,
-    AlbumsComponent,
    ArtistComponent,
    GenreComponent,
-    SongTableComponent,
    ConvertMsPipe,
-    ConvertMoreExactPipe,
-    SortByPipe,
-    ConvertSizeToStringPipe,
-    TopPlayedComponent,
-    RoundPipe
+    SortByPipe
  ],
  providers: [
-    ElsService,
-    ElsAlbumService
+    ElsService
  ],
  bootstrap: [ AppComponent ]
 })
--- a/dashboard/src/app/artist/artist.component.html
+++ b/dashboard/src/app/artist/artist.component.html
@@ -3,18 +3,14 @@

  <div class="alert alert-warning">
      <h3>Debug Zone</h3>
-      Returned song:&emsp;{{songs.length}}<br />
-      Theorical song:&emsp;{{ artist ? artist['Track Count'] : ""  }}
+      Returned song: {{songs.length}}<br />
+      Theorical song: {{ artist ? artist['Track Count'] : ""  }}
      <span *ngIf="artist && (songs.length == artist['Track Count'])" class="glyphicon glyphicon-ok" style="color:green"></span>
      <span *ngIf="artist && (songs.length != artist['Track Count'])" class="glyphicon glyphicon-remove" style="color:red"></span>
-      <br />
-      Artist song:&emsp;&emsp;&emsp;{{countSong}}
-      <span *ngIf="artist && (songs.length == countSong)" class="glyphicon glyphicon-ok" style="color:green"></span>
-      <span *ngIf="artist && (songs.length != countSong)" class="glyphicon glyphicon-remove" style="color:red"></span>
  </div>

  <div class="row cardAdmin">
-      <div class="col-lg-3 col-md-3 col-sm-6">
+      <div class="col-lg-3 col-md-3">
          <div class="panel panel-yellow">
              <div class="panel-heading">
                  <div class="row">
@@ -32,7 +28,7 @@
              </div>
          </div>
      </div>
-      <div class="col-lg-3 col-md-3 col-sm-6">
+      <div class="col-lg-3 col-md-3">
          <div class="panel panel-blue">
              <div class="panel-heading">
                  <div class="row">
@@ -50,7 +46,7 @@
              </div>
          </div>
      </div>
-      <div class="col-lg-3 col-md-3 col-sm-6">
+      <div class="col-lg-3 col-md-3">
          <div class="panel panel-green">
              <div class="panel-heading">
                  <div class="row">
@@ -68,7 +64,7 @@
              </div>
          </div>
      </div>
-      <div class="col-lg-3 col-md-3 col-sm-6">
+      <div class="col-lg-3 col-md-3">
          <div class="panel panel-purple">
              <div class="panel-heading">
                  <div class="row">
@@ -89,9 +85,44 @@
      </div>
  </div>

-  <app-song-table [songs]=songs (atBottom)=loadSongs()></app-song-table>
+  <table class="table table-striped" (window:scroll)="onScroll($event)">
+  <thead>
+      <tr>
+          <th></th>
+          <th>Name</th>
+          <th>Album</th>
+          <th>Year</th>
+          <th>Artist</th>
+          <th>Album Artist</th>
+          <th>Play Count</th>
+          <th>Genre</th>
+      </tr>
+  </thead>
+  <tbody>
+      <tr *ngFor="let song of songs | sortBy : 'Year':'Album':'Track Number'">
+          <td>{{song['Track Number'] ? (("0" + song['Track Number']).slice(-2)) : "--"}}</td>
+          <td>{{song.Name}}</td>
+          <td><a [routerLink]="['/album', song.Album]">{{song.Album}}</a></td>
+          <td>{{song.Year}}</td>
+          <td><a [routerLink]="['/artist', song.Artist]">{{song.Artist}}</a></td>
+          <td>{{song['Album Artist'] ? song['Album Artist'] : "-" }}</td>
+          <td>{{song['Play Count']}}</td>
+          <td><a [routerLink]="['/genre', song.Genre]">{{song.Genre}}</a></td>
+      </tr>
+  </tbody>
+  </table>

  <button type="button" *ngIf="moreDataAvailable" class="btn btn-default" aria-label="More" (click)="loadSongs()">
      <span class="glyphicon glyphicon-plus" aria-hidden="true"></span> More...
  </button>
+
+  <!-- Go to Top Button-->
+  <button type="button" class="btn btn-warning btn-top" [class.btn-top-is-visible]="atBottom"
+      aria-label="Top" (click)="scrollTop()" title="Go back to Top!">
+      <span class="glyphicon glyphicon-menu-up" aria-hidden="true"></span>
+  </button>
+  <button type="button" class="btn btn-primary btn-top btn-sort" [class.btn-top-is-visible]="sortable"
+      aria-label="Top" (click)="sort()" title="Sort by Album & Track Number">
+      <span class="glyphicon glyphicon-sort-by-attributes" aria-hidden="true"></span>
+  </button>
  </div>
--- a/dashboard/src/app/artist/artist.component.ts
+++ b/dashboard/src/app/artist/artist.component.ts
@@ -1,30 +1,29 @@
-import { Component, OnInit, ViewChild } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Params } from '@angular/router';
 import { Location } from '@angular/common';

 import { ElsService } from './../els.service';
-import { Song } from './../model/song';
-import { Artist } from './../model/artist';
-import { SongTableComponent } from '../song-table/song-table.component';
+import { Song } from './../object/song';
+import { Artist } from './../object/artist';
+
+import { SortByPipe } from './../sort-by.pipe';

@Component({
  selector: 'app-artist',
  templateUrl: './artist.component.html',
-  styleUrls: [ './../album/album.component.css', './../dashboard/dashboard.component.css', './artist.component.css' ]
+  styleUrls: [ './../album/album.component.css', './../dashboard.component.css' ]
 })

 export class ArtistComponent implements OnInit {
-  // Interacte with table to set sortable
-  @ViewChild(SongTableComponent) songtable: SongTableComponent;
-
-  // Prevent useless data load + activate button in interface var
-  moreDataAvailable = true;
-
  artistName = '';
  songs: Array<Song> = [];
  artist: Artist = new Artist();
+  // To activate button in interface var
+  moreDataAvailable = false;
+  atBottom = false;
+  sortable = false;
+
  lockLoadData = false;
-  countSong: number;

  constructor(
    private elsService: ElsService,
@@ -36,9 +35,6 @@ export class ArtistComponent implements OnInit {
    this.route.params.subscribe((params: Params) => this.artistName = params['name']);

    this.elsService.getArtist(this.artistName).subscribe(data => this.artist = data);
-
-    this.elsService.getCountArtistSong(this.artistName).subscribe(data => this.countSong = data);
-
    this.loadSongs();
  }

@@ -49,10 +45,6 @@ export class ArtistComponent implements OnInit {
      return;
    }

-    if (!this.moreDataAvailable) {
-      return;
-    }
-
    this.lockLoadData = true;
    this.elsService.getArtistSongs(this.artistName, this.songs.length).subscribe(
      data => {
@@ -63,7 +55,7 @@ export class ArtistComponent implements OnInit {
        if (this.songs.length === 0) {
          this.songs = data;
        } else {
-          this.songtable.setSortable(true);
+          this.sortable = true;
          data.forEach(song => {
            this.songs.push(song);
          });
@@ -73,4 +65,35 @@ export class ArtistComponent implements OnInit {
      }
    );
  }
+
+  scrollTop(): void {
+    window.scrollTo(0, 0);
+  }
+
+  /**
+   * Handle scroll:
+   * - load data if at bottom of screen (if needed)
+   * - hide/show "go to top" button
+   *
+   * @param event scroll event
+   */
+  onScroll(event: any) {
+    if (this.moreDataAvailable &&
+          (window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
+        this.loadSongs();
+    }
+
+    if (window.scrollY > window.innerHeight) {
+      this.atBottom = true;
+    }
+
+    if (window.scrollY === 0) {
+      this.atBottom = false;
+    }
+  }
+
+  sort(): void {
+    this.songs = new SortByPipe().transform(this.songs, 'Year', 'Album', 'Track Number', 'Play Count');
+    this.sortable = false;
+  }
 }
--- a/dashboard/src/app/convertms.pipe.spec.ts
+++ b/dashboard/src/app/convertms.pipe.spec.ts
@@ -0,0 +1,8 @@
+import { ConvertmsPipe } from './convertms.pipe';
+
+describe('ConvertmsPipe', () => {
+  it('create an instance', () => {
+    const pipe = new ConvertmsPipe();
+    expect(pipe).toBeTruthy();
+  });
+});
--- a/dashboard/src/app/convertms.pipe.ts
+++ b/dashboard/src/app/convertms.pipe.ts
@@ -0,0 +1,34 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'convertMs'
+})
+export class ConvertMsPipe implements PipeTransform {
+
+  transform(timeMs: number): string {
+    let x = timeMs / 1000;
+
+    const seconds = Math.round(x % 60);
+    x /= 60;
+
+    let minutes = 0;
+    if (x > 1) { minutes = Math.round(x % 60); }
+    x /= 60;
+
+    let hours = 0;
+    if (x > 1) { hours = Math.round(x % 24); }
+    // TODO Enable/disable day
+    x /= 24;
+    const days = Math.round(x);
+
+    // Final string
+    let ret = '';
+    if (days > 0) { ret += ('0' + days).slice(-2) + ':'; }
+    if (hours > 0) { ret += ('0' + hours).slice(-2) + ':'; }
+    if (minutes > 0) { ret += ('0' + minutes).slice(-2) + ':'; }
+    if (seconds > 0) { ret += ('0' + seconds).slice(-2); }
+
+    return ret;
+    // return ('0' + days).slice(-2) + ':' + ('0' + hours).slice(-2) + ':' + ('0' + minutes).slice(-2) + ':' + ('0' + seconds).slice(-2);
+  }
+}
--- a/dashboard/src/app/dashboard/dashboard.component.css
+++ b/dashboard/src/app/dashboard/dashboard.component.css
--- a/dashboard/src/app/dashboard/dashboard.component.html
+++ b/dashboard/src/app/dashboard/dashboard.component.html
@@ -15,7 +15,7 @@
                            <h3 *ngIf="!totalTime"><span class="glyphicon glyphicon-refresh loading"></span></h3>
                            <h3 *ngIf="totalTime">{{totalTime | convertMs}}</h3>
                        </div>
-                        <div><br>Total time ({{totalTime | convertMoreExact}})</div>
+                        <div><br>Total time</div>
                    </div>
                </div>
            </div>
@@ -30,8 +30,8 @@
                    </div>
                    <div class="col-xs-9 text-right">
                        <div>
-                            <h3 *ngIf="!totalSize"><span class="glyphicon glyphicon-refresh loading"></span></h3>
-                            <h3 *ngIf="totalSize">{{totalSize | convertSizeToString}}</h3>
+                            <h3 *ngIf="!totalSizeSt"><span class="glyphicon glyphicon-refresh loading"></span></h3>
+                            <h3 *ngIf="totalSizeSt">{{totalSizeSt}}</h3>
                        </div>
                        <div><br>Total size</div>
                    </div>
@@ -69,7 +69,7 @@
                            <h3 *ngIf="!neverListenSong"><span class="glyphicon glyphicon-refresh loading"></span></h3>
                            <h3 *ngIf="neverListenSong">{{neverListenSong}}</h3>
                        </div>
-                        <div><br>Never list. songs (~{{neverListenSong / trackCountSong * 100 | round}}%)</div>
+                        <div><br>Never list. songs</div>
                    </div>
                </div>
            </div>
@@ -78,12 +78,12 @@
 </div>

 <div class="col-md-12">
+    <h3>Last added albums</h3>
+
    <table class="table table-striped">
        <thead>
            <tr>
                <th>Album</th>
-                <th>Track Count</th>
-                <th>Album Artist</th>
            </tr>
        </thead>
        <tbody>
@@ -96,30 +96,25 @@
    </table>
 </div>

-<input type="button" class="btn btn-primary btn-lg btn-block" value="All Albums" routerLink="/album">
-
-<div class="col-md-12">
 <h3>Top Played Songs</h3>
-    <table class="table table-striped">
-    <thead>
-        <tr>
-            <th>Track Name</th>
-            <th>Artist</th>
-            <th>Album</th>
-            <th>Play Count</th>
-        </tr>
-    </thead>
-    <tbody>
-        <tr *ngFor="let song of mostPlayedSongs">
-            <td><b>{{song.Name}}</b></td>
-            <td><a [routerLink]="['/artist', song.Artist]">{{song.Artist}}</a></td>
-            <td><a [routerLink]="['/album', song.Album]">{{song.Album}}</a></td>
-            <td>{{song['Play Count']}}</td>
-        </tr>
-    </tbody>
-    </table>
-    <h3><a [routerLink]="['/top-played']">Top Played page</a></h3>
-</div>
+<table class="table table-striped">
+<thead>
+    <tr>
+        <th>Track Name</th>
+        <th>Artist</th>
+        <th>Album</th>
+        <th>Play Count</th>
+    </tr>
+</thead>
+<tbody>
+    <tr *ngFor="let song of mostPlayedSongs">
+        <td><b>{{song.Name}}</b></td>
+        <td><a [routerLink]="['/artist', song.Artist]">{{song.Artist}}</a></td>
+        <td><a [routerLink]="['/album', song.Album]">{{song.Album}}</a></td>
+        <td>{{song['Play Count']}}</td>
+    </tr>
+</tbody>
+</table>

 <div class="col-md-6">
    <h3>Top Genres</h3>
@@ -155,4 +150,22 @@
    </tbody>
    </table>
 </div>
+
+<div>
+    <angular-tag-cloud
+      [data]="wordCloud"
+      [width]="options.width"
+      [height]="options.height"
+      [overflow]="options.overflow">
+    </angular-tag-cloud>
+  </div>
+
+
+<div AgWordCloud
+  #word_cloud_chart=ag-word-cloud
+  [wordData]="word_cloud">
+</div>
+
+<button (click)="word_cloud_chart.update()">Toggle tooltip</button>
+
 </div>
--- a/dashboard/src/app/dashboard.component.ts
+++ b/dashboard/src/app/dashboard.component.ts
@@ -0,0 +1,148 @@
+import { Observable } from 'rxjs/Rx';
+import { Component, OnInit, ViewChild, ViewChildren } from '@angular/core';
+
+import { CloudData, CloudOptions } from 'angular-tag-cloud-module';
+import { AgWordCloudData, AgWordCloudDirective } from 'angular4-word-cloud';
+
+import { ElsService } from './els.service';
+import { Song } from './object/song';
+import { Bucket } from './object/bucket';
+import { Album } from './object/album';
+import { Artist } from './object/artist';
+
+@Component({
+  selector: 'app-dashboard',
+  templateUrl: './dashboard.component.html',
+  styleUrls: [ './dashboard.component.css' ]
+})
+
+export class DashboardComponent implements OnInit {
+  totalTime = 0;
+  totalSize = 0;
+  totalSizeSt = '';
+  trackCountSong = 0;
+  trackCountArtist = 0;
+  trackCountAlbum = 0;
+  neverListenSong = 0;
+
+  albumArtistCount = 0;
+
+  topGenres: Bucket[] = [];
+  bottomGenres: Bucket[] = [];
+
+  mostPlayedSongs: Song[] = [];
+
+  lastAddedAlbums: Bucket[] = [];
+  albumArtists = [];
+
+  /**
+   * Test of angular-tag-cloud-module (https://www.npmjs.com/package/angular-tag-cloud-module)
+   */
+  options: CloudOptions = {
+    // if width is between 0 and 1 it will be set to the size of the upper element multiplied by the value
+    width : 1,
+    height : 400,
+    overflow: false,
+  };
+
+  wordCloud: Array<CloudData> = [];
+
+  /**
+   * Test of angular4-word-cloud (https://www.npmjs.com/package/angular4-word-cloud)
+   */
+  word_cloud: Array<AgWordCloudData> = [];
+
+  @ViewChild('word_cloud_chart') testTruc: AgWordCloudDirective;
+
+  constructor(private elsService: ElsService) { }
+
+  ngOnInit(): void {
+    this.elsService.getTime().then(result => {
+      this.totalTime = result;
+    });
+
+    this.elsService.getSize().then(result => {
+      this.totalSize = result;
+      this.totalSizeSt = this.convertSizeToString(result);
+    });
+
+    this.elsService.getCountSong('song')
+      .then(result => this.trackCountSong = result);
+    this.elsService.getCountSong('artist')
+      .then(result => this.trackCountArtist = result);
+    this.elsService.getCountSong('album')
+      .then(result => this.trackCountAlbum = result);
+
+    this.elsService.getCountNeverListenSong()
+      .then(result => this.neverListenSong = result);
+
+    this.elsService.getMostPlayedTrack().subscribe(
+      data => this.mostPlayedSongs = data
+    );
+
+    this.elsService.getGenres().subscribe(data => {
+      this.topGenres = data.slice(0, 10);
+
+      /** angular-tag-cloud-module **/
+      const changedData: Observable<Array<CloudData>> = Observable.of(
+        data.map(element => {
+          return {weight: element.doc_count, text: element.key, link: '/genre/' + element.key};
+        })
+      );
+      changedData.subscribe(res => this.wordCloud = res);
+
+      data.forEach((el) => {
+        this.word_cloud.push({size: el.doc_count, text: el.key});
+      });
+      this.testTruc.update();
+    });
+    this.elsService.getGenres('asc').subscribe(data => this.bottomGenres = data.slice(0, 10).reverse());
+    // this.elsService.getGenreCount().subscribe(data => console.log(data));
+
+    this.elsService.getLastAddedAlbums(6).subscribe(buckets => {
+      this.lastAddedAlbums = buckets;
+      buckets.forEach(bucket => this.getArtistName(bucket));
+    });
+  }
+
+  private getArtistName(albumBucket: Bucket) {
+    // For each bucket.key (album name), search artist.
+    // Use track count to compare
+    this.elsService.getArtistFromAlbumName(albumBucket.key).subscribe(albums => {
+      if (albums.length > 1) {
+        // More than one result for an album name
+        // Search good artist by track count
+        albums.forEach(album => {
+          if (album['Track Count'] === albumBucket.doc_count) {
+            this.albumArtists[album.Name] = album.Artist.toString();
+          }
+        });
+      } else {
+        // Just one artistresult for album name
+        this.albumArtists[albums[0].Name] = albums[0].Artist.toString();
+      }
+      if (this.albumArtists[albums[0].Name].length > 50) {
+        this.albumArtists[albums[0].Name] = this.albumArtists[albums[0].Name].substring(0, 50) + '...';
+      }
+    });
+  }
+
+
+  /**
+   * 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];
+  }
+}
--- a/dashboard/src/app/dashboard/dashboard.component.ts
+++ b/dashboard/src/app/dashboard/dashboard.component.ts
@@ -1,116 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-import { ElsService } from './../els.service';
-import { Song } from './../model/song';
-import { Bucket } from './../model/bucket';
-import { Album } from './../model/album';
-import { Artist } from './../model/artist';
-
-@Component({
-  selector: 'app-dashboard',
-  templateUrl: './dashboard.component.html',
-  styleUrls: [ './dashboard.component.css' ]
-})
-
-export class DashboardComponent implements OnInit {
-  totalTime = 0;
-  totalSize = 0;
-  trackCountSong = 0;
-  trackCountArtist = 0;
-  trackCountAlbum = 0;
-  neverListenSong = 0;
-
-  albumArtistCount = 0;
-
-  topGenres: Bucket[] = [];
-  bottomGenres: Bucket[] = [];
-
-  mostPlayedSongs: Song[] = [];
-
-  lastAddedAlbums: Bucket[] = [];
-  albumArtists = [];
-
-  constructor(private elsService: ElsService) { }
-
-  ngOnInit(): void {
-    this.elsService.getTime().then(result => {
-      this.totalTime = result;
-    });
-
-    this.elsService.getSize().then(result => this.totalSize = result);
-
-    this.elsService.getCountSong(ElsService.SONG_INDEX_NAME)
-      .then(result => this.trackCountSong = result);
-    // TODO: Unused information
-    // this.elsService.getCountSong(ElsService.ARTIST_INDEX_NAME)
-      // .then(result => this.trackCountArtist = result);
-    // this.elsService.getCountSong(ElsService.ALBUM_INDEX_NAME)
-      // .then(result => this.trackCountAlbum = result);
-
-    this.elsService.getCountNeverListenSong()
-      .then(result => this.neverListenSong = result);
-
-    this.elsService.getMostPlayedTrack().subscribe(
-      data => this.mostPlayedSongs = data
-    );
-
-    this.elsService.getGenres().subscribe(data => this.topGenres = data);
-    this.elsService.getGenres('asc').subscribe(data => this.bottomGenres = data);
-    // this.elsService.getGenreCount().subscribe(data => console.log(data));
-
-    const lastAddedAlbumsTemp: Bucket[] = [];
-    const BreakException = {};
-    this.elsService.getLastAddedAlbums(6).subscribe(buckets => {
-      buckets.forEach(bucket => {
-        // console.log(bucket);
-
-        if (lastAddedAlbumsTemp.length === 0) {
-          lastAddedAlbumsTemp.push(bucket);
-        } else {
-          let found = false;
-          lastAddedAlbumsTemp.forEach(element => {
-            if (element.key === bucket.key) {
-              element.doc_count += bucket.doc_count;
-              found = true;
-            }
-          });
-          if (!found) {
-            lastAddedAlbumsTemp.push(bucket);
-          }
-        }
-      });
-      // console.log("alors");
-      // console.log(lastAddedAlbumsTemp);
-
-      this.lastAddedAlbums = lastAddedAlbumsTemp;
-      this.lastAddedAlbums.forEach(bucket => this.getArtistName(bucket));
-    });
-  }
-
-  private getArtistName(albumBucket: Bucket) {
-    // For each bucket.key (album name), search artist.
-    // Use track count to compare
-    this.elsService.getArtistFromAlbumName(albumBucket.key).subscribe(albums => {
-      // Identification of the good album
-      let goodAlbum;
-      if (albums.length > 1) {
-        // More than one result for an album name: search good by track count
-        albums.forEach(album => {
-          if (album['Track Count'] === albumBucket.doc_count) {
-            goodAlbum = album;
-          }
-        });
-      } else {
-        // Just one result for album name
-        goodAlbum = albums[0];
-      }
-
-      this.albumArtists[goodAlbum.Name] = goodAlbum['Album Artist'] ? goodAlbum['Album Artist'].toString() : goodAlbum.Artist.toString();
-
-      // If an album with multiple artist doesn't have 'Album Artist' field - this case should not happen
-      if (this.albumArtists[goodAlbum.Name].length > 50) {
-        this.albumArtists[goodAlbum.Name] = this.albumArtists[goodAlbum.Name].substring(0, 50) + '...';
-      }
-    });
-  }
-}
--- a/dashboard/src/app/els-album.service.spec.ts
+++ b/dashboard/src/app/els-album.service.spec.ts
@@ -1,16 +0,0 @@
-import { TestBed } from '@angular/core/testing';
-
-import { ElsAlbumService } from './els-album.service';
-
-describe('ElsAlbumService', () => {
-  let service: ElsAlbumService;
-
-  beforeEach(() => {
-    TestBed.configureTestingModule({});
-    service = TestBed.inject(ElsAlbumService);
-  });
-
-  it('should be created', () => {
-    expect(service).toBeTruthy();
-  });
-});
--- a/dashboard/src/app/els-album.service.ts
+++ b/dashboard/src/app/els-album.service.ts
@@ -1,96 +0,0 @@
-import { Injectable } from '@angular/core';
-import { HttpClient, HttpHeaders } from '@angular/common/http'
-
-import { Observable } from 'rxjs';
-import { map, catchError } from 'rxjs/operators';
-
-import { Album } from './model/album';
-import { ElsService } from './els.service';
-
-@Injectable()
-export class ElsAlbumService extends ElsService {
-  public static readonly GET_ALBUMS_DEFAULT_QUERY = {
-    'query': {
-      'bool': {
-        'must': [],
-        'must_not': [],
-        'filter': [
-          { 'range': { 'Avg Bit Rate': { 'lte': '128'}}}
-        ]
-      }
-    },
-    'sort': [ {
-      '_script' : {
-          'type' : 'number',
-          'script' : {
-              'lang': 'painless',
-              'source': 'doc[\'Play Count\'].value / doc[\'Track Count\'].value'
-          },
-          'order' : 'desc'
-      }
-  }, {
-    'Avg Bit Rate': {
-      'order': 'asc'
-    }
-  } ],
-    'size': 500
-  }
-
-  constructor(protected http: HttpClient) {
-    super(http);
-  }
-
-  getAlbums(query: any): Observable<Album[]> {
-    console.info('getAlbums');
-    console.info(query);
-    return this.http
-      .post(this.elsUrl + ElsService.ALBUM_INDEX_NAME + ElsService.ACTION_SEARCH,
-        JSON.stringify(query), {headers: this.headers})
-      .pipe(
-        map(res => this.responseToAlbums(res)),
-        catchError(error => this.handleError(error, 'getAlbums'))
-      );
-  }
-
-  getAlbumsFiltered(size: number): Observable<Album[]> {
-    // http://localhost:9200/itunes-albums/_search
-    console.info('getAlbums');
-    return this.http
-      .post(this.elsUrl + ElsService.ALBUM_INDEX_NAME + ElsService.ACTION_SEARCH,
-        JSON.stringify({
-          'sort': [ {
-            'Avg Bit Rate': {
-              'order': 'asc'
-            }
-          } ],
-          'size': size,
-          'query': {
-            'bool': {
-              'must': [],
-              'filter': [
-                {
-                  'match_all': {}
-                }
-              ],
-              'should': [],
-              'must_not': [
-                {
-                  'match_phrase': {
-                    'Artist': 'François Pérusse'
-                  }
-                },
-                {
-                  'match_phrase': {
-                    'Album Artist': 'Comédiens'
-                  }
-                }
-              ]
-            }
-          }
-        }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseToAlbums(res)),
-        catchError(error => this.handleError(error, 'getAlbums'))
-      );
-  }
-}
--- a/dashboard/src/app/els.service.ts
+++ b/dashboard/src/app/els.service.ts
@@ -1,32 +1,31 @@
 import { Injectable } from '@angular/core';
-import { HttpClient, HttpHeaders } from '@angular/common/http'
+import { Headers, Http } from '@angular/http';

-import { Observable } from 'rxjs';
-import { map, catchError } from 'rxjs/operators';
+import { Observable } from 'rxjs/Observable';
+import 'rxjs/add/operator/toPromise';
+import 'rxjs/add/operator/map';

-import { Song } from './model/song';
-import { Album } from './model/album';
-import { Artist } from './model/artist';
-import { Bucket } from './model/bucket';
+import { Song } from './object/song';
+import { Album } from './object/album';
+import { Artist } from './object/artist';
+import { Bucket } from './object/bucket';

@Injectable()
 export class ElsService {
  public static readonly DEFAULT_SIZE: number = 50;
-  public static readonly SONG_INDEX_NAME = '/itunes-songs';
-  public static readonly ARTIST_INDEX_NAME = '/itunes-artists';
-  public static readonly ALBUM_INDEX_NAME = '/itunes-albums';
+  private static readonly INDEX_NAME = 'itunessongs';

-  protected static readonly ACTION_SEARCH = '/_search';
-  protected static readonly ACTION_COUNT = '/_count';
+  private static readonly ACTION_SEARCH = '/_search';
+  private static readonly ACTION_COUNT = '/_count';

-  protected elsUrl = 'http://localhost:9200';
-  protected headers = new HttpHeaders({'Content-Type': 'application/json'});
+  private elsUrl = 'http://localhost:9200/' + ElsService.INDEX_NAME + '/';
+  private headers = new Headers({'Content-Type': 'application/json'});

-  constructor(protected http: HttpClient) { }
+  constructor(private http: Http) { }

  getTime(): Promise<number> {
    return this.http
-      .post<any>(this.elsUrl + ElsService.SONG_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + 'song' + ElsService.ACTION_SEARCH,
            JSON.stringify({
              aggs: {
                sum_time: {
@@ -36,13 +35,19 @@ export class ElsService {
              'size': 0
            }), {headers: this.headers})
      .toPromise()
-      .then(res => res.aggregations.sum_time.value as number)
-      .catch(error => this.handleError(error, 'getTime()'));
+      .then(res => res.json().aggregations.sum_time.value as number)
+      .catch(this.handleError);
+  }
+
+  getTimeSlowly(): Promise<number> {
+    return new Promise(resolve => {
+      setTimeout(() => resolve(this.getTime()), 2000);
+    });
  }

  getSize(): Promise<number> {
    return this.http
-      .post<any>(this.elsUrl + ElsService.SONG_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + ElsService.ACTION_SEARCH,
            JSON.stringify({
              aggs: {
                sum_time: {
@@ -52,21 +57,27 @@ export class ElsService {
              'size': 0
            }), {headers: this.headers})
      .toPromise()
-      .then(res => res.aggregations.sum_time.value as number)
-      .catch(error => this.handleError(error, 'getSize()'));
+      .then(res => res.json().aggregations.sum_time.value as number)
+      .catch(this.handleError);
  }

-  getCountSong(index: string): Promise<number> {
+  getSizeSlowly(): Promise<number> {
+    return new Promise(resolve => {
+      setTimeout(() => resolve(this.getSize()), 2000);
+    });
+  }
+
+  getCountSong(type: string): Promise<number> {
    return this.http
-      .get<any>(this.elsUrl + index + ElsService.ACTION_COUNT)
+      .get(this.elsUrl + type + ElsService.ACTION_COUNT)
      .toPromise()
-      .then(res => res.count as number)
-      .catch(error => this.handleError(error, 'getCountSong(' + index + ')'));
+      .then(res => res.json().count as number)
+      .catch(this.handleError);
  }

  getCountNeverListenSong(): Promise<number> {
    return this.http
-      .post<any>(this.elsUrl + ElsService.SONG_INDEX_NAME + ElsService.ACTION_COUNT,
+      .post(this.elsUrl + 'song' + ElsService.ACTION_COUNT,
            JSON.stringify({
              'query': {
                'bool': {
@@ -77,15 +88,23 @@ export class ElsService {
              }
            }), {headers: this.headers})
      .toPromise()
-      .then(res => res.count as number)
-      .catch(error => this.handleError(error, 'getCountNeverListenSong()'));
+      .then(res => res.json().count as number)
+      .catch(this.handleError);
+  }
+
+  getTrackCountSlowly(type: string): Promise<number> {
+    return new Promise(resolve => {
+      setTimeout(() => resolve(this.getCountSong(type)), 2000);
+    });
  }

  getMostPlayedTrack(): Observable<Song[]> {
    // Thank to http://chariotsolutions.com/blog/post/angular2-observables-http-separating-services-components/
    // for the map part
+
+    // Could be shorter but I think it's more readable like this.
    return this.http
-      .post<any>(this.elsUrl + ElsService.SONG_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + 'song' + ElsService.ACTION_SEARCH,
            JSON.stringify({
              'sort': [ {
                'Play Count': {
@@ -94,86 +113,30 @@ export class ElsService {
              } ],
              'size': 5
            }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseToSongs(res)),
-        catchError(error => this.handleError(error, 'getMostPlayedTrack()'))
-      );
-  }
-
-  /**
-   * A basic get of albums ordered by 'Play Count' field.
-   */
-  getMostPlayedAlbumNaive(): Promise<Album[]> {
-    return this.http
-      .get(this.elsUrl + ElsService.ALBUM_INDEX_NAME + ElsService.ACTION_SEARCH + '?sort=Play Count:desc&size=20')
-      .toPromise()
-      .then(res => this.responseToAlbums(res))
-      .catch(error => this.handleError(error, 'getMostPlayedAlbumNaive'));
-    // TODO Excluse 'Divers' + compilation
-  }
-
-  /**
-   * More complicated query to calculate Avg. Play and get  top ordrered by this results.
-   * Result is in '.hits.hits[].sort' field - not casted by conversion method
-   */
-  getMostPlayedAlbum(): Observable<Album[]> {
-    return this.http
-      .post(this.elsUrl + ElsService.ALBUM_INDEX_NAME + ElsService.ACTION_SEARCH,
-            JSON.stringify({
-              'sort': [
-                {
-                '_script': {
-                  'type': 'number',
-                  'script': {
-                    'inline': 'doc[\'Play Count\'].value / doc[\'Track Count\'].value'
-                  },
-                  'order': 'desc'
-                }
-              }
-            ]
-            }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseToAlbums(res)),
-        catchError(error => this.handleError(error, 'getMostPlayedAlbum()'))
-      );
-  }
-
-  getMostPlayedArtistNaive(): Promise<Artist[]> {
-    return this.http
-      .get(this.elsUrl + ElsService.ARTIST_INDEX_NAME + ElsService.ACTION_SEARCH + '?sort=Play Count:desc&size=20')
-      .toPromise()
-      .then(res => this.responseToAlbums(res))
-      .catch(error => this.handleError(error, 'getMostPlayedArtistNaive'));
-    // TODO Excluse 'Divers' + compilation
-  }
-
-  getMostPlayedArtist(): Observable<Artist[]> {
-    return this.http
-      .post(this.elsUrl + ElsService.ARTIST_INDEX_NAME + ElsService.ACTION_SEARCH,
-            JSON.stringify({
-              'sort': [
-                {
-                '_script': {
-                  'type': 'number',
-                  'script': {
-                    'inline': 'doc[\'Play Count\'].value / doc[\'Track Count\'].value'
-                  },
-                  'order': 'desc'
-                }
-              },
-            ],
-            'size': 100
-            }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseToArtists(res)),
-        catchError(error => this.handleError(error, 'getMostPlayedArtist()'))
-      );
+      .map(res => {
+        return res.json().hits.hits;
+      })
+      .map((hits: Array<any>) => {
+        const result: Array<Song> = [];
+        hits.forEach((hit) => {
+          result.push(hit._source);
+        });
+        return result;
+      });
+      // Shorter way:
+      // .map(res => {
+      //   let result: Array<Song> = [];
+      //   res.json().hits.hits.forEach(element => {
+      //     result.push(element._source);
+      //   });
+      //   return result;
+      // });
  }

  getAlbumSongs(albumName: string, from: number = 0): Observable<Song[]> {
    console.info('getAlbumSongs- Album name: ' + albumName + ' - from: ' + from);
    return this.http
-      .post(this.elsUrl + ElsService.SONG_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + 'song' + ElsService.ACTION_SEARCH,
            JSON.stringify({
              'query': {
                'match_phrase': { 'Album': albumName }
@@ -181,17 +144,23 @@ export class ElsService {
              'size': ElsService.DEFAULT_SIZE,
              'from': from
            }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseToSongs(res)),
-        catchError(error => this.handleError(error, 'getAlbumSongs(' + albumName + ',' + from + ')'))
-      );
+      .map(res => {
+        return res.json().hits.hits;
+      })
+      .map((hits: Array<any>) => {
+        const result: Array<Song> = [];
+        hits.forEach((hit) => {
+          result.push(hit._source);
+        });
+        return result;
+      });
  }

  getGenreSongs(genreName: string, from: number = 0): Observable<Song[]> {
    console.info('getGenreSongs- Genre name: ' + genreName + ' - from: ' + from);
    // TODO Code repetition => to refactor
    return this.http
-      .post(this.elsUrl + ElsService.SONG_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + 'song' + ElsService.ACTION_SEARCH,
            JSON.stringify({
              'query': {
                'match_phrase': { 'Genre': genreName }
@@ -199,16 +168,22 @@ export class ElsService {
              'size': ElsService.DEFAULT_SIZE,
              'from': from
            }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseToSongs(res)),
-        catchError(error => this.handleError(error, 'getAlbumSongs(' + genreName + ',' + from + ')'))
-      );
+      .map(res => {
+        return res.json().hits.hits;
+      })
+      .map((hits: Array<any>) => {
+        const result: Array<Song> = [];
+        hits.forEach((hit) => {
+          result.push(hit._source);
+        });
+        return result;
+      });
  }

  getArtistSongs(artistName: string, from: number = 0): Observable<Song[]> {
    console.info('getArtistSongs- Artist name: ' + artistName + ' - from: ' + from);
    return this.http
-      .post(this.elsUrl + ElsService.SONG_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + 'song' + ElsService.ACTION_SEARCH,
            JSON.stringify({
              'query': {
                  'bool': {
@@ -221,53 +196,76 @@ export class ElsService {
              'size': ElsService.DEFAULT_SIZE,
              'from': from
            }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseToSongs(res)),
-        catchError(error => this.handleError(error, 'getArtistSongs(' + artistName + ',' + from + ')'))
-      );
+      .map(res => {
+        return res.json().hits.hits;
+      })
+      .map((hits: Array<any>) => {
+        const result: Array<Song> = [];
+        hits.forEach((hit) => {
+          result.push(hit._source);
+        });
+        return result;
+      });
  }

  getAlbum(albumName: string): Observable<Album> {
-    // TODO Why this is used on album pages?
-    // When it's commented, the album information goes up correctly  */
    return this.http
-      .post(this.elsUrl + ElsService.ALBUM_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + 'album' + ElsService.ACTION_SEARCH,
            JSON.stringify({
              'query': {
                'match_phrase': { 'Album': albumName }
              },
              'size': ElsService.DEFAULT_SIZE
            }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseToOneTypedResult<Album>(res, albumName)),
-        catchError(error => this.handleError(error, 'getAlbum(' + albumName + ')'))
-      );
+      .map(res => {
+        return res.json().hits.hits;
+      })
+      .map((hits: Array<any>) => {
+        if (hits.length < 1) {
+          console.info('No album "' + albumName + '" found.');
+          return undefined;
+        }
+        if (hits.length > 1) {
+          console.error('More than one album "' + albumName + '" found (' + hits.length + '), return the first.');
+        }
+        return hits[0]._source;
+      });
  }

  getArtist(artistName: string): Observable<Artist> {
    return this.http
-      .post(this.elsUrl + ElsService.ARTIST_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + 'artist' + ElsService.ACTION_SEARCH,
            JSON.stringify({
              'query': {
                'match_phrase': { 'Artist': artistName }
              },
              'size': ElsService.DEFAULT_SIZE
            }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseToOneTypedResult<Artist>(res, artistName)),
-        catchError(error => this.handleError(error, 'getArtist(' + artistName + ')'))
-      );
+      .map(res => res.json().hits.hits)
+      .map((hits: Array<any>) => {
+        // Theorically, my script prevent to found two documents with this query.
+        // But Prevention is better than cure as Shakespeare said
+        if (hits.length < 1) {
+          console.info('No artist "' + artistName + '" found.');
+          return undefined;
+        }
+        if (hits.length > 1) {
+          console.error('More than one artist "' + artistName + '" found (' + hits.length + '), return the first.');
+          console.error('This is not normal!');
+        }
+        return hits[0]._source;
+      });
  }

  getGenres(ordering: string = 'desc'): Observable<Bucket[]> {
    return this.http
-      .post(this.elsUrl + ElsService.SONG_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + 'song' + ElsService.ACTION_SEARCH,
            JSON.stringify({
              'aggs' : {
                'genres' : {
                  'terms' : {
-                    'field' : 'Genre',
-                    'size' : 10,
+                    'field' : 'Genre.original',
+                    'size' : 100,
                    'missing': 'N/A',
                    'order': { '_count' : ordering }
                  }
@@ -275,71 +273,90 @@ export class ElsService {
              },
              'size': 0
            }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseAggregationToBucket(res, 'genres')),
-        catchError(error => this.handleError(error, 'getGenres(' + ordering + ')'))
-      );
+      .map(res => res.json().aggregations.genres.buckets)
+      .map((hits: Array<any>) => this.hitsToBuckets(hits));
  }

-//   getGenreCount(): Observable<number> {
-//     return this.http
-//       .post<any>(this.elsUrl + 'song' + ElsService.ACTION_SEARCH,
-//             JSON.stringify({
-//               'aggs' : {
-//                 'genres' : {
-//                   'cardinality' : {
-//                     'field' : 'Genre.original',
-//                     'missing': 'N/A',
-//                   }
-//                 }
-//               },
-//               'size': 0
-//             }), {headers: this.headers})
-//       .pipe(
-//         map(res => res.aggregations.genres.value)
-//       );
-//   }
+  getArtists(): Observable<Bucket[]> {
+    return this.http
+      .post(this.elsUrl + 'artist' + ElsService.ACTION_SEARCH,
+            JSON.stringify({
+              'size': 100,
+              '_source': [
+                'Artist',
+                'Track Count'
+              ],
+              'sort': [
+                {
+                  'Track Count': {
+                    'order': 'desc'
+                  }
+                }
+              ]
+          }), {headers: this.headers})
+      .map(res => {
+        return res.json().hits.hits;
+      })
+      .map((hits: Array<any>) => {
+        const result: Array<Bucket> = [];
+        hits.forEach((hit) => {
+          const bucket = new Bucket;
+          bucket.doc_count = hit._source['Track Count'];
+          bucket.key = hit._source.Artist;
+          result.push(bucket);
+        });
+        console.log(result);
+        return result;
+      });
+  }
+
+  getGenreCount(): Observable<number> {
+    return this.http
+      .post(this.elsUrl + 'song' + ElsService.ACTION_SEARCH,
+            JSON.stringify({
+              'aggs' : {
+                'genres' : {
+                  'cardinality' : {
+                    'field' : 'Genre.original',
+                    'missing': 'N/A',
+                  }
+                }
+              },
+              'size': 0
+            }), {headers: this.headers})
+      .map(res => res.json().aggregations.genres.value);
+  }

  getLastAddedAlbums(month: number): Observable<Bucket[]> {
    return this.http
-      .post(this.elsUrl + ElsService.SONG_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + 'song' + ElsService.ACTION_SEARCH,
            JSON.stringify({
              'query': {
-              'range' : {
-                  'Date Added' : {
-                      'gte' : 'now-' + month + 'M/d',
-                      'lte' : 'now/d'
-                  }
-              }
-          },
-              'size': 0,
-              'aggs': {
-                'date' : {
-                  'terms': {
-                    'field' : 'Date Added',
-                    'order': { '_term': 'desc' },
-                    'size': 20
-                  },
-                  'aggs': {
-                    'album': {
-                      'terms': {
-                        'field': 'Album.raw'
+                  'range' : {
+                      'Date Added' : {
+                          'gte' : 'now-' + month + 'M/d',
+                          'lte' : 'now/d'
                      }
-                    }
                  }
-                }
-              }
-            }), {headers: this.headers})
-      .pipe(
-        map(res => this.responseSubAggregationToBucket(res, 'date')),
-        catchError(error => this.handleError(error, 'getLastAddedAlbums(' + month + ')' ))
-      );
+              },
+              'aggs' : {
+                  'album' : {
+                      'terms' : {
+                          'field' : 'Album.original',
+                          'size': 10
+                      }
+                  }
+              },
+              'size': 0
+          }), {headers: this.headers})
+      .map(res => res.json().aggregations.album.buckets)
      // TODO Take in consideration "sum_other_doc_count"
+      .map((hits: Array<any>) => this.hitsToBuckets(hits));
  }

  getArtistFromAlbumName(albumname: string): Observable<Album[]> {
    return this.http
-      .post<any>(this.elsUrl + ElsService.ALBUM_INDEX_NAME + ElsService.ACTION_SEARCH,
+      .post(this.elsUrl + 'album' + ElsService.ACTION_SEARCH,
            JSON.stringify({
              'query': {
                  'match_phrase' : {
@@ -347,126 +364,27 @@ export class ElsService {
                  }
              }
          }), {headers: this.headers})
-      .pipe(
-        map(res => res.hits.hits),
-        map((hits: Array<any>) => {
-          // TODO Use a method (duplicated code ?)
-          const result: Array<Album> = [];
-          hits.forEach((hit) => {
-            result.push(hit._source);
-          });
-          return result;
-        }),
-        catchError(error => this.handleError(error, 'getArtistFromAlbumName' + albumname + ')'))
-      );
-  }
-
-  getCountArtistSong(artistName: string): Observable<number> {
-    console.log('artistname: ' + artistName);
-    return this.http
-    .post<any>(this.elsUrl + ElsService.SONG_INDEX_NAME + ElsService.ACTION_COUNT,
-          JSON.stringify({
-            'query': {
-                'bool': {
-                    'should': [
-                        {'match_phrase' : { 'Album Artist' : artistName }},
-                        {'match_phrase' : { 'Artist' : artistName }}
-                    ]
-                }
-            }
-          }), {headers: this.headers})
-    .pipe(
-      map(res => res.count as number),
-      catchError(error => this.handleError(error, 'getCountArtistSong' + artistName + ')'))
-    );
-  }
-
-  /** Process a result to return just one result.
-   * Used to get an album or an artist.
-   * Take a name to put in console output if no result or more than one result.
-   *
-   * @param res Response to process
-   * @param name The searched name - for console output
-   */
-  private responseToOneTypedResult<T>(res: any, name: string): T {
-    const hits = res.hits.hits;
-
-    if (hits.length < 1) {
-      console.info('No result found for name: "' + name);
-      return undefined;
-    }
-    if (hits.length > 1) {
-      // TODO Cumul results (for album)
-      console.error('More than one result for name: "' + name + '". Found (' + hits.length + '), return the first.');
-    }
-    return hits[0]._source;
-  }
-
-  /** Process a response to a array of songs.
-   *
-   * @param res Response to process
-   */
-  private responseToSongs(res: any): Song[] {
-    const result: Array<Song> = [];
-    res.hits.hits.forEach((hit) => {
-      result.push(hit._source);
-    });
-    return result;
-  }
-
-  /** Process a response to a array of songs.
-   *
-   * @param res Response to process
-   */
-  protected responseToAlbums(res: any): Album[] {
-    const result: Array<Album> = [];
-    res.hits.hits.forEach((hit) => {
-      result.push(hit._source);
-    });
-    return result;
-  }
-
-  /** Process a response to a array of songs.
-   *
-   * @param res Response to process
-   */
-  private responseToArtists(res: any): Artist[] {
-    const result: Array<Artist> = [];
-    res.hits.hits.forEach((hit) => {
-      result.push(hit._source);
-    });
-    return result;
-  }
-
-
-  /** Process an aggregation response to an array of Bucket.
-   *
-   * @param res Response to process
-   * @param name Name of aggregation
-   */
-  private responseAggregationToBucket(res: any, name: string): Bucket[] {
-    const result: Array<Bucket> = [];
-    res.aggregations[name].buckets.forEach((bucket) => {
-      result.push(bucket);
-    });
-    return result;
-  }
-
-  private responseSubAggregationToBucket(res: any, name: string): Bucket[] {
-    const result: Array<Bucket> = [];
-    res.aggregations[name].buckets.forEach((bucket) => {
-      bucket['album'].buckets.forEach((subBucket) => {
-        result.push(subBucket);
+      .map(res => res.json().hits.hits)
+      .map((hits: Array<any>) => {
+        // TODO Use a method (duplicated code ?)
+        const result: Array<Album> = [];
+        hits.forEach((hit) => {
+          result.push(hit._source);
+        });
+        return result;
      });
-    });
-    return result;
  }

-  protected handleError(error: any, origin: string): Promise<any> {
-    console.error('An error occurred!');
-    console.error('Origin function: ', origin);
-    console.error('An error occurred!', error); // for demo purposes only
-    console.error(error); // for demo purposes only
+  private hitsToBuckets(hits: Array<any>): Bucket[] {
+      const result: Array<Bucket> = [];
+      hits.forEach((bucket) => {
+        result.push(bucket);
+      });
+      return result;
+  }
+
+  private handleError(error: any): Promise<any> {
+    console.error('An error occurred', error); // for demo purposes only
    return Promise.reject(error.message || error);
  }
 }
--- a/dashboard/src/app/genre/genre.component.html
+++ b/dashboard/src/app/genre/genre.component.html
@@ -1,5 +1,28 @@
 <div class="container">
  <h1>{{genreName}}</h1>

-  <app-song-table [songs]=songs (atBottom)=loadSongs()></app-song-table>
+  <table class="table table-striped">
+    <thead>
+      <tr>
+        <th></th>
+        <th>Name</th>
+        <th>Artist</th>
+        <th>Album</th>
+        <th>Album Artist</th>
+        <th>Play Count</th>
+        <th>Genre</th>
+      </tr>
+    </thead>
+    <tbody>
+      <tr *ngFor="let song of songs | sortBy : 'Track Number'">
+        <td>{{song['Track Number'] ? (("0" + song['Track Number']).slice(-2)) : "--"}}</td>
+        <td>{{song.Name}}</td>
+        <td><a [routerLink]="['/artist', song.Artist]">{{song.Artist}}</a></td>
+        <td><a [routerLink]="['/album', song.Album]">{{song.Album}}</a></td>
+        <td>{{song['Album Artist']}}</td>
+        <td>{{song['Play Count']}}</td>
+        <td>{{song.Genre}}</td>
+      </tr>
+    </tbody>
+  </table>
 </div>
--- a/dashboard/src/app/genre/genre.component.ts
+++ b/dashboard/src/app/genre/genre.component.ts
@@ -1,10 +1,9 @@
-import { Component, OnInit, ViewChild } from '@angular/core';
+import { Component, OnInit } from '@angular/core';
 import { ActivatedRoute, Params } from '@angular/router';

 import { ElsService } from '../els.service';
-import { SongTableComponent } from '../song-table/song-table.component';

-import { Song } from '../model/song';
+import { Song } from '../object/song';

@Component({
  selector: 'app-genre',
@@ -12,7 +11,6 @@ import { Song } from '../model/song';
  styleUrls: ['./genre.component.css']
 })
 export class GenreComponent implements OnInit {
-  @ViewChild(SongTableComponent) songtable: SongTableComponent;
  genreName = '';
  songs: Array<Song> = [];

@@ -39,7 +37,6 @@ export class GenreComponent implements OnInit {
          this.songs = data;
        } else {
          data.forEach(song => {
-            this.songtable.setSortable(true);
            this.songs.push(song);
          });
        }
--- a/dashboard/src/app/object/album.ts
+++ b/dashboard/src/app/object/album.ts
@@ -10,5 +10,4 @@ export class Album {
    'Album Rating Computed':  boolean;
    'Play Count': number;
    'Total Time': number;
-    'Album Artist': string;
 }
--- a/dashboard/src/app/object/artist.ts
+++ b/dashboard/src/app/object/artist.ts
--- a/dashboard/src/app/object/bucket.ts
+++ b/dashboard/src/app/object/bucket.ts
--- a/dashboard/src/app/object/song.ts
+++ b/dashboard/src/app/object/song.ts
@@ -4,5 +4,4 @@ export class Song {
    'Play Count': number;
    Album: string;
    'Track Number': number; // TODO Default property
-    'Disc Number': number;
 }
--- a/dashboard/src/app/pipes/convert-more-exact.pipe.spec.ts
+++ b/dashboard/src/app/pipes/convert-more-exact.pipe.spec.ts
@@ -1,8 +0,0 @@
-import { ConvertMoreExactPipe } from './convert-more-exact.pipe';
-
-describe('ConvertMoreExactPipe', () => {
-  it('create an instance', () => {
-    const pipe = new ConvertMoreExactPipe();
-    expect(pipe).toBeTruthy();
-  });
-});
--- a/dashboard/src/app/pipes/convert-more-exact.pipe.ts
+++ b/dashboard/src/app/pipes/convert-more-exact.pipe.ts
@@ -1,56 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-
-@Pipe({
-  name: 'convertMoreExact'
-})
-export class ConvertMoreExactPipe implements PipeTransform {
-
-  /**
-   * Convert milliseconds to rounded time e.g. ~84d
-   * @param timeMs time in milliseconds
-   */
-  transform(timeMs: number): string  {
-    let x = timeMs / 1000;
-
-    const seconds = Math.floor(x % 60);
-    x /= 60;
-
-    let minutes = 0;
-    if (x > 1) { minutes = Math.floor(x % 60); }
-    x /= 60;
-
-    let hours = 0;
-    if (x > 1) { hours = Math.floor(x % 24); }
-    // TODO Enable/disable day
-    x /= 24;
-    const days = Math.floor(x);
-
-    // Final string
-    let ret = '~';
-    if (days > 0) {
-      return '~' + (days + (hours > 12 ? 1 : 0)) + 'd';
-    }
-    if (hours > 0) {
-      if (minutes > 45) {
-        ret += (hours + 1) + 'h';
-      } else if (minutes < 15) {
-        ret += hours + 'h';
-      } else {
-        ret += hours + 'h 1/2';
-      }
-      return ret;
-    }
-    if (minutes > 0) {
-      ret += (minutes + (seconds > 35 ? 1 : 0)) + 'min';
-      return ret;
-    }
-    if (seconds > 0) {
-      if (seconds > 35) {
-        return '~1min';
-      } else {
-        return seconds + 's';
-      }
-    }
-  }
-
-}
--- a/dashboard/src/app/pipes/convert-size-to-string.pipe.spec.ts
+++ b/dashboard/src/app/pipes/convert-size-to-string.pipe.spec.ts
@@ -1,8 +0,0 @@
-import { ConvertSizeToStringPipe } from './convert-size-to-string.pipe';
-
-describe('ConvertSizeToStringPipe', () => {
-  it('create an instance', () => {
-    const pipe = new ConvertSizeToStringPipe();
-    expect(pipe).toBeTruthy();
-  });
-});
--- a/dashboard/src/app/pipes/convert-size-to-string.pipe.ts
+++ b/dashboard/src/app/pipes/convert-size-to-string.pipe.ts
@@ -1,26 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-
-@Pipe({
-  name: 'convertSizeToString'
-})
-export class ConvertSizeToStringPipe implements PipeTransform {
-
-  /**
-   * Convert size to human readable size
-   * @param size size in byte
-   */
-  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];
-  }
-
-}
--- a/dashboard/src/app/pipes/convertms.pipe.spec.ts
+++ b/dashboard/src/app/pipes/convertms.pipe.spec.ts
@@ -1,8 +0,0 @@
-import { ConvertMsPipe } from './convertms.pipe';
-
-describe('ConvertMsPipe', () => {
-  it('create an instance', () => {
-    const pipe = new ConvertMsPipe();
-    expect(pipe).toBeTruthy();
-  });
-});
--- a/dashboard/src/app/pipes/convertms.pipe.ts
+++ b/dashboard/src/app/pipes/convertms.pipe.ts
@@ -1,38 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-
-@Pipe({
-  name: 'convertMs'
-})
-export class ConvertMsPipe implements PipeTransform {
-
-  /**
-   * Convert milliseconds to "readable" duration e.g. 1d21h35m24s
-   * @param timeMs time in milliseconds
-   */
-  transform(timeMs: number): string {
-    let x = timeMs / 1000;
-
-    const seconds = Math.floor(x % 60);
-    x /= 60;
-
-    let minutes = 0;
-    if (x > 1) { minutes = Math.floor(x % 60); }
-    x /= 60;
-
-    let hours = 0;
-    if (x > 1) { hours = Math.floor(x % 24); }
-    // TODO Enable/disable day
-    x /= 24;
-    const days = Math.floor(x);
-
-    // Final string
-    let ret = '';
-    if (days > 0) { ret += parseInt('0' + days) + 'd'; }
-    if (hours > 0) { ret += ('0' + hours).slice(-2) + 'h'; }
-    if (minutes > 0) { ret += ('0' + minutes).slice(-2) + 'm'; }
-    if (seconds > 0) { ret += ('0' + seconds).slice(-2) + 's'; }
-
-    return ret;
-    // return ('0' + days).slice(-2) + ':' + ('0' + hours).slice(-2) + ':' + ('0' + minutes).slice(-2) + ':' + ('0' + seconds).slice(-2);
-  }
-}
--- a/dashboard/src/app/pipes/round.pipe.spec.ts
+++ b/dashboard/src/app/pipes/round.pipe.spec.ts
@@ -1,8 +0,0 @@
-import { RoundPipe } from './round.pipe';
-
-describe('RoundPipe', () => {
-  it('create an instance', () => {
-    const pipe = new RoundPipe();
-    expect(pipe).toBeTruthy();
-  });
-});
--- a/dashboard/src/app/pipes/round.pipe.ts
+++ b/dashboard/src/app/pipes/round.pipe.ts
@@ -1,21 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-
-@Pipe({
-  name: 'round'
-})
-export class RoundPipe implements PipeTransform {
-
-  /**
-   * Round a value
-   * @param value value to round
-   * @param precision number of numbers to keep after coma - 1 if unspecified
-   */
-  transform(value: number, precision?: number): number {
-    if (precision === undefined) {
-      precision = 1;
-    }
-    const factor = Math.pow(10, precision);
-    return Math.round(value * factor) / factor;
-  }
-
-}
--- a/dashboard/src/app/pipes/sort-by.pipe.ts
+++ b/dashboard/src/app/pipes/sort-by.pipe.ts
@@ -1,40 +0,0 @@
-import { Pipe, PipeTransform } from '@angular/core';
-
-@Pipe({
-  name: 'sortBy'
-})
-export class SortByPipe implements PipeTransform {
-
-  /**
-   * Sort an array by multiple elements.
-   *
-   * Example to sort an array respectively by Year, Album, Disc Number, etc.
-   * Typescript usage:
-   * <pre>
-   * new SortByPipe().transform(this.songs, 'Year', 'Album', 'Disc Number', 'Track Number', 'Play Count');
-   * </pre>
-   * In HTML usage:
-   * <pre>
-   * <tr *ngFor="let song of songs | sortBy : 'Year':'Album':'Disc Number':'Track Number'">
-   * </pre>
-   *
-   * @param array array to sort
-   * @param args elements used to sort in oder
-   */
-  transform(array: Array<any>, ...args: any[]): Array<any> {
-    array.sort((a: any, b: any) => {
-      for (let i = 0; i < args.length; i++) {
-        const arg = args[i];
-
-        if (a[arg] === undefined && b[arg] !== undefined) { return -1; }
-        if (a[arg] !== undefined && b[arg] === undefined) { return 1; }
-
-        if (a[arg] < b[arg]) { return -1; }
-        if (a[arg] > b[arg]) { return 1; }
-      }
-      return 0;
-    });
-    return array;
-  }
-
-}
--- a/dashboard/src/app/song-table/song-table.component.css
+++ b/dashboard/src/app/song-table/song-table.component.css
--- a/dashboard/src/app/song-table/song-table.component.html
+++ b/dashboard/src/app/song-table/song-table.component.html
@@ -1,55 +0,0 @@
-<table class="table table-striped" (window:scroll)="onScroll($event)">
-  <thead>
-    <tr>
-      <th></th>
-      <th>Name</th>
-      <th>Album</th>
-      <th>Year</th>
-      <th>Artist</th>
-      <th>Album Artist</th>
-      <th>Play Count</th>
-      <th>Genre</th>
-      <th>Bit Rate</th>
-      <th>Rating</th>
-    </tr>
-  </thead>
-  <tbody>
-    <tr *ngFor="let song of songs | sortBy : 'Year':'Album':'Disc Number':'Track Number'">
-      <td>{{song['Track Number'] ? (("0" + song['Track Number']).slice(-2)) : "--"}}</td>
-      <td>{{song.Name}}</td>
-      <td>
-        <a [routerLink]="['/album', song.Album]">{{song.Album}}</a>
-      </td>
-      <td>{{song.Year}}</td>
-      <td>
-        <a [routerLink]="['/artist', song.Artist]">{{song.Artist}}</a>
-      </td>
-      <td>{{song['Album Artist'] ? song['Album Artist'] : "-" }}</td>
-      <td>{{song['Play Count']}}</td>
-      <td>
-        <a [routerLink]="['/genre', song.Genre]">{{song.Genre}}</a>
-      </td>
-      <td [title]="song['Bit Rate']">
-        <span [class]="'signal signal-' + roundBitRate(song['Bit Rate'])"></span>
-      </td>
-      <td class="star" [title]="(song['Rating Computed']?'Computed Rating: ':'Rating: ') + song.Rating">
-        <span *ngFor="let item of numberToArray(song.Rating, 20)">
-          <span class="glyphicon" [ngClass]="song['Rating Computed']?'glyphicon-star-empty':'glyphicon-star'"></span>
-        </span>
-        </td>
-      <td *ngIf="song.Loved" class="loved">
-        <span class="glyphicon glyphicon-heart heart"></span>
-      </td>
-    </tr>
-  </tbody>
-</table>
-
-<!-- Go to Top Button-->
-<button type="button" class="btn btn-warning btn-top" [class.btn-top-is-visible]="bottomReached" aria-label="Top" (click)="scrollTop()"
-  title="Go back to Top!">
-  <span class="glyphicon glyphicon-menu-up" aria-hidden="true"></span>
-</button>
-<button type="button" class="btn btn-primary btn-top btn-sort" [class.btn-top-is-visible]="sortable" aria-label="Top" (click)="sort()"
-  title="Sort by Album & Track Number">
-  <span class="glyphicon glyphicon-sort-by-attributes" aria-hidden="true"></span>
-</button>
--- a/dashboard/src/app/song-table/song-table.component.spec.ts
+++ b/dashboard/src/app/song-table/song-table.component.spec.ts
@@ -1,25 +0,0 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { SongTableComponent } from './song-table.component';
-
-describe('SongTableComponent', () => {
-  let component: SongTableComponent;
-  let fixture: ComponentFixture<SongTableComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ SongTableComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(SongTableComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should be created', () => {
-    expect(component).toBeTruthy();
-  });
-});
--- a/dashboard/src/app/song-table/song-table.component.ts
+++ b/dashboard/src/app/song-table/song-table.component.ts
@@ -1,61 +0,0 @@
-import { Component, EventEmitter, Input, Output } from '@angular/core';
-import { Utils } from '../utils';
-
-import { Song } from './../model/song';
-import { SortByPipe } from './../pipes/sort-by.pipe';
-
-@Component({
-  selector: 'app-song-table',
-  templateUrl: './song-table.component.html',
-  styleUrls: ['./song-table.component.css']
-})
-export class SongTableComponent {
-  numberToArray = Utils.numberToArray;
-  @Input() songs: Array<Song> = [];
-  @Output() private atBottom = new EventEmitter();
-
-  // To activate button in interface var
-  bottomReached = false;
-  sortable: boolean;
-
-  constructor() { }
-
-  /**
-   * Handle scroll:
-   * - load data if at bottom of screen (if needed)
-   * - hide/show "go to top" button
-   *
-   * @param event scroll event
-   */
-  onScroll(event: any) {
-    if ((window.innerHeight + window.scrollY) >= document.body.offsetHeight) {
-      this.atBottom.emit();
-    }
-
-    // Show/hide 'at top' button
-    if (window.scrollY > window.innerHeight) {
-      this.bottomReached = true;
-    }
-
-    if (window.scrollY === 0) {
-      this.bottomReached = false;
-    }
-  }
-
-  scrollTop(): void {
-    window.scrollTo(0, 0);
-  }
-
-  roundBitRate(bitRate: number) {
-    return Math.round(bitRate / 64);
-  }
-
-  sort(): void {
-    this.songs = new SortByPipe().transform(this.songs, 'Year', 'Album', 'Disc Number', 'Track Number', 'Play Count');
-    this.sortable = false;
-  }
-
-  setSortable(sortable: boolean) {
-    this.sortable = sortable;
-  }
-}
--- a/dashboard/src/app/pipes/sort-by.pipe.spec.ts
+++ b/dashboard/src/app/pipes/sort-by.pipe.spec.ts
--- a/dashboard/src/app/sort-by.pipe.ts
+++ b/dashboard/src/app/sort-by.pipe.ts
@@ -0,0 +1,24 @@
+import { Pipe, PipeTransform } from '@angular/core';
+
+@Pipe({
+  name: 'sortBy'
+})
+export class SortByPipe implements PipeTransform {
+
+  transform(array: Array<any>, ...args: any[]): Array<any> {
+    array.sort((a: any, b: any) => {
+      for (let i = 0; i < array.length; i++) {
+        const arg = args[i];
+
+        if (a[arg] === undefined && b[arg] !== undefined) { return -1; }
+        if (a[arg] !== undefined && b[arg] === undefined) { return 1; }
+
+        if (a[arg] < b[arg]) { return -1; }
+        if (a[arg] > b[arg]) { return 1; }
+      }
+      return 0;
+    });
+    return array;
+  }
+
+}
--- a/dashboard/src/app/top-played/top-played.component.css
+++ b/dashboard/src/app/top-played/top-played.component.css
--- a/dashboard/src/app/top-played/top-played.component.html
+++ b/dashboard/src/app/top-played/top-played.component.html
@@ -1,111 +0,0 @@
-<div class="container">
-<div class="col-md-12">
-  <h3>Top Played Album (Naive Way)</h3>
-  <div class="alert alert-info">
-    <strong>Caution:</strong> In this list, albums with more than 10 artists are ignored.
-  </div>
-  <table class="table table-striped">
-    <thead>
-      <tr>
-        <th>Album</th>
-        <th>Artist Name</th>
-        <th>Track Count</th>
-        <th>Play Count</th>
-        <th>Average Play</th>
-      </tr>
-    </thead>
-    <tbody>
-      <tr *ngFor="let album of mostPlayedAlbumsNaive">
-        <td>
-          <b>{{album.Name}}</b>
-        </td>
-        <td>{{album['Album Artist'] ? album['Album Artist'] : album.Artist}}</td>
-        <td>{{album['Track Count']}}</td>
-        <td>{{album['Play Count']}}</td>
-        <td>{{album['Play Count'] / album['Track Count'] | round}}</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-
-<div class="col-md-12">
-  <h3>Top Played Album (avg. play way)</h3>
-  <table class="table table-striped">
-    <thead>
-      <tr>
-        <th>Album</th>
-        <th>Artist Name</th>
-        <th>Track Count</th>
-        <th>Play Count</th>
-        <th>Average Play</th>
-      </tr>
-    </thead>
-    <tbody>
-      <tr *ngFor="let album of mostPlayedAlbums">
-        <td>
-          <b>{{album.Name}}</b>
-        </td>
-        <td>{{album['Album Artist'] ? album['Album Artist'] : album.Artist}}</td>
-        <td>{{album['Track Count']}}</td>
-        <td>{{album['Play Count']}}</td>
-        <td>{{album['Play Count'] / album['Track Count'] | round}}</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-
-<div class="col-md-12">
-  <h3>Top Played Artist (Naive Way)</h3>
-  <!-- <div class="alert alert-info"> -->
-  <!-- <strong>Caution:</strong> In this list, artist with more than 10 artists are ignored. -->
-  <!-- </div> -->
-  <table class="table table-striped">
-    <thead>
-      <tr>
-        <th>Artist</th>
-        <th>Album Count</th>
-        <th>Track Count</th>
-        <th>Play Count</th>
-        <th>Average Play</th>
-      </tr>
-    </thead>
-    <tbody>
-      <tr *ngFor="let artist of mostPlayedArtistsNaive">
-        <td>
-          <b>{{artist.Name}}</b>
-        </td>
-        <td>{{artist.Album.length}}</td>
-        <td>{{artist['Track Count']}}</td>
-        <td>{{artist['Play Count']}}</td>
-        <td>{{artist['Play Count'] / artist['Track Count'] | round}}</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-
-<div class="col-md-12">
-  <h3>Top Played Artist (avg. play way)</h3>
-  <table class="table table-striped">
-    <thead>
-      <tr>
-        <th>Artist</th>
-        <th>Album Count</th>
-        <th>Track Count</th>
-        <th>Play Count</th>
-        <th>Average Play</th>
-      </tr>
-    </thead>
-    <tbody>
-      <tr *ngFor="let artist of mostPlayedArtists">
-        <td>
-          <b>{{artist.Name}}</b>
-        </td>
-        <td>{{artist.Album.length}}</td>
-        <td>{{artist['Track Count']}}</td>
-        <td>{{artist['Play Count']}}</td>
-        <td>{{artist['Play Count'] / artist['Track Count'] | round}}</td>
-      </tr>
-    </tbody>
-  </table>
-</div>
-</div>
--- a/dashboard/src/app/top-played/top-played.component.spec.ts
+++ b/dashboard/src/app/top-played/top-played.component.spec.ts
@@ -1,25 +0,0 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { TopPlayedComponent } from './top-played.component';
-
-describe('TopPlayedComponent', () => {
-  let component: TopPlayedComponent;
-  let fixture: ComponentFixture<TopPlayedComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ TopPlayedComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(TopPlayedComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should create', () => {
-    expect(component).toBeTruthy();
-  });
-});
--- a/dashboard/src/app/top-played/top-played.component.ts
+++ b/dashboard/src/app/top-played/top-played.component.ts
@@ -1,65 +0,0 @@
-import { Component, OnInit } from '@angular/core';
-
-import { ElsService } from '../els.service';
-import { Album } from '../model/album';
-import { Artist } from '../model/artist';
-
-@Component({
-  selector: 'app-top-played',
-  templateUrl: './top-played.component.html',
-  styleUrls: ['./top-played.component.css']
-})
-export class TopPlayedComponent implements OnInit {
-  mostPlayedAlbumsNaive: Album[] = [];
-  mostPlayedAlbums: Album[] = [];
-  mostPlayedArtistsNaive: Artist[] = [];
-  mostPlayedArtists: Artist[] = [];
-
-  constructor(private elsService: ElsService) { }
-
-  ngOnInit() {
-    this.elsService.getMostPlayedAlbumNaive()
-    .then(result => {
-      result.forEach(album => {
-        if (album.Artist.length <= 10) {
-          this.mostPlayedAlbumsNaive.push(album);
-        }
-      });
-
-      this.mostPlayedAlbumsNaive.sort((a: any, b: any) => this.sortByAveragePlay(a, b)).splice(10);
-    });
-
-    this.elsService.getMostPlayedAlbum().subscribe(result => {
-      this.mostPlayedAlbums = result;
-
-      this.mostPlayedAlbums.sort((a: any, b: any) => this.sortByAveragePlay(a, b)).splice(10);
-      // TODO Load more! (Use a )
-    });
-
-    this.elsService.getMostPlayedArtistNaive()
-    .then(result => {
-      this.mostPlayedArtistsNaive = result;
-
-      this.mostPlayedArtistsNaive.sort((a: any, b: any) => this.sortByAveragePlay(a, b)).splice(10);
-    });
-
-    this.elsService.getMostPlayedArtist().subscribe(result => {
-      result.forEach(artist => {
-        if (artist['Track Count'] > 10) {
-          this.mostPlayedArtists.push(artist);
-        }
-      });
-
-      this.mostPlayedArtists.sort((a: any, b: any) => this.sortByAveragePlay(a, b)).splice(10);
-    });
-  }
-
-  sortByAveragePlay(a: any, b: any) {
-    if ((a['Play Count'] / a['Track Count']) < (b['Play Count'] / b['Track Count'])) {
-      return 1;
-    } else {
-      return -1;
-    }
-  }
-
-}
--- a/dashboard/src/app/utils.spec.ts
+++ b/dashboard/src/app/utils.spec.ts
@@ -1,7 +0,0 @@
-import { Utils } from './utils';
-
-describe('Utils', () => {
-  it('should create an instance', () => {
-    expect(new Utils()).toBeTruthy();
-  });
-});
--- a/dashboard/src/app/utils.ts
+++ b/dashboard/src/app/utils.ts
@@ -1,16 +0,0 @@
-export class Utils {
-
-  /**
-   * Convert a number to an array.
-   * Mainly used for rating: need to convert the number to use a ngFor
-   * @param n number to convert on a array of n cases
-   * @param d if you want to divide number, e.g. by 20 for rating (rating is one value out of one hundred)
-   */
-  public static numberToArray(n: number, d: number = 1): any[] {
-    if (!n) {
-      return Array(0)
-    }
-
-    return Array(n / d);
-  }
-}
--- a/dashboard/src/assets/icons_signal/carre-high/0.png
+++ b/dashboard/src/assets/icons_signal/carre-high/0.png
--- a/dashboard/src/assets/icons_signal/carre-high/0.svg
+++ b/dashboard/src/assets/icons_signal/carre-high/0.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><g display="none"><rect x="45" y="5" display="inline" width="10" height="10"></rect><rect x="45" y="45" display="inline" width="10" height="10"></rect><rect x="35" y="35" display="inline" width="10" height="10"></rect><rect x="25" y="25" display="inline" width="10" height="10"></rect><rect x="55" y="35" display="inline" width="10" height="10"></rect><rect x="65" y="15" display="inline" width="10" height="10"></rect><rect x="35" y="5" display="inline" width="10" height="10"></rect><rect x="15" y="15" display="inline" width="10" height="10"></rect><rect x="5" y="45" display="inline" width="10" height="10"></rect><rect x="5" y="55" display="inline" width="10" height="10"></rect><rect x="5" y="35" display="inline" width="10" height="10"></rect><rect x="15" y="65" display="inline" width="10" height="10"></rect><rect x="15" y="75" display="inline" width="10" height="10"></rect><rect x="25" y="75" display="inline" width="10" height="10"></rect><rect x="45" y="85" display="inline" width="10" height="10"></rect><rect x="35" y="85" display="inline" width="10" height="10"></rect><rect x="55" y="85" display="inline" width="10" height="10"></rect><rect x="65" y="75" display="inline" width="10" height="10"></rect><rect x="75" y="65" display="inline" width="10" height="10"></rect><rect x="75" y="75" display="inline" width="10" height="10"></rect><rect x="85" y="45" display="inline" width="10" height="10"></rect><rect x="85" y="55" display="inline" width="10" height="10"></rect><rect x="85" y="35" display="inline" width="10" height="10"></rect><rect x="75" y="25" display="inline" width="10" height="10"></rect><rect x="75" y="15" display="inline" width="10" height="10"></rect><rect x="55" y="5" display="inline" width="10" height="10"></rect></g><g><path d="M5.675,93.515h9V61.651h-9V93.515z M6.675,62.651h7v29.864h-7V62.651z"></path><path d="M18.175,93.515h9V52.803h-9V93.515z M19.175,53.803h7v38.712h-7V53.803z"></path><path d="M30.675,93.515h9v-47.06h-9V93.515z M31.675,47.455h7v45.06h-7V47.455z"></path><path d="M43.175,93.515h9V37.607h-9V93.515z M44.175,38.607h7v53.908h-7V38.607z"></path><path d="M55.675,93.515h9V28.759h-9V93.515z M56.675,29.759h7v62.756h-7V29.759z"></path><path d="M68.175,17.411v76.104h9V17.411H68.175z M76.175,92.515h-7V18.411h7V92.515z"></path></g></svg>
--- a/dashboard/src/assets/icons_signal/carre-high/1.png
+++ b/dashboard/src/assets/icons_signal/carre-high/1.png
--- a/dashboard/src/assets/icons_signal/carre-high/1.svg
+++ b/dashboard/src/assets/icons_signal/carre-high/1.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><g display="none"><rect x="25" y="25" display="inline" width="10" height="10"></rect><rect x="75" y="75" display="inline" width="10" height="10"></rect><rect x="85" y="75" display="inline" width="10" height="10"></rect><rect x="35" y="15" display="inline" width="10" height="10"></rect><rect x="45" y="5" display="inline" width="10" height="10"></rect><rect x="55" y="15" display="inline" width="10" height="10"></rect><rect x="5" y="65" display="inline" width="10" height="10"></rect><rect x="15" y="55" display="inline" width="10" height="10"></rect><rect x="15" y="45" display="inline" width="10" height="10"></rect><rect x="25" y="35" display="inline" width="10" height="10"></rect><rect x="65" y="25" display="inline" width="10" height="10"></rect><rect x="65" y="35" display="inline" width="10" height="10"></rect><rect x="75" y="45" display="inline" width="10" height="10"></rect><rect x="75" y="55" display="inline" width="10" height="10"></rect><rect x="85" y="65" display="inline" width="10" height="10"></rect><rect x="65" y="75" display="inline" width="10" height="10"></rect><rect x="55" y="75" display="inline" width="10" height="10"></rect><rect x="45" y="75" display="inline" width="10" height="10"></rect><rect x="45" y="85" display="inline" width="10" height="10"></rect><rect x="35" y="75" display="inline" width="10" height="10"></rect><rect x="25" y="75" display="inline" width="10" height="10"></rect><rect x="15" y="75" display="inline" width="10" height="10"></rect><rect x="5" y="75" display="inline" width="10" height="10"></rect></g><g><polygon points="5.675,93.515 14.675,93.515 14.675,93.015 14.675,62.152 14.675,61.652 5.675,61.652  "></polygon><path d="M18.175,93.515h9V52.804h-9V93.515z M19.175,53.804h7v38.711h-7V53.804z"></path><path d="M30.675,93.515h9v-47.06h-9V93.515z M31.675,47.456h7v45.06h-7V47.456z"></path><path d="M43.175,93.515h9V37.607h-9V93.515z M44.175,38.607h7v53.908h-7V38.607z"></path><path d="M55.675,93.515h9V28.759h-9V93.515z M56.675,29.759h7v62.756h-7V29.759z"></path><path d="M68.175,93.515h9V17.412h-9V93.515z M69.175,18.412h7v74.104h-7V18.412z"></path></g></svg>
--- a/dashboard/src/assets/icons_signal/carre-high/2.png
+++ b/dashboard/src/assets/icons_signal/carre-high/2.png
--- a/dashboard/src/assets/icons_signal/carre-high/2.svg
+++ b/dashboard/src/assets/icons_signal/carre-high/2.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><g display="none"><rect x="85" y="25" display="inline" width="10" height="10"></rect><rect x="65" y="35" display="inline" width="10" height="10"></rect><rect x="75" y="35" display="inline" width="10" height="10"></rect><rect x="55" y="45" display="inline" width="10" height="10"></rect><rect x="45" y="45" display="inline" width="10" height="10"></rect><rect x="35" y="45" display="inline" width="10" height="10"></rect><rect x="35" y="55" display="inline" width="10" height="10"></rect><rect x="35" y="65" display="inline" width="10" height="10"></rect><rect x="35" y="75" display="inline" width="10" height="10"></rect><rect x="25" y="75" display="inline" width="10" height="10"></rect><rect x="15" y="75" display="inline" width="10" height="10"></rect><rect x="5" y="75" display="inline" width="10" height="10"></rect><rect x="5" y="65" display="inline" width="10" height="10"></rect><rect x="5" y="55" display="inline" width="10" height="10"></rect><rect x="5" y="45" display="inline" width="10" height="10"></rect><rect x="15" y="45" display="inline" width="10" height="10"></rect><rect x="25" y="45" display="inline" width="10" height="10"></rect></g><g><polygon points="5.675,93.516 14.675,93.516 14.675,93.016 14.675,62.151 14.675,61.651 5.675,61.651  "></polygon><polygon points="18.175,93.516 27.175,93.516 27.175,93.016 27.175,53.304 27.175,52.804 18.175,52.804  "></polygon><path d="M30.675,93.516h9v-47.06h-9V93.516z M31.675,47.456h7v45.06h-7V47.456z"></path><path d="M43.175,93.516h9V37.607h-9V93.516z M44.175,38.607h7v53.908h-7V38.607z"></path><path d="M55.675,93.516h9V28.76h-9V93.516z M56.675,29.76h7v62.756h-7V29.76z"></path><path d="M68.175,93.516h9V17.412h-9V93.516z M69.175,18.412h7v74.104h-7V18.412z"></path></g></svg>
--- a/dashboard/src/assets/icons_signal/carre-high/3.png
+++ b/dashboard/src/assets/icons_signal/carre-high/3.png
--- a/dashboard/src/assets/icons_signal/carre-high/3.svg
+++ b/dashboard/src/assets/icons_signal/carre-high/3.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><g display="none"><rect x="45" y="5" display="inline" width="10" height="10"></rect><rect x="45" y="45" display="inline" width="10" height="10"></rect><rect x="35" y="5" display="inline" width="10" height="10"></rect><rect x="25" y="15" display="inline" width="10" height="10"></rect><rect x="15" y="15" display="inline" width="10" height="10"></rect><rect x="15" y="25" display="inline" width="10" height="10"></rect><rect x="5" y="45" display="inline" width="10" height="10"></rect><rect x="5" y="55" display="inline" width="10" height="10"></rect><rect x="5" y="35" display="inline" width="10" height="10"></rect><rect x="15" y="65" display="inline" width="10" height="10"></rect><rect x="15" y="75" display="inline" width="10" height="10"></rect><rect x="25" y="75" display="inline" width="10" height="10"></rect><rect x="45" y="85" display="inline" width="10" height="10"></rect><rect x="35" y="85" display="inline" width="10" height="10"></rect><rect x="55" y="85" display="inline" width="10" height="10"></rect><rect x="65" y="75" display="inline" width="10" height="10"></rect><rect x="75" y="65" display="inline" width="10" height="10"></rect><rect x="75" y="75" display="inline" width="10" height="10"></rect><rect x="85" y="45" display="inline" width="10" height="10"></rect><rect x="85" y="55" display="inline" width="10" height="10"></rect><rect x="85" y="35" display="inline" width="10" height="10"></rect><rect x="75" y="25" display="inline" width="10" height="10"></rect><rect x="65" y="15" display="inline" width="10" height="10"></rect><rect x="75" y="15" display="inline" width="10" height="10"></rect><rect x="55" y="5" display="inline" width="10" height="10"></rect></g><g><polygon points="5.427,93.516 14.427,93.516 14.427,93.016 14.427,62.151 14.427,61.651 5.427,61.651  "></polygon><polygon points="17.927,93.516 26.927,93.516 26.927,93.016 26.927,53.304 26.927,52.804 17.927,52.804  "></polygon><polygon points="30.427,93.516 39.427,93.516 39.427,93.016 39.427,46.956 39.427,46.456 30.427,46.456  "></polygon><path d="M42.927,93.516h9V37.607h-9V93.516z M43.927,38.607h7v53.908h-7V38.607z"></path><path d="M55.427,93.516h9V28.76h-9V93.516z M56.427,29.76h7v62.756h-7V29.76z"></path><path d="M67.927,93.516h9V17.412h-9V93.516z M68.927,18.412h7v74.104h-7V18.412z"></path></g></svg>
--- a/dashboard/src/assets/icons_signal/carre-high/4.png
+++ b/dashboard/src/assets/icons_signal/carre-high/4.png
--- a/dashboard/src/assets/icons_signal/carre-high/4.svg
+++ b/dashboard/src/assets/icons_signal/carre-high/4.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><g display="none"><rect x="15" y="15" display="inline" width="10" height="10"></rect><rect x="25" y="15" display="inline" width="10" height="10"></rect><rect x="35" y="15" display="inline" width="10" height="10"></rect><rect x="45" y="15" display="inline" width="10" height="10"></rect><rect x="55" y="15" display="inline" width="10" height="10"></rect><rect x="65" y="15" display="inline" width="10" height="10"></rect><rect x="75" y="15" display="inline" width="10" height="10"></rect><rect x="85" y="25" display="inline" width="10" height="10"></rect><rect x="85" y="35" display="inline" width="10" height="10"></rect><rect x="85" y="45" display="inline" width="10" height="10"></rect><rect x="85" y="55" display="inline" width="10" height="10"></rect><rect x="85" y="65" display="inline" width="10" height="10"></rect><rect x="75" y="75" display="inline" width="10" height="10"></rect><rect x="65" y="75" display="inline" width="10" height="10"></rect><rect x="55" y="75" display="inline" width="10" height="10"></rect><rect x="45" y="75" display="inline" width="10" height="10"></rect><rect x="35" y="75" display="inline" width="10" height="10"></rect><rect x="25" y="75" display="inline" width="10" height="10"></rect><rect x="15" y="75" display="inline" width="10" height="10"></rect><rect x="5" y="65" display="inline" width="10" height="10"></rect><rect x="5" y="55" display="inline" width="10" height="10"></rect><rect x="5" y="45" display="inline" width="10" height="10"></rect><rect x="5" y="35" display="inline" width="10" height="10"></rect><rect x="5" y="25" display="inline" width="10" height="10"></rect></g><g><polygon points="4,94.5 13,94.5 13,94 13,63.136 13,62.636 4,62.636  "></polygon><polygon points="16.5,94.5 25.5,94.5 25.5,94 25.5,54.288 25.5,53.788 16.5,53.788  "></polygon><polygon points="29,94.5 38,94.5 38,94 38,47.94 38,47.44 29,47.44  "></polygon><polygon points="41.5,94.5 50.5,94.5 50.5,94 50.5,39.092 50.5,38.592 41.5,38.592  "></polygon><path d="M54,94.5h9V29.744h-9V94.5z M55,30.744h7V93.5h-7V30.744z"></path><path d="M66.5,94.5h9V18.396h-9V94.5z M67.5,19.396h7V93.5h-7V19.396z"></path></g></svg>
--- a/dashboard/src/assets/icons_signal/carre-high/5.png
+++ b/dashboard/src/assets/icons_signal/carre-high/5.png
--- a/dashboard/src/assets/icons_signal/carre-high/5.svg
+++ b/dashboard/src/assets/icons_signal/carre-high/5.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><g display="none"><circle display="inline" fill="#000000" cx="50" cy="50" r="45"></circle></g><g display="none"><rect x="45" y="5" display="inline" width="10" height="10"></rect><rect x="35" y="5" display="inline" width="10" height="10"></rect><rect x="25" y="15" display="inline" width="10" height="10"></rect><rect x="15" y="15" display="inline" width="10" height="10"></rect><rect x="15" y="25" display="inline" width="10" height="10"></rect><rect x="5" y="45" display="inline" width="10" height="10"></rect><rect x="5" y="55" display="inline" width="10" height="10"></rect><rect x="5" y="35" display="inline" width="10" height="10"></rect><rect x="15" y="65" display="inline" width="10" height="10"></rect><rect x="15" y="75" display="inline" width="10" height="10"></rect><rect x="25" y="75" display="inline" width="10" height="10"></rect><rect x="45" y="85" display="inline" width="10" height="10"></rect><rect x="35" y="85" display="inline" width="10" height="10"></rect><rect x="55" y="85" display="inline" width="10" height="10"></rect><rect x="65" y="75" display="inline" width="10" height="10"></rect><rect x="75" y="65" display="inline" width="10" height="10"></rect><rect x="75" y="75" display="inline" width="10" height="10"></rect><rect x="85" y="45" display="inline" width="10" height="10"></rect><rect x="85" y="55" display="inline" width="10" height="10"></rect><rect x="85" y="35" display="inline" width="10" height="10"></rect><rect x="75" y="25" display="inline" width="10" height="10"></rect><rect x="65" y="15" display="inline" width="10" height="10"></rect><rect x="75" y="15" display="inline" width="10" height="10"></rect><rect x="55" y="5" display="inline" width="10" height="10"></rect></g><g><polygon points="5.675,94.5 14.675,94.5 14.675,94 14.675,63.136 14.675,62.636 5.675,62.636  "></polygon><polygon points="18.175,94.5 27.175,94.5 27.175,94 27.175,54.288 27.175,53.788 18.175,53.788  "></polygon><polygon points="30.675,94.5 39.675,94.5 39.675,94 39.675,47.94 39.675,47.44 30.675,47.44  "></polygon><polygon points="43.175,94.5 52.175,94.5 52.175,94 52.175,39.092 52.175,38.592 43.175,38.592  "></polygon><polygon points="55.675,94.5 64.675,94.5 64.675,94 64.675,30.244 64.675,29.744 55.675,29.744  "></polygon><path d="M68.175,94.5h9V18.396h-9V94.5z M69.175,19.396h7V93.5h-7V19.396z"></path></g></svg>
--- a/dashboard/src/assets/icons_signal/carre-high/6.png
+++ b/dashboard/src/assets/icons_signal/carre-high/6.png
--- a/dashboard/src/assets/icons_signal/carre-high/6.svg
+++ b/dashboard/src/assets/icons_signal/carre-high/6.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><g display="none"><rect x="45" y="25" display="inline" width="10" height="10"></rect><rect x="35" y="15" display="inline" width="10" height="10"></rect><rect x="25" y="15" display="inline" width="10" height="10"></rect><rect x="15" y="25" display="inline" width="10" height="10"></rect><rect x="5" y="35" display="inline" width="10" height="10"></rect><rect x="5" y="45" display="inline" width="10" height="10"></rect><rect x="15" y="55" display="inline" width="10" height="10"></rect><rect x="25" y="65" display="inline" width="10" height="10"></rect><rect x="35" y="75" display="inline" width="10" height="10"></rect><rect x="45" y="85" display="inline" width="10" height="10"></rect><rect x="55" y="15" display="inline" width="10" height="10"></rect><rect x="65" y="15" display="inline" width="10" height="10"></rect><rect x="75" y="25" display="inline" width="10" height="10"></rect><rect x="85" y="35" display="inline" width="10" height="10"></rect><rect x="85" y="45" display="inline" width="10" height="10"></rect><rect x="75" y="55" display="inline" width="10" height="10"></rect><rect x="65" y="65" display="inline" width="10" height="10"></rect><rect x="55" y="75" display="inline" width="10" height="10"></rect></g><g><rect x="4.895" y="64.136" width="8" height="30.864"></rect><rect x="17.395" y="55.288" width="8" height="39.712"></rect><rect x="29.895" y="48.94" width="8" height="46.06"></rect><rect x="42.395" y="40.092" width="8" height="54.908"></rect><rect x="54.895" y="31.244" width="8" height="63.756"></rect><rect x="67.395" y="19.896" width="8" height="75.104"></rect></g></svg>
--- a/dashboard/src/assets/icons_signal/carre-little/0.png
+++ b/dashboard/src/assets/icons_signal/carre-little/0.png
--- a/dashboard/src/assets/icons_signal/carre-little/0.svg
+++ b/dashboard/src/assets/icons_signal/carre-little/0.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><path d="M18.404,83.511H5V70.106h13.404V83.511z M7,81.511h9.404v-9.404H7V81.511z"></path><path d="M37.553,83.511H24.149V56.702h13.404V83.511z M26.149,81.511h9.404V58.702h-9.404V81.511z"></path><path d="M56.702,83.511H43.298V43.298h13.404V83.511z M45.298,81.511h9.404V45.298h-9.404V81.511z"></path><path d="M75.851,83.511H62.447V29.894h13.403V83.511z M64.447,81.511h9.403V31.894h-9.403V81.511z"></path><path d="M95,83.511H81.596V16.489H95V83.511z M83.596,81.511H93V18.489h-9.404V81.511z"></path></svg>
--- a/dashboard/src/assets/icons_signal/carre-little/1.png
+++ b/dashboard/src/assets/icons_signal/carre-little/1.png
--- a/dashboard/src/assets/icons_signal/carre-little/1.svg
+++ b/dashboard/src/assets/icons_signal/carre-little/1.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><rect x="5" y="70.106" width="13.404" height="13.404"></rect><path d="M37.553,83.511H24.149V56.702h13.404V83.511z M26.149,81.511h9.404V58.702h-9.404V81.511z"></path><path d="M56.702,83.511H43.298V43.298h13.404V83.511z M45.298,81.511h9.404V45.298h-9.404V81.511z"></path><path d="M75.851,83.511H62.447V29.894h13.403V83.511z M64.447,81.511h9.403V31.894h-9.403V81.511z"></path><path d="M95,83.511H81.596V16.489H95V83.511z M83.596,81.511H93V18.489h-9.404V81.511z"></path></svg>
--- a/dashboard/src/assets/icons_signal/carre-little/2.png
+++ b/dashboard/src/assets/icons_signal/carre-little/2.png
--- a/dashboard/src/assets/icons_signal/carre-little/2.svg
+++ b/dashboard/src/assets/icons_signal/carre-little/2.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><rect x="5" y="70.106" width="13.404" height="13.404"></rect><rect x="24.149" y="56.702" width="13.404" height="26.809"></rect><path d="M56.702,83.511H43.298V43.298h13.404V83.511z M45.298,81.511h9.404V45.298h-9.404V81.511z"></path><path d="M75.851,83.511H62.447V29.894h13.403V83.511z M64.447,81.511h9.403V31.894h-9.403V81.511z"></path><path d="M95,83.511H81.596V16.489H95V83.511z M83.596,81.511H93V18.489h-9.404V81.511z"></path></svg>
--- a/dashboard/src/assets/icons_signal/carre-little/3.png
+++ b/dashboard/src/assets/icons_signal/carre-little/3.png
--- a/dashboard/src/assets/icons_signal/carre-little/3.svg
+++ b/dashboard/src/assets/icons_signal/carre-little/3.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><rect x="5" y="70.106" width="13.404" height="13.404"></rect><rect x="24.149" y="56.702" width="13.404" height="26.809"></rect><rect x="43.298" y="43.298" width="13.404" height="40.213"></rect><path d="M75.851,83.511H62.447V29.894h13.403V83.511z M64.447,81.511h9.403V31.894h-9.403V81.511z"></path><path d="M95,83.511H81.596V16.489H95V83.511z M83.596,81.511H93V18.489h-9.404V81.511z"></path></svg>
--- a/dashboard/src/assets/icons_signal/carre-little/4.png
+++ b/dashboard/src/assets/icons_signal/carre-little/4.png
--- a/dashboard/src/assets/icons_signal/carre-little/4.svg
+++ b/dashboard/src/assets/icons_signal/carre-little/4.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><rect x="5" y="70.106" width="13.404" height="13.404"></rect><rect x="24.149" y="56.702" width="13.404" height="26.809"></rect><rect x="43.298" y="43.298" width="13.404" height="40.213"></rect><rect x="62.447" y="29.894" width="13.403" height="53.617"></rect><path d="M95,83.511H81.596V16.489H95V83.511z M83.596,81.511H93V18.489h-9.404V81.511z"></path></svg>
--- a/dashboard/src/assets/icons_signal/carre-little/5.png
+++ b/dashboard/src/assets/icons_signal/carre-little/5.png
--- a/dashboard/src/assets/icons_signal/carre-little/5.svg
+++ b/dashboard/src/assets/icons_signal/carre-little/5.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><rect x="5" y="70.106" width="13.404" height="13.404"></rect><rect x="24.149" y="56.702" width="13.404" height="26.809"></rect><rect x="43.298" y="43.298" width="13.404" height="40.213"></rect><rect x="62.447" y="29.894" width="13.403" height="53.617"></rect><rect x="81.596" y="16.489" width="13.404" height="67.021"></rect></svg>
--- a/dashboard/src/assets/icons_signal/rounded-little/0.png
+++ b/dashboard/src/assets/icons_signal/rounded-little/0.png
--- a/dashboard/src/assets/icons_signal/rounded-little/0.svg
+++ b/dashboard/src/assets/icons_signal/rounded-little/0.svg
--- a/dashboard/src/assets/icons_signal/rounded-little/1.base.txt
+++ b/dashboard/src/assets/icons_signal/rounded-little/1.base.txt
--- a/dashboard/src/assets/icons_signal/rounded-little/1.png
+++ b/dashboard/src/assets/icons_signal/rounded-little/1.png
--- a/dashboard/src/assets/icons_signal/rounded-little/1.svg
+++ b/dashboard/src/assets/icons_signal/rounded-little/1.svg
--- a/dashboard/src/assets/icons_signal/rounded-little/2.base.txt
+++ b/dashboard/src/assets/icons_signal/rounded-little/2.base.txt
--- a/dashboard/src/assets/icons_signal/rounded-little/2.png
+++ b/dashboard/src/assets/icons_signal/rounded-little/2.png
--- a/dashboard/src/assets/icons_signal/rounded-little/2.svg
+++ b/dashboard/src/assets/icons_signal/rounded-little/2.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 512 512" x="0px" y="0px"><defs><style>.cls-1{fill:none;}</style></defs><title>wifi20</title><path class="cls-1" d="M475.76,117.66c-0.11-.13-0.93-0.77-6.22-0.78-7.64,0-15.39-.15-22.89-0.29-8.19-.15-16.65-0.31-25-0.29-3.61,0-4.84.26-5.26,0.44-0.13.32-.4,1.34-0.4,4.37q0,55.17,0,110.28c0,52.37.05,106.52,0,159.82,0,3.08.6,4,.86,4.26s1.15,0.82,4.08.76C432.28,396,443.7,396,454.74,396c4.26,0,8.51,0,12.78,0h0c1.85,0,3.45.09,4.84,0.13s2.86,0.1,3.79,0c0.18-1.42,0-4.13,0-6.23,0-30.92-.17-60.64-0.17-90.88V256h0.5V225.41c0-33.43,0-67.76,0-100.56C476.48,123.29,476.48,118.51,475.76,117.66Z"></path><path class="cls-1" d="M380.16,172.31c-0.52-.51-1.89-0.78-3.78-0.75-11.11.19-22.39,0.16-33.29,0.12-5.36,0-10.71,0-16.07,0-5.68,0-5.68,0-5.69,7.76,0,25.75,0,52.27,0,78.71V283l0.06,4.5c0,9.29,0,18.41,0,27.45,0,26.37,0,51.27-.11,77.85a8.8,8.8,0,0,0,.33,3.19,10.17,10.17,0,0,0,3.83.34l6.25-.15c14.88-.35,30.26-0.71,45.44-0.4,2.51,0,3.08-.47,3.14-0.53s0.68-.83.67-4c-0.08-66.1-.07-136.42.05-215C381,173.45,380.41,172.56,380.16,172.31Z"></path><path class="cls-1" d="M284.44,228.07c-0.18-.17-1-0.73-3.67-0.68-11.41.21-23,.17-34.2,0.13q-7.58,0-15.17,0c-4.88,0-5.64.75-5.74,0.9-0.79,1.14-.79,5.7-0.8,8.42,0,18.36,0,37.33,0,56.49V312H225v24.91c0,16.72,0,33.21,0,50.68,0,4,0,8.2.4,9.53a41.48,41.48,0,0,0,7.07.26h3.12c6.43,0,13-.15,19.34-0.29,8.38-.19,17-0.39,25.6-0.25,1.89,0,3.24-.25,3.77-0.77s0.89-2.05.88-4.1c-0.12-52.9-.1-106.67.06-159.8C285.24,229.18,284.68,228.31,284.44,228.07Z"></path><path d="M469.54,107.88c-7.56,0-15.27-.15-22.73-0.29-8.24-.15-16.75-0.31-25.15-0.29-9.91,0-14.63,2.1-14.63,13.81q0,55.17,0,110.29c0,52.36.05,106.51,0,159.81,0,3.09.37,7.56,3.56,10.69,2.29,2.24,5.56,3.34,10,3.34,0.19,0,.38,0,0.58,0,11.14-.23,22.5-0.22,33.49-0.19,4.11,0,8.22,0,12.33,0h0.51c1.76,0,3.24.09,4.56,0.12,4.8,0.12,7.94.26,10.45-2.19,2.71-2.64,2.62-6.53,2.62-13,0-30.92-.17-60.65-0.17-90.89V265h0.5V225.41c0-33.43,0-67.76,0-100.57C485.48,112.9,483.26,107.9,469.54,107.88Zm7,117.53V256H476v43.07c0,30.24.18,60,.17,90.88,0,2.1.18,4.81,0,6.23-0.94.05-2.43,0-3.79,0s-3-.13-4.84-0.13h0c-4.27,0-8.52,0-12.78,0-11,0-22.46,0-33.71.21-2.94.06-3.83-.51-4.08-0.76s-0.86-1.18-.86-4.26c0-53.3,0-107.45,0-159.82q0-55.13,0-110.28c0-3,.26-4,0.4-4.37,0.42-.18,1.65-0.43,5.26-0.44,8.31,0,16.77.14,25,.29,7.49,0.14,15.24.29,22.89,0.29,5.29,0,6.11.65,6.22,0.78,0.72,0.85.73,5.62,0.73,7.19C476.5,157.66,476.5,192,476.5,225.41Z"></path><path d="M386.47,165.89c-2.36-2.32-5.69-3.4-10.25-3.34-11,.19-22.25.16-33.11,0.12q-8.06,0-16.11,0c-13.56,0-14.67,7.6-14.67,16.76,0,25.75,0,52.28,0,78.71V287.5l0.06,4.5h0c0,7.74,0,15.38,0,23,0,26.35,0,51.24-.11,77.79,0,3.3.32,7,3,9.67,2.51,2.47,6.08,2.92,9.4,2.92h1l6.26-.15c14.78-.35,30.06-0.71,45-0.4,4.26,0.09,7.41-.93,9.63-3.1,3-2.94,3.38-7.1,3.37-10.4-0.08-66.09-.07-136.41.05-215C390,171.65,388.85,168.24,386.47,165.89Zm-5.53,225.4c0,3.13-.56,3.85-0.67,4s-0.64.58-3.14,0.53c-15.17-.31-30.56,0-45.44.4l-6.25.15a10.17,10.17,0,0,1-3.83-.34,8.8,8.8,0,0,1-.33-3.19c0.16-26.58.13-51.48,0.11-77.85,0-9,0-18.16,0-27.45l-0.06-4.5V258.12c0-26.43,0-53,0-78.71,0-7.75,0-7.75,5.69-7.76,5.36,0,10.71,0,16.07,0,10.9,0,22.18.07,33.29-.12,1.89,0,3.26.24,3.78,0.75,0.25,0.25.85,1.14,0.84,4C380.88,254.87,380.86,325.19,380.95,391.3Z"></path><path d="M290.75,221.66c-2.32-2.28-5.66-3.37-10.15-3.26-11.31.21-22.84,0.17-34,.13q-7.6,0-15.21,0c-14.46,0-15.52,6.92-15.54,18.3,0,18.36,0,37.34,0,56.51V321H216v15.91c0,16.72,0,33.21,0,50.69,0,8.63,0,13,3,16,2.56,2.54,6,2.82,11.31,2.82h5.26c6.53,0,13.15-.15,19.55-0.3,8.29-.19,16.86-0.38,25.25-0.25,4.53,0.1,7.87-1,10.24-3.36s3.57-5.82,3.56-10.53c-0.12-52.89-.1-106.63.06-159.75C294.24,229.14,293.89,224.74,290.75,221.66ZM285.17,392c0,2-.32,3.54-0.88,4.1s-1.88.8-3.77,0.77c-8.56-.14-17.22.06-25.6,0.25-6.35.14-12.91,0.29-19.34,0.29h-3.12a41.48,41.48,0,0,1-7.07-.26c-0.42-1.33-.4-5.49-0.4-9.53,0-17.47,0-34,0-50.68V312h-0.16V293.3c0-19.16,0-38.13,0-56.49,0-2.72,0-7.27.8-8.42,0.1-.15.87-0.9,5.74-0.9q7.58,0,15.17,0c11.2,0,22.78.08,34.2-.13,2.72-.05,3.5.51,3.67,0.68s0.8,1.11.79,4.08C285.07,285.29,285.05,339.05,285.17,392Z"></path><path d="M195,277.32c-1.57-1.6-4.44-3.32-9.17-3.32H186v-0.16c-17,.1-34-0.06-51.54-0.15-4.31,0-7.61,1.08-9.9,3.38s-3.48,5.62-3.46,10.07c0.14,36,.14,71.12,0,104.39,0,4.65,1.11,8,3.46,10.36s5.67,3.41,10.26,3.34c17.36-.26,34.38-0.25,50.6,0h1c3.39,0,7-.36,9.59-2.92s2.87-6.34,2.82-9.31c-0.22-12.28-.18-23.48-0.14-35.35,0-3.48,0-7,0-10.65l0-4.49c0-4.37,0-9.06,0-13.94,0-12.74-.09-27.15.15-39.74C198.92,283.79,197.65,280,195,277.32Z"></path><path d="M100.94,330.66c-2.18-2.13-5.21-3.14-9.31-3h0c-4.7.1-9.27,0.11-13.14,0.1l-5.38,0q-7.91,0-15.82,0l-5.32,0h0c-3.85,0-8.42,0-13.1-.12-4.05-.12-7.05.86-9.2,3s-3.22,5.26-3.17,9.53c0.19,18.44.19,35.5,0,52.15,0,4.22,1,7.35,3.18,9.55s5.07,3.2,9,3.2H91.74c4,0,7.07-1.1,9.2-3.24s3.13-5,3.12-8.7c-0.05-18.82,0-37.71,0-53.7C104.08,335.63,103,332.71,100.94,330.66Z"></path></svg>
--- a/dashboard/src/assets/icons_signal/rounded-little/3.base.txt
+++ b/dashboard/src/assets/icons_signal/rounded-little/3.base.txt
--- a/dashboard/src/assets/icons_signal/rounded-little/3.png
+++ b/dashboard/src/assets/icons_signal/rounded-little/3.png
--- a/dashboard/src/assets/icons_signal/rounded-little/3.svg
+++ b/dashboard/src/assets/icons_signal/rounded-little/3.svg
@@ -1 +0,0 @@
-<svg xmlns="http://www.w3.org/2000/svg" data-name="Layer 1" viewBox="0 0 512 512" x="0px" y="0px"><defs><style>.cls-1{fill:none;}</style></defs><title>wifi20</title><path class="cls-1" d="M475.76,117.66c-0.11-.13-0.93-0.77-6.22-0.78-7.64,0-15.39-.15-22.89-0.29-8.19-.15-16.65-0.31-25-0.29-3.61,0-4.84.26-5.26,0.44-0.13.32-.4,1.34-0.4,4.37q0,55.17,0,110.28c0,52.37.05,106.52,0,159.82,0,3.08.6,4,.86,4.26s1.15,0.82,4.08.76c11.25-.24,22.66-0.2,33.71-0.16q6.39,0,12.78,0c1.83,0,3.47,0,4.86.08s2.86,0.07,3.79,0c0.18-1.42,0-4.14,0-6.24,0-30.92-.17-60.65-0.17-90.89V256h0.5V225.41c0-33.43,0-67.76,0-100.56C476.48,123.29,476.48,118.51,475.76,117.66Z"></path><path class="cls-1" d="M380.16,172.31c-0.52-.51-1.9-0.78-3.78-0.75-11.11.19-22.39,0.16-33.29,0.12-5.36,0-10.71,0-16.07,0-5.68,0-5.68,0-5.69,7.76,0,25.75,0,52.27,0,78.71V283l0.06,4.5c0,9.29,0,18.41,0,27.45,0,26.37,0,51.27-.11,77.85a8.8,8.8,0,0,0,.33,3.19,10.16,10.16,0,0,0,3.83.34l6.25-.15c14.88-.35,30.26-0.71,45.44-0.4,2.5,0,3.08-.47,3.14-0.53s0.68-.83.67-4c-0.08-66.1-.07-136.42.05-215C381,173.45,380.41,172.56,380.16,172.31Z"></path><path d="M469.54,107.88c-7.56,0-15.27-.15-22.73-0.29-8.24-.15-16.75-0.31-25.15-0.29-9.91,0-14.63,2.1-14.63,13.81q0,55.17,0,110.29c0,52.36.05,106.51,0,159.81,0,3.09.37,7.56,3.56,10.69,2.29,2.24,5.56,3.34,10,3.34,0.19,0,.38,0,0.58,0,11.14-.23,22.5-0.22,33.49-0.19,4.11,0,8.22,0,12.33,0h0.51c1.76,0,3.24.09,4.56,0.12,4.8,0.12,7.94.26,10.45-2.19,2.71-2.64,2.62-6.53,2.62-13,0-30.92-.17-60.65-0.17-90.89V265h0.5V225.41c0-33.43,0-67.76,0-100.57C485.48,112.9,483.26,107.9,469.54,107.88Zm7,117.53V256H476v43.07c0,30.24.18,60,.17,90.89,0,2.1.18,4.82,0,6.24-0.93.05-2.43,0-3.79,0s-3-.11-4.86-0.08q-6.4,0-12.78,0c-11,0-22.46-.07-33.71.16-2.94.06-3.83-.51-4.08-0.76s-0.86-1.18-.86-4.26c0-53.3,0-107.45,0-159.82q0-55.13,0-110.28c0-3,.26-4,0.4-4.37,0.42-.18,1.65-0.43,5.26-0.44,8.31,0,16.77.14,25,.29,7.49,0.14,15.24.29,22.89,0.29,5.29,0,6.11.65,6.22,0.78,0.72,0.85.73,5.62,0.73,7.19C476.5,157.66,476.5,192,476.5,225.41Z"></path><path d="M386.47,165.89c-2.36-2.32-5.71-3.4-10.25-3.34-11,.19-22.25.16-33.11,0.12q-8.06,0-16.11,0c-13.56,0-14.67,7.6-14.67,16.76,0,25.75,0,52.28,0,78.71V287.5l0.06,4.5h0c0,7.74,0,15.38,0,23,0,26.35,0,51.24-.11,77.79,0,3.3.32,7,3,9.67,2.51,2.47,6.08,2.92,9.4,2.92h1l6.26-.15c14.78-.35,30.06-0.71,45-0.4,4.25,0.09,7.41-.93,9.63-3.1,3-2.94,3.38-7.1,3.37-10.4-0.08-66.09-.07-136.41.05-215C390,171.65,388.85,168.24,386.47,165.89Zm-5.53,225.4c0,3.13-.56,3.85-0.67,4s-0.64.58-3.14,0.53c-15.17-.31-30.56,0-45.44.4l-6.25.15a10.16,10.16,0,0,1-3.83-.34,8.8,8.8,0,0,1-.33-3.19c0.16-26.58.13-51.48,0.11-77.85,0-9,0-18.16,0-27.45l-0.06-4.5V258.12c0-26.43,0-53,0-78.71,0-7.75,0-7.75,5.69-7.76,5.36,0,10.71,0,16.07,0,10.9,0,22.18.07,33.29-.12,1.88,0,3.26.24,3.78,0.75,0.25,0.25.85,1.14,0.84,4C380.88,254.87,380.86,325.19,380.95,391.3Z"></path><path d="M290.75,221.66c-2.32-2.28-5.66-3.37-10.15-3.26-11.31.21-22.84,0.17-34,.13q-7.6,0-15.21,0c-14.46,0-15.52,6.92-15.54,18.3,0,18.36,0,37.34,0,56.51V321H216v15.91c0,16.72,0,33.21,0,50.69,0,8.63,0,13,3,16,2.56,2.54,6,2.82,11.31,2.82h5.26c6.53,0,13.15-.15,19.55-0.3,8.29-.19,16.86-0.38,25.25-0.25,4.51,0.1,7.87-1,10.24-3.36s3.57-5.82,3.56-10.53c-0.12-52.89-.1-106.63.06-159.75C294.24,229.14,293.89,224.74,290.75,221.66Z"></path><path d="M195,277.32c-1.57-1.6-4.44-3.32-9.17-3.32H186v-0.16c-17,.1-34-0.06-51.54-0.15-4.31,0-7.61,1.08-9.9,3.38s-3.48,5.62-3.46,10.07c0.14,36,.14,71.12,0,104.39,0,4.65,1.11,8,3.46,10.36s5.69,3.41,10.26,3.34c17.36-.26,34.38-0.25,50.6,0h1c3.39,0,7-.36,9.59-2.92s2.87-6.34,2.82-9.31c-0.22-12.28-.18-23.48-0.14-35.35,0-3.48,0-7,0-10.65l0-4.49c0-4.37,0-9.06,0-13.94,0-12.74-.09-27.15.15-39.74C198.92,283.79,197.65,280,195,277.32Z"></path><path d="M100.94,330.66c-2.17-2.13-5.2-3.14-9.31-3h0c-4.7.1-9.28,0.11-13.14,0.1l-5.38,0q-7.91,0-15.82,0l-5.32,0h0c-3.85,0-8.42,0-13.1-.12-4-.12-7.05.86-9.2,3s-3.22,5.26-3.17,9.53c0.19,18.44.19,35.5,0,52.15,0,4.22,1,7.35,3.18,9.55s5.07,3.2,9,3.2H91.74c4,0,7.07-1.1,9.2-3.24s3.13-5,3.12-8.7c-0.05-18.82,0-37.71,0-53.7C104.08,335.63,103,332.71,100.94,330.66Z"></path></svg>
--- a/dashboard/src/assets/icons_signal/rounded-little/4.base.txt
+++ b/dashboard/src/assets/icons_signal/rounded-little/4.base.txt
@@ -1 +0,0 @@
-PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGRhdGEtbmFtZT0iTGF5ZXIgMSIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHg9IjBweCIgeT0iMHB4Ij48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6bm9uZTt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPndpZmkyMDwvdGl0bGU+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNNDc1Ljc2LDExNy42NmMtMC4xMS0uMTMtMC45My0wLjc3LTYuMjItMC43OC03LjY0LDAtMTUuMzktLjE1LTIyLjg5LTAuMjktOC4xOS0uMTUtMTYuNjYtMC4zMS0yNS0wLjI5LTMuNjEsMC00Ljg0LjI2LTUuMjYsMC40NC0wLjEzLjMyLS40LDEuMzQtMC40LDQuMzdxMCw1NS4xNywwLDExMC4yOGMwLDUyLjM3LjA1LDEwNi41MiwwLDE1OS44MiwwLDMuMDguNiw0LC44Niw0LjI2czEuMTUsMC44Miw0LjA4Ljc2YzExLjI1LS4yNCwyMi42Ni0wLjIsMzMuNzEtMC4xNiw0LjI2LDAsOC41NCwwLDEyLjc4LDAsMS44OCwwLDMuNDcsMCw0Ljg2LjA4czIuODYsMC4wNywzLjc5LDBjMC4xOC0xLjQyLDAtNC4xNCwwLTYuMjQsMC0zMC45Mi0uMTctNjAuNjUtMC4xNy05MC44OVYyNTZoMC41VjIyNS40MWMwLTMzLjQzLDAtNjcuNzYsMC0xMDAuNTZDNDc2LjQ4LDEyMy4yOSw0NzYuNDgsMTE4LjUxLDQ3NS43NiwxMTcuNjZaIj48L3BhdGg+PHBhdGggZD0iTTQ2OS41NCwxMDcuODhjLTcuNTYsMC0xNS4yNy0uMTUtMjIuNzMtMC4yOS04LjI0LS4xNS0xNi43Ni0wLjMxLTI1LjE1LTAuMjktOS45MSwwLTE0LjYzLDIuMS0xNC42MywxMy44MXEwLDU1LjE3LDAsMTEwLjI5YzAsNTIuMzYuMDUsMTA2LjUxLDAsMTU5LjgxLDAsMy4wOS4zNyw3LjU2LDMuNTYsMTAuNjksMi4yOSwyLjI0LDUuNTYsMy4zNCwxMCwzLjM0LDAuMTksMCwuMzgsMCwwLjU4LDAsMTEuMTQtLjIzLDIyLjUtMC4yMiwzMy40OS0wLjE5LDQuMTEsMCw4LjIyLDAsMTIuMzMsMGgwLjUxYzEuNzYsMCwzLjI0LjA5LDQuNTYsMC4xMiw0LjgsMC4xMiw3Ljk0LjI2LDEwLjQ1LTIuMTksMi43MS0yLjY0LDIuNjItNi41MywyLjYyLTEzLDAtMzAuOTItLjE3LTYwLjY1LTAuMTctOTAuODlWMjY1aDAuNVYyMjUuNDFjMC0zMy40MywwLTY3Ljc2LDAtMTAwLjU3QzQ4NS40OCwxMTIuOSw0ODMuMjYsMTA3LjksNDY5LjU0LDEwNy44OFptNywxMTcuNTNWMjU2SDQ3NnY0My4wN2MwLDMwLjI0LjE4LDYwLC4xNyw5MC44OSwwLDIuMS4xOCw0LjgyLDAsNi4yNC0wLjk0LjA1LTIuNDMsMC0zLjc5LDBzLTMtLjExLTQuODYtMC4wOGMtNC4yNCwwLTguNTIsMC0xMi43OCwwLTExLDAtMjIuNDYtLjA3LTMzLjcxLjE2LTIuOTQuMDYtMy44My0uNTEtNC4wOC0wLjc2cy0wLjg2LTEuMTgtLjg2LTQuMjZjMC01My4zLDAtMTA3LjQ1LDAtMTU5LjgycTAtNTUuMTMsMC0xMTAuMjhjMC0zLC4yNi00LDAuNC00LjM3LDAuNDItLjE4LDEuNjUtMC40Myw1LjI2LTAuNDQsOC4zLDAsMTYuNzcuMTQsMjUsLjI5LDcuNDksMC4xNCwxNS4yNC4yOSwyMi44OSwwLjI5LDUuMjksMCw2LjExLjY1LDYuMjIsMC43OCwwLjcyLDAuODUuNzMsNS42MiwwLjczLDcuMTlDNDc2LjUsMTU3LjY2LDQ3Ni41LDE5Miw0NzYuNSwyMjUuNDFaIj48L3BhdGg+PHBhdGggZD0iTTM4Ni40NywxNjUuODljLTIuMzYtMi4zMi01LjY5LTMuNC0xMC4yNS0zLjM0LTExLC4xOS0yMi4yNS4xNi0zMy4xMSwwLjEycS04LjA2LDAtMTYuMTEsMGMtMTMuNTYsMC0xNC42Nyw3LjYtMTQuNjcsMTYuNzYsMCwyNS43NSwwLDUyLjI4LDAsNzguNzFWMjg3LjVsMC4wNiw0LjVoMGMwLDcuNzQsMCwxNS4zOCwwLDIzLDAsMjYuMzUsMCw1MS4yNC0uMTEsNzcuNzksMCwzLjMuMzIsNywzLDkuNjcsMi41MSwyLjQ3LDYuMDgsMi45Miw5LjQsMi45MmgxbDYuMjYtLjE1YzE0Ljc4LS4zNSwzMC4wNi0wLjcxLDQ1LTAuNCw0LjI2LDAuMDksNy40MS0uOTMsOS42My0zLjEsMy0yLjk0LDMuMzgtNy4xLDMuMzctMTAuNC0wLjA4LTY2LjA5LS4wNy0xMzYuNDEuMDUtMjE1QzM5MCwxNzEuNjUsMzg4Ljg1LDE2OC4yNCwzODYuNDcsMTY1Ljg5WiI+PC9wYXRoPjxwYXRoIGQ9Ik0yOTAuNzUsMjIxLjY2Yy0yLjMyLTIuMjgtNS42Ni0zLjM3LTEwLjE1LTMuMjYtMTEuMzEuMjEtMjIuODQsMC4xNy0zNCwuMTNxLTcuNiwwLTE1LjIxLDBjLTE0LjQ2LDAtMTUuNTIsNi45Mi0xNS41NCwxOC4zLDAsMTguMzYsMCwzNy4zNCwwLDU2LjUxVjMyMUgyMTZ2MTUuOTFjMCwxNi43MiwwLDMzLjIxLDAsNTAuNjksMCw4LjYzLDAsMTMsMywxNiwyLjU2LDIuNTQsNiwyLjgyLDExLjMxLDIuODJoNS4yNmM2LjUzLDAsMTMuMTUtLjE1LDE5LjU1LTAuMyw4LjI5LS4xOSwxNi44Ni0wLjM4LDI1LjI1LTAuMjUsNC41MSwwLjEsNy44Ny0xLDEwLjI0LTMuMzZzMy41Ny01LjgyLDMuNTYtMTAuNTNjLTAuMTItNTIuODktLjEtMTA2LjYzLjA2LTE1OS43NUMyOTQuMjQsMjI5LjE0LDI5My44OSwyMjQuNzQsMjkwLjc1LDIyMS42NloiPjwvcGF0aD48cGF0aCBkPSJNMTk1LDI3Ny4zMmMtMS41Ny0xLjYtNC40NC0zLjMyLTkuMTctMy4zMkgxODZ2LTAuMTZjLTE3LC4xLTM0LTAuMDYtNTEuNTQtMC4xNS00LjMyLDAtNy42MSwxLjA4LTkuOSwzLjM4cy0zLjQ4LDUuNjItMy40NiwxMC4wN2MwLjE0LDM2LC4xNCw3MS4xMiwwLDEwNC4zOSwwLDQuNjUsMS4xMSw4LDMuNDYsMTAuMzZzNS42NywzLjQxLDEwLjI2LDMuMzRjMTcuMzYtLjI2LDM0LjM4LTAuMjUsNTAuNiwwaDFjMy4zOSwwLDctLjM2LDkuNTktMi45MnMyLjg3LTYuMzQsMi44Mi05LjMxYy0wLjIyLTEyLjI4LS4xOC0yMy40OC0wLjE0LTM1LjM1LDAtMy40OCwwLTcsMC0xMC42NWwwLTQuNDljMC00LjM3LDAtOS4wNiwwLTEzLjk0LDAtMTIuNzQtLjA5LTI3LjE1LjE1LTM5Ljc0QzE5OC45MiwyODMuNzksMTk3LjY1LDI4MCwxOTUsMjc3LjMyWiI+PC9wYXRoPjxwYXRoIGQ9Ik0xMDAuOTQsMzMwLjY2Yy0yLjE4LTIuMTMtNS4yMS0zLjE0LTkuMzEtM2gwYy00LjcuMS05LjI3LDAuMTEtMTMuMTQsMC4xbC01LjM4LDBxLTcuOTEsMC0xNS44MiwwbC01LjMyLDBoMGMtMy44NSwwLTguNDIsMC0xMy4xLS4xMi00LjA1LS4xMi03LjA1Ljg2LTkuMiwzcy0zLjIyLDUuMjYtMy4xNyw5LjUzYzAuMTksMTguNDQuMTksMzUuNSwwLDUyLjE1LDAsNC4yMiwxLDcuMzUsMy4xOCw5LjU1czUuMDcsMy4yLDksMy4ySDkxLjc0YzQsMCw3LjA3LTEuMSw5LjItMy4yNHMzLjEzLTUsMy4xMi04LjdjLTAuMDUtMTguODIsMC0zNy43MSwwLTUzLjdDMTA0LjA4LDMzNS42MywxMDMsMzMyLjcxLDEwMC45NCwzMzAuNjZaIj48L3BhdGg+PC9zdmc+
--- a/Show More
+++ b/Show More
Author	SHA1	Message	Date
Maxence G. de Montauzan	0417604587	Els Service: get Artists	2017-10-13 20:32:28 +02:00
Maxence G. de Montauzan	e4aadd72f9	Add link with angular-tag-cloud	2017-10-13 20:00:09 +02:00
Maxence G. de Montauzan	b886577361	It's OK with angular4-word-cloud	2017-10-13 19:59:44 +02:00
Maxence G. de Montauzan	d27732f97e	Try with angular4-word-cloud - update don't run...	2017-10-12 01:19:10 +02:00
Maxence G. de Montauzan	b10c106a5f	Improve observable	2017-10-12 00:31:20 +02:00
Maxence G. de Montauzan	1e6d388596	First try with angular-tag-cloud-module	2017-10-12 00:27:50 +02:00
				`@@ -1 +0,0 @@`
				<svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" viewBox="0 0 100 100" enable-background="new 0 0 100 100" xml:space="preserve"><g display="none"><rect x="45" y="5" display="inline" width="10" height="10"></rect><rect x="45" y="45" display="inline" width="10" height="10"></rect><rect x="35" y="35" display="inline" width="10" height="10"></rect><rect x="25" y="25" display="inline" width="10" height="10"></rect><rect x="55" y="35" display="inline" width="10" height="10"></rect><rect x="65" y="15" display="inline" width="10" height="10"></rect><rect x="35" y="5" display="inline" width="10" height="10"></rect><rect x="15" y="15" display="inline" width="10" height="10"></rect><rect x="5" y="45" display="inline" width="10" height="10"></rect><rect x="5" y="55" display="inline" width="10" height="10"></rect><rect x="5" y="35" display="inline" width="10" height="10"></rect><rect x="15" y="65" display="inline" width="10" height="10"></rect><rect x="15" y="75" display="inline" width="10" height="10"></rect><rect x="25" y="75" display="inline" width="10" height="10"></rect><rect x="45" y="85" display="inline" width="10" height="10"></rect><rect x="35" y="85" display="inline" width="10" height="10"></rect><rect x="55" y="85" display="inline" width="10" height="10"></rect><rect x="65" y="75" display="inline" width="10" height="10"></rect><rect x="75" y="65" display="inline" width="10" height="10"></rect><rect x="75" y="75" display="inline" width="10" height="10"></rect><rect x="85" y="45" display="inline" width="10" height="10"></rect><rect x="85" y="55" display="inline" width="10" height="10"></rect><rect x="85" y="35" display="inline" width="10" height="10"></rect><rect x="75" y="25" display="inline" width="10" height="10"></rect><rect x="75" y="15" display="inline" width="10" height="10"></rect><rect x="55" y="5" display="inline" width="10" height="10"></rect></g><g><path d="M5.675,93.515h9V61.651h-9V93.515z M6.675,62.651h7v29.864h-7V62.651z"></path><path d="M18.175,93.515h9V52.803h-9V93.515z M19.175,53.803h7v38.712h-7V53.803z"></path><path d="M30.675,93.515h9v-47.06h-9V93.515z M31.675,47.455h7v45.06h-7V47.455z"></path><path d="M43.175,93.515h9V37.607h-9V93.515z M44.175,38.607h7v53.908h-7V38.607z"></path><path d="M55.675,93.515h9V28.759h-9V93.515z M56.675,29.759h7v62.756h-7V29.759z"></path><path d="M68.175,17.411v76.104h9V17.411H68.175z M76.175,92.515h-7V18.411h7V92.515z"></path></g></svg>
				`@@ -1 +0,0 @@`
				PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIGRhdGEtbmFtZT0iTGF5ZXIgMSIgdmlld0JveD0iMCAwIDUxMiA1MTIiIHg9IjBweCIgeT0iMHB4Ij48ZGVmcz48c3R5bGU+LmNscy0xe2ZpbGw6bm9uZTt9PC9zdHlsZT48L2RlZnM+PHRpdGxlPndpZmkyMDwvdGl0bGU+PHBhdGggY2xhc3M9ImNscy0xIiBkPSJNNDc1Ljc2LDExNy42NmMtMC4xMS0uMTMtMC45My0wLjc3LTYuMjItMC43OC03LjY0LDAtMTUuMzktLjE1LTIyLjg5LTAuMjktOC4xOS0uMTUtMTYuNjYtMC4zMS0yNS0wLjI5LTMuNjEsMC00Ljg0LjI2LTUuMjYsMC40NC0wLjEzLjMyLS40LDEuMzQtMC40LDQuMzdxMCw1NS4xNywwLDExMC4yOGMwLDUyLjM3LjA1LDEwNi41MiwwLDE1OS44MiwwLDMuMDguNiw0LC44Niw0LjI2czEuMTUsMC44Miw0LjA4Ljc2YzExLjI1LS4yNCwyMi42Ni0wLjIsMzMuNzEtMC4xNiw0LjI2LDAsOC41NCwwLDEyLjc4LDAsMS44OCwwLDMuNDcsMCw0Ljg2LjA4czIuODYsMC4wNywzLjc5LDBjMC4xOC0xLjQyLDAtNC4xNCwwLTYuMjQsMC0zMC45Mi0uMTctNjAuNjUtMC4xNy05MC44OVYyNTZoMC41VjIyNS40MWMwLTMzLjQzLDAtNjcuNzYsMC0xMDAuNTZDNDc2LjQ4LDEyMy4yOSw0NzYuNDgsMTE4LjUxLDQ3NS43NiwxMTcuNjZaIj48L3BhdGg+PHBhdGggZD0iTTQ2OS41NCwxMDcuODhjLTcuNTYsMC0xNS4yNy0uMTUtMjIuNzMtMC4yOS04LjI0LS4xNS0xNi43Ni0wLjMxLTI1LjE1LTAuMjktOS45MSwwLTE0LjYzLDIuMS0xNC42MywxMy44MXEwLDU1LjE3LDAsMTEwLjI5YzAsNTIuMzYuMDUsMTA2LjUxLDAsMTU5LjgxLDAsMy4wOS4zNyw3LjU2LDMuNTYsMTAuNjksMi4yOSwyLjI0LDUuNTYsMy4zNCwxMCwzLjM0LDAuMTksMCwuMzgsMCwwLjU4LDAsMTEuMTQtLjIzLDIyLjUtMC4yMiwzMy40OS0wLjE5LDQuMTEsMCw4LjIyLDAsMTIuMzMsMGgwLjUxYzEuNzYsMCwzLjI0LjA5LDQuNTYsMC4xMiw0LjgsMC4xMiw3Ljk0LjI2LDEwLjQ1LTIuMTksMi43MS0yLjY0LDIuNjItNi41MywyLjYyLTEzLDAtMzAuOTItLjE3LTYwLjY1LTAuMTctOTAuODlWMjY1aDAuNVYyMjUuNDFjMC0zMy40MywwLTY3Ljc2LDAtMTAwLjU3QzQ4NS40OCwxMTIuOSw0ODMuMjYsMTA3LjksNDY5LjU0LDEwNy44OFptNywxMTcuNTNWMjU2SDQ3NnY0My4wN2MwLDMwLjI0LjE4LDYwLC4xNyw5MC44OSwwLDIuMS4xOCw0LjgyLDAsNi4yNC0wLjk0LjA1LTIuNDMsMC0zLjc5LDBzLTMtLjExLTQuODYtMC4wOGMtNC4yNCwwLTguNTIsMC0xMi43OCwwLTExLDAtMjIuNDYtLjA3LTMzLjcxLjE2LTIuOTQuMDYtMy44My0uNTEtNC4wOC0wLjc2cy0wLjg2LTEuMTgtLjg2LTQuMjZjMC01My4zLDAtMTA3LjQ1LDAtMTU5LjgycTAtNTUuMTMsMC0xMTAuMjhjMC0zLC4yNi00LDAuNC00LjM3LDAuNDItLjE4LDEuNjUtMC40Myw1LjI2LTAuNDQsOC4zLDAsMTYuNzcuMTQsMjUsLjI5LDcuNDksMC4xNCwxNS4yNC4yOSwyMi44OSwwLjI5LDUuMjksMCw2LjExLjY1LDYuMjIsMC43OCwwLjcyLDAuODUuNzMsNS42MiwwLjczLDcuMTlDNDc2LjUsMTU3LjY2LDQ3Ni41LDE5Miw0NzYuNSwyMjUuNDFaIj48L3BhdGg+PHBhdGggZD0iTTM4Ni40NywxNjUuODljLTIuMzYtMi4zMi01LjY5LTMuNC0xMC4yNS0zLjM0LTExLC4xOS0yMi4yNS4xNi0zMy4xMSwwLjEycS04LjA2LDAtMTYuMTEsMGMtMTMuNTYsMC0xNC42Nyw3LjYtMTQuNjcsMTYuNzYsMCwyNS43NSwwLDUyLjI4LDAsNzguNzFWMjg3LjVsMC4wNiw0LjVoMGMwLDcuNzQsMCwxNS4zOCwwLDIzLDAsMjYuMzUsMCw1MS4yNC0uMTEsNzcuNzksMCwzLjMuMzIsNywzLDkuNjcsMi41MSwyLjQ3LDYuMDgsMi45Miw5LjQsMi45MmgxbDYuMjYtLjE1YzE0Ljc4LS4zNSwzMC4wNi0wLjcxLDQ1LTAuNCw0LjI2LDAuMDksNy40MS0uOTMsOS42My0zLjEsMy0yLjk0LDMuMzgtNy4xLDMuMzctMTAuNC0wLjA4LTY2LjA5LS4wNy0xMzYuNDEuMDUtMjE1QzM5MCwxNzEuNjUsMzg4Ljg1LDE2OC4yNCwzODYuNDcsMTY1Ljg5WiI+PC9wYXRoPjxwYXRoIGQ9Ik0yOTAuNzUsMjIxLjY2Yy0yLjMyLTIuMjgtNS42Ni0zLjM3LTEwLjE1LTMuMjYtMTEuMzEuMjEtMjIuODQsMC4xNy0zNCwuMTNxLTcuNiwwLTE1LjIxLDBjLTE0LjQ2LDAtMTUuNTIsNi45Mi0xNS41NCwxOC4zLDAsMTguMzYsMCwzNy4zNCwwLDU2LjUxVjMyMUgyMTZ2MTUuOTFjMCwxNi43MiwwLDMzLjIxLDAsNTAuNjksMCw4LjYzLDAsMTMsMywxNiwyLjU2LDIuNTQsNiwyLjgyLDExLjMxLDIuODJoNS4yNmM2LjUzLDAsMTMuMTUtLjE1LDE5LjU1LTAuMyw4LjI5LS4xOSwxNi44Ni0wLjM4LDI1LjI1LTAuMjUsNC41MSwwLjEsNy44Ny0xLDEwLjI0LTMuMzZzMy41Ny01LjgyLDMuNTYtMTAuNTNjLTAuMTItNTIuODktLjEtMTA2LjYzLjA2LTE1OS43NUMyOTQuMjQsMjI5LjE0LDI5My44OSwyMjQuNzQsMjkwLjc1LDIyMS42NloiPjwvcGF0aD48cGF0aCBkPSJNMTk1LDI3Ny4zMmMtMS41Ny0xLjYtNC40NC0zLjMyLTkuMTctMy4zMkgxODZ2LTAuMTZjLTE3LC4xLTM0LTAuMDYtNTEuNTQtMC4xNS00LjMyLDAtNy42MSwxLjA4LTkuOSwzLjM4cy0zLjQ4LDUuNjItMy40NiwxMC4wN2MwLjE0LDM2LC4xNCw3MS4xMiwwLDEwNC4zOSwwLDQuNjUsMS4xMSw4LDMuNDYsMTAuMzZzNS42NywzLjQxLDEwLjI2LDMuMzRjMTcuMzYtLjI2LDM0LjM4LTAuMjUsNTAuNiwwaDFjMy4zOSwwLDctLjM2LDkuNTktMi45MnMyLjg3LTYuMzQsMi44Mi05LjMxYy0wLjIyLTEyLjI4LS4xOC0yMy40OC0wLjE0LTM1LjM1LDAtMy40OCwwLTcsMC0xMC42NWwwLTQuNDljMC00LjM3LDAtOS4wNiwwLTEzLjk0LDAtMTIuNzQtLjA5LTI3LjE1LjE1LTM5Ljc0QzE5OC45MiwyODMuNzksMTk3LjY1LDI4MCwxOTUsMjc3LjMyWiI+PC9wYXRoPjxwYXRoIGQ9Ik0xMDAuOTQsMzMwLjY2Yy0yLjE4LTIuMTMtNS4yMS0zLjE0LTkuMzEtM2gwYy00LjcuMS05LjI3LDAuMTEtMTMuMTQsMC4xbC01LjM4LDBxLTcuOTEsMC0xNS44MiwwbC01LjMyLDBoMGMtMy44NSwwLTguNDIsMC0xMy4xLS4xMi00LjA1LS4xMi03LjA1Ljg2LTkuMiwzcy0zLjIyLDUuMjYtMy4xNyw5LjUzYzAuMTksMTguNDQuMTksMzUuNSwwLDUyLjE1LDAsNC4yMiwxLDcuMzUsMy4xOCw5LjU1czUuMDcsMy4yLDksMy4ySDkxLjc0YzQsMCw3LjA3LTEuMSw5LjItMy4yNHMzLjEzLTUsMy4xMi04LjdjLTAuMDUtMTguODIsMC0zNy43MSwwLTUzLjdDMTA0LjA4LDMzNS42MywxMDMsMzMyLjcxLDEwMC45NCwzMzAuNjZaIj48L3BhdGg+PC9zdmc+