Creating web app environement.

Kyoo/ClientApp/.editorconfig

@@ -1,4 +1,4 @@
-# Editor configuration, see http://editorconfig.org
+# Editor configuration, see https://editorconfig.org
 root = true
 
 [*]

Kyoo/ClientApp/.gitignore

@@ -2,13 +2,18 @@
 
 # compiled output
 /dist
-/dist-server
 /tmp
 /out-tsc
+# Only exists if Bazel was run
+/bazel-out
 
 # dependencies
 /node_modules
 
+# profiling files
+chrome-profiler-events*.json
+speed-measure-plugin*.json
+
 # IDEs and editors
 /.idea
 .project
@@ -24,6 +29,7 @@
 !.vscode/tasks.json
 !.vscode/launch.json
 !.vscode/extensions.json
+.history/*
 
 # misc
 /.sass-cache
@@ -31,13 +37,10 @@
 /coverage
 /libpeerconnection.log
 npm-debug.log
+yarn-error.log
 testem.log
 /typings
 
-# e2e
-/e2e/*.js
-/e2e/*.map
-
 # System Files
 .DS_Store
 Thumbs.db

Kyoo/ClientApp/README.md

@@ -1,6 +1,6 @@
-# AngularSpa
+# Kyoo
 
-This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.7.0.
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 8.2.1.
 
 ## Development server
 
@@ -12,7 +12,7 @@ Run `ng generate component component-name` to generate a new component. You can
 
 ## 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.
+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
 

Kyoo/ClientApp/angular.json

@@ -0,0 +1,129 @@
+{
+  "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
+  "version": 1,
+  "newProjectRoot": "projects",
+  "projects": {
+    "Kyoo": {
+      "projectType": "application",
+      "schematics": {
+        "@schematics/angular:component": {
+          "style": "sass"
+        }
+      },
+      "root": "",
+      "sourceRoot": "src",
+      "prefix": "app",
+      "architect": {
+        "build": {
+          "builder": "@angular-devkit/build-angular:browser",
+          "options": {
+            "outputPath": "dist/Kyoo",
+            "index": "src/index.html",
+            "main": "src/main.ts",
+            "polyfills": "src/polyfills.ts",
+            "tsConfig": "tsconfig.app.json",
+            "aot": false,
+            "assets": [
+              "src/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.sass"
+            ],
+            "scripts": []
+          },
+          "configurations": {
+            "production": {
+              "fileReplacements": [
+                {
+                  "replace": "src/environments/environment.ts",
+                  "with": "src/environments/environment.prod.ts"
+                }
+              ],
+              "optimization": true,
+              "outputHashing": "all",
+              "sourceMap": false,
+              "extractCss": true,
+              "namedChunks": false,
+              "aot": true,
+              "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": "Kyoo:build"
+          },
+          "configurations": {
+            "production": {
+              "browserTarget": "Kyoo:build:production"
+            }
+          }
+        },
+        "extract-i18n": {
+          "builder": "@angular-devkit/build-angular:extract-i18n",
+          "options": {
+            "browserTarget": "Kyoo: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/favicon.ico",
+              "src/assets"
+            ],
+            "styles": [
+              "src/styles.sass"
+            ],
+            "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": "Kyoo:serve"
+          },
+          "configurations": {
+            "production": {
+              "devServerTarget": "Kyoo:serve:production"
+            }
+          }
+        }
+      }
+    }},
+  "defaultProject": "Kyoo"
+}

Kyoo/ClientApp/browserslist

@@ -0,0 +1,12 @@
+# This file is used by the build system to adjust CSS and JS output to support the specified browsers below.
+# For additional information regarding the format and rule options, please see:
+# https://github.com/browserslist/browserslist#queries
+
+# You can see what browsers were selected by your queries by running:
+#   npx browserslist
+
+> 0.5%
+last 2 versions
+Firefox ESR
+not dead
+not IE 9-11 # For IE 9-11 support, remove 'not'.

Kyoo/ClientApp/e2e/app.e2e-spec.ts

@@ -1,14 +0,0 @@
-import { AppPage } from './app.po';
-
-describe('App', () => {
-  let page: AppPage;
-
-  beforeEach(() => {
-    page = new AppPage();
-  });
-
-  it('should display welcome message', () => {
-    page.navigateTo();
-    expect(page.getMainHeading()).toEqual('Hello, world!');
-  });
-});

Kyoo/ClientApp/e2e/app.po.ts

@@ -1,11 +0,0 @@
-import { browser, by, element } from 'protractor';
-
-export class AppPage {
-  navigateTo() {
-    return browser.get('/');
-  }
-
-  getMainHeading() {
-    return element(by.css('app-root h1')).getText();
-  }
-}

Kyoo/ClientApp/e2e/protractor.conf.js

@@ -1,12 +1,16 @@
+// @ts-check
 // Protractor configuration file, see link for more information
 // https://github.com/angular/protractor/blob/master/lib/config.ts
 
 const { SpecReporter } = require('jasmine-spec-reporter');
 
+/**
+ * @type { import("protractor").Config }
+ */
 exports.config = {
   allScriptsTimeout: 11000,
   specs: [
-    './e2e/**/*.e2e-spec.ts'
+    './src/**/*.e2e-spec.ts'
   ],
   capabilities: {
     'browserName': 'chrome'
@@ -21,8 +25,8 @@ exports.config = {
   },
   onPrepare() {
     require('ts-node').register({
-      project: 'e2e/tsconfig.e2e.json'
+      project: require('path').join(__dirname, './tsconfig.json')
     });
     jasmine.getEnv().addReporter(new SpecReporter({ spec: { displayStacktrace: true } }));
   }
-};
+};

Kyoo/ClientApp/e2e/src/app.e2e-spec.ts

@@ -0,0 +1,23 @@
+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', () => {
+    page.navigateTo();
+    expect(page.getTitleText()).toEqual('Welcome to Kyoo!');
+  });
+
+  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));
+  });
+});

Kyoo/ClientApp/e2e/src/app.po.ts

@@ -0,0 +1,11 @@
+import { browser, by, element } from 'protractor';
+
+export class AppPage {
+  navigateTo() {
+    return browser.get(browser.baseUrl) as Promise<any>;
+  }
+
+  getTitleText() {
+    return element(by.css('app-root h1')).getText() as Promise<string>;
+  }
+}

Kyoo/ClientApp/e2e/tsconfig.json

@@ -2,7 +2,6 @@
   "extends": "../tsconfig.json",
   "compilerOptions": {
     "outDir": "../out-tsc/e2e",
-    "baseUrl": "./",
     "module": "commonjs",
     "target": "es5",
     "types": [

Kyoo/ClientApp/karma.conf.js

@@ -4,30 +4,29 @@
 module.exports = function (config) {
   config.set({
     basePath: '',
-    frameworks: ['jasmine', '@angular/cli'],
+    frameworks: ['jasmine', '@angular-devkit/build-angular'],
     plugins: [
       require('karma-jasmine'),
       require('karma-chrome-launcher'),
       require('karma-jasmine-html-reporter'),
       require('karma-coverage-istanbul-reporter'),
-      require('@angular/cli/plugins/karma')
+      require('@angular-devkit/build-angular/plugins/karma')
     ],
-    client:{
+    client: {
       clearContext: false // leave Jasmine Spec Runner output visible in browser
     },
     coverageIstanbulReporter: {
-      reports: [ 'html', 'lcovonly' ],
+      dir: require('path').join(__dirname, './coverage/Kyoo'),
+      reports: ['html', 'lcovonly', 'text-summary'],
       fixWebpackSourcePaths: true
     },
-    angularCli: {
-      environment: 'dev'
-    },
     reporters: ['progress', 'kjhtml'],
     port: 9876,
     colors: true,
     logLevel: config.LOG_INFO,
     autoWatch: true,
     browsers: ['Chrome'],
-    singleRun: false
+    singleRun: false,
+    restartOnFileChange: true
   });
 };

Kyoo/ClientApp/package.json

@@ -1,56 +1,47 @@
 {
-  "name": "Kyoo",
+  "name": "kyoo",
   "version": "0.0.0",
-  "license": "MIT",
   "scripts": {
     "ng": "ng",
-    "start": "ng serve --extract-css",
+    "start": "ng serve",
-    "build": "ng build --extract-css",
+    "build": "ng build",
-    "build:ssr": "npm run build -- --app=ssr --output-hashing=media",
     "test": "ng test",
     "lint": "ng lint",
     "e2e": "ng e2e"
   },
   "private": true,
   "dependencies": {
-    "@angular/animations": "^5.2.0",
+    "@angular/animations": "~8.2.0",
-    "@angular/common": "^5.2.0",
+    "@angular/common": "~8.2.0",
-    "@angular/compiler": "^5.2.0",
+    "@angular/compiler": "~8.2.0",
-    "@angular/core": "^5.2.0",
+    "@angular/core": "~8.2.0",
-    "@angular/forms": "^5.2.0",
+    "@angular/forms": "~8.2.0",
-    "@angular/http": "^5.2.0",
+    "@angular/platform-browser": "~8.2.0",
-    "@angular/platform-browser": "^5.2.0",
+    "@angular/platform-browser-dynamic": "~8.2.0",
-    "@angular/platform-browser-dynamic": "^5.2.0",
+    "@angular/router": "~8.2.0",
-    "@angular/platform-server": "^5.2.0",
+    "rxjs": "~6.4.0",
-    "@angular/router": "^5.2.0",
+    "tslib": "^1.10.0",
-    "@nguniversal/module-map-ngfactory-loader": "^5.0.0-beta.5",
+    "zone.js": "~0.9.1"
-    "aspnet-prerendering": "^3.0.1",
-    "bootstrap": "^3.4.1",
-    "core-js": "^2.4.1",
-    "rxjs": "^5.5.6",
-    "zone.js": "^0.8.19"
   },
   "devDependencies": {
-    "@angular/cli": "~1.7.0",
+    "@angular-devkit/build-angular": "~0.802.1",
-    "@angular/compiler-cli": "^5.2.0",
+    "@angular/cli": "~8.2.1",
-    "@angular/language-service": "^5.2.0",
+    "@angular/compiler-cli": "~8.2.0",
-    "@types/jasmine": "~2.8.3",
+    "@angular/language-service": "~8.2.0",
-    "@types/jasminewd2": "~2.0.2",
+    "@types/node": "~8.9.4",
-    "@types/node": "~6.0.60",
+    "@types/jasmine": "~3.3.8",
-    "codelyzer": "^4.0.1",
+    "@types/jasminewd2": "~2.0.3",
-    "jasmine-core": "~2.8.0",
+    "codelyzer": "^5.0.0",
+    "jasmine-core": "~3.4.0",
     "jasmine-spec-reporter": "~4.2.1",
-    "karma": "~2.0.0",
+    "karma": "~4.1.0",
     "karma-chrome-launcher": "~2.2.0",
-    "karma-coverage-istanbul-reporter": "^1.2.1",
+    "karma-coverage-istanbul-reporter": "~2.0.1",
-    "karma-jasmine": "~1.1.0",
+    "karma-jasmine": "~2.0.1",
-    "karma-jasmine-html-reporter": "^0.2.2",
+    "karma-jasmine-html-reporter": "^1.4.0",
-    "protractor": "~5.1.2",
+    "protractor": "~5.4.0",
-    "ts-node": "~4.1.0",
+    "ts-node": "~7.0.0",
-    "tslint": "~5.9.1",
+    "tslint": "~5.15.0",
-    "typescript": "~2.5.3"
+    "typescript": "~3.5.3"
-  },
-  "optionalDependencies": {
-    "node-sass": "^4.9.0"
   }
 }

Kyoo/ClientApp/src/app/app-routing.module.ts

@@ -0,0 +1,11 @@
+import { NgModule } from '@angular/core';
+import { Routes, RouterModule } from '@angular/router';
+
+
+const routes: Routes = [];
+
+@NgModule({
+  imports: [RouterModule.forRoot(routes)],
+  exports: [RouterModule]
+})
+export class AppRoutingModule { }

Kyoo/ClientApp/src/app/app.component.css

@@ -1,6 +0,0 @@
-@media (max-width: 767px) {
-  /* On small screens, the nav menu spans the full width of the screen. Leave a space for it. */
-  .body-content {
-    padding-top: 50px;
-  }
-}

Kyoo/ClientApp/src/app/app.component.html

@@ -1,8 +1,18 @@
-<nav class="navbar navbar-expand-lg navbar-dark bg-dark">
+<nav class="navbar fixed-top navbar-dark bg-dark flex-column flex-md-row bd-navbar">
-  <a class="navbar-brand" href="#">
+  <a class="navbar-brand" routerLink="/">
-    <img src="/docs/4.3/assets/brand/bootstrap-solid.svg" width="30" height="30" alt="">
+    Kyoo
   </a>
+
+  <ul class="navbar-nav">
+    <li class="nav-item">
+      <a class="nav-link" routerLink="/browse" routerLinkActive="active">All</a>
+    </li>
+    <li class="nav-item" *ngFor="let library of this.libraries">
+      <a class="nav-link" routerLink="/browse/{{library.slug}}" routerLinkActive="active">{{library.name}}</a>
+    </li>
+  </ul>
 </nav>
 
-
+<main>
-<router-outlet></router-outlet>
+  <router-outlet></router-outlet>
+</main>

Kyoo/ClientApp/src/app/app.component.ts

@@ -1,10 +1,27 @@
-import { Component } from '@angular/core';
+import { Component, Inject } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
 
 @Component({
   selector: 'app-root',
   templateUrl: './app.component.html',
-  styleUrls: ['./app.component.css']
+  styleUrls: ['./app.component.sass']
 })
-export class AppComponent {
+export class AppComponent
-  title = 'app';
+{
+  libraries: Library[];
+
+  constructor(http: HttpClient)
+  {
+    http.get<Library[]>("api/libraries").subscribe(result =>
+    {
+      this.libraries = result;
+    }, error => console.error(error));
+  }
+}
+
+interface Library
+{
+  id: number;
+  slug: string;
+  name: string;
 }

Kyoo/ClientApp/src/app/app.module.ts

@@ -1,30 +1,18 @@
 import { BrowserModule } from '@angular/platform-browser';
-import { NgModule } from '@angular/core';
-import { FormsModule } from '@angular/forms';
 import { HttpClientModule } from '@angular/common/http';
-import { RouterModule } from '@angular/router';
+import { NgModule } from '@angular/core';
 
+import { AppRoutingModule } from './app-routing.module';
 import { AppComponent } from './app.component';
-import { HomeComponent } from './home/home.component';
-import { CounterComponent } from './counter/counter.component';
-import { FetchDataComponent } from './fetch-data/fetch-data.component';
 
 @NgModule({
   declarations: [
-    AppComponent,
+    AppComponent
-    HomeComponent,
-    CounterComponent,
-    FetchDataComponent
   ],
   imports: [
-    BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }),
+    BrowserModule,
     HttpClientModule,
-    FormsModule,
+    AppRoutingModule
-    RouterModule.forRoot([
-      { path: '', component: HomeComponent, pathMatch: 'full' },
-      { path: 'counter', component: CounterComponent },
-      { path: 'fetch-data', component: FetchDataComponent },
-    ])
   ],
   providers: [],
   bootstrap: [AppComponent]

Kyoo/ClientApp/src/app/counter/counter.component.html

@@ -1,7 +0,0 @@
-<h1>Counter</h1>
-
-<p>This is a simple example of an Angular component.</p>
-
-<p>Current count: <strong>{{ currentCount }}</strong></p>
-
-<button (click)="incrementCounter()">Increment</button>

Kyoo/ClientApp/src/app/counter/counter.component.spec.ts

@@ -1,36 +0,0 @@
-import { async, ComponentFixture, TestBed } from '@angular/core/testing';
-
-import { CounterComponent } from './counter.component';
-
-describe('CounterComponent', () => {
-  let component: CounterComponent;
-  let fixture: ComponentFixture<CounterComponent>;
-
-  beforeEach(async(() => {
-    TestBed.configureTestingModule({
-      declarations: [ CounterComponent ]
-    })
-    .compileComponents();
-  }));
-
-  beforeEach(() => {
-    fixture = TestBed.createComponent(CounterComponent);
-    component = fixture.componentInstance;
-    fixture.detectChanges();
-  });
-
-  it('should display a title', async(() => {
-    const titleText = fixture.nativeElement.querySelector('h1').textContent;
-    expect(titleText).toEqual('Counter');
-  }));
-
-  it('should start with count 0, then increments by 1 when clicked', async(() => {
-    const countElement = fixture.nativeElement.querySelector('strong');
-    expect(countElement.textContent).toEqual('0');
-
-    const incrementButton = fixture.nativeElement.querySelector('button');
-    incrementButton.click();
-    fixture.detectChanges();
-    expect(countElement.textContent).toEqual('1');
-  }));
-});

Kyoo/ClientApp/src/app/counter/counter.component.ts

@@ -1,13 +0,0 @@
-import { Component } from '@angular/core';
-
-@Component({
-  selector: 'app-counter-component',
-  templateUrl: './counter.component.html'
-})
-export class CounterComponent {
-  public currentCount = 0;
-
-  public incrementCounter() {
-    this.currentCount++;
-  }
-}

Kyoo/ClientApp/src/environments/environment.ts

@@ -1,8 +1,16 @@
-// The file contents for the current environment will overwrite these during build.
+// This file can be replaced during build by using the `fileReplacements` array.
-// The build system defaults to the dev environment which uses `environment.ts`, but if you do
+// `ng build --prod` replaces `environment.ts` with `environment.prod.ts`.
-// `ng build --env=prod` then `environment.prod.ts` will be used instead.
+// The list of file replacements can be found in `angular.json`.
-// The list of which env maps to which file can be found in `.angular-cli.json`.
 
 export const environment = {
   production: false
 };
+
+/*
+ * For easier debugging in development mode, you can import the following file
+ * to ignore zone related error stack frames such as `zone.run`, `zoneDelegate.invokeTask`.
+ *
+ * This import should be commented out in production mode because it will have a negative impact
+ * on performance if an error is thrown.
+ */
+// import 'zone.js/dist/zone-error';  // Included with Angular CLI.

Kyoo/ClientApp/src/index.html

@@ -1,14 +1,14 @@
 <!doctype html>
 <html lang="en">
-<head>
+  <head>
-  <meta charset="utf-8">
+    <meta charset="utf-8">
-  <title>Kyoo</title>
+    <title>Kyoo</title>
-  <base href="/">
+    <base href="/">
 
-  <meta name="viewport" content="width=device-width, initial-scale=1">
+    <meta name="viewport" content="width=device-width, initial-scale=1">
-  <link rel="icon" type="image/x-icon" href="favicon.ico">
+    <link rel="icon" type="image/x-icon" href="favicon.ico">
-</head>
+  </head>
-<body>
+  <body>
-  <app-root>Loading...</app-root>
+    <app-root></app-root>
-</body>
+  </body>
 </html>

Kyoo/ClientApp/src/main.ts

@@ -4,17 +4,9 @@ import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
 import { AppModule } from './app/app.module';
 import { environment } from './environments/environment';
 
-export function getBaseUrl() {
-  return document.getElementsByTagName('base')[0].href;
-}
-
-const providers = [
-  { provide: 'BASE_URL', useFactory: getBaseUrl, deps: [] }
-];
-
 if (environment.production) {
   enableProdMode();
 }
 
-platformBrowserDynamic(providers).bootstrapModule(AppModule)
+platformBrowserDynamic().bootstrapModule(AppModule)
-  .catch(err => console.log(err));
+  .catch(err => console.error(err));

Kyoo/ClientApp/src/polyfills.ts

@@ -11,69 +11,53 @@
  * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
  * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
  *
- * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
+ * Learn more in https://angular.io/guide/browser-support
  */
 
 /***************************************************************************************************
  * BROWSER POLYFILLS
  */
 
-/** IE9, IE10 and IE11 requires all of the following polyfills. **/
-// import 'core-js/es6/symbol';
-// import 'core-js/es6/object';
-// import 'core-js/es6/function';
-// import 'core-js/es6/parse-int';
-// import 'core-js/es6/parse-float';
-// import 'core-js/es6/number';
-// import 'core-js/es6/math';
-// import 'core-js/es6/string';
-// import 'core-js/es6/date';
-// import 'core-js/es6/array';
-// import 'core-js/es6/regexp';
-// import 'core-js/es6/map';
-// import 'core-js/es6/weak-map';
-// import 'core-js/es6/set';
-
 /** IE10 and IE11 requires the following for NgClass support on SVG elements */
 // import 'classlist.js';  // Run `npm install --save classlist.js`.
 
-/** IE10 and IE11 requires the following for the Reflect API. */
-// import 'core-js/es6/reflect';
-
-
-/** Evergreen browsers require these. **/
-// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
-import 'core-js/es7/reflect';
-
-
 /**
- * Required to support Web Animations `@angular/platform-browser/animations`.
+ * Web Animations `@angular/platform-browser/animations`
- * Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation
+ * Only required if AnimationBuilder is used within the application and using IE/Edge or Safari.
- **/
+ * Standard animation support in Angular DOES NOT require any polyfills (as of Angular 6.0).
+ */
 // import 'web-animations-js';  // Run `npm install --save web-animations-js`.
 
 /**
  * By default, zone.js will patch all possible macroTask and DomEvents
  * user can disable parts of macroTask/DomEvents patch by setting following flags
+ * because those flags need to be set before `zone.js` being loaded, and webpack
+ * will put import in the top of bundle, so user need to create a separate file
+ * in this directory (for example: zone-flags.ts), and put the following flags
+ * into that file, and then add the following code before importing zone.js.
+ * import './zone-flags.ts';
+ *
+ * The flags allowed in zone-flags.ts are listed here.
+ *
+ * The following flags will work for all browsers.
+ *
+ * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
+ * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
+ * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
+ *
+ *  in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
+ *  with the following flag, it will bypass `zone.js` patch for IE/Edge
+ *
+ *  (window as any).__Zone_enable_cross_context_check = true;
+ *
  */
 
- // (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
- // (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
- // (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
-
- /*
- * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
- * with the following flag, it will bypass `zone.js` patch for IE/Edge
- */
-// (window as any).__Zone_enable_cross_context_check = true;
-
 /***************************************************************************************************
  * Zone JS is required by default for Angular itself.
  */
 import 'zone.js/dist/zone';  // Included with Angular CLI.
 
 
-
 /***************************************************************************************************
  * APPLICATION IMPORTS
  */

Kyoo/ClientApp/tsconfig.app.json

@@ -0,0 +1,18 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/app",
+    "types": []
+  },
+  "files": [
+    "src/main.ts",
+    "src/polyfills.ts"
+  ],
+  "include": [
+    "src/**/*.ts"
+  ],
+  "exclude": [
+    "src/test.ts",
+    "src/**/*.spec.ts"
+  ]
+}

Kyoo/ClientApp/tsconfig.json

@@ -1,19 +1,26 @@
 {
   "compileOnSave": false,
   "compilerOptions": {
+    "baseUrl": "./",
     "outDir": "./dist/out-tsc",
     "sourceMap": true,
     "declaration": false,
-    "moduleResolution": "node",
+    "downlevelIteration": true,
-    "emitDecoratorMetadata": true,
     "experimentalDecorators": true,
-    "target": "es5",
+    "module": "esnext",
+    "moduleResolution": "node",
+    "importHelpers": true,
+    "target": "es2015",
     "typeRoots": [
       "node_modules/@types"
     ],
     "lib": [
-      "es2017",
+      "es2018",
       "dom"
     ]
+  },
+  "angularCompilerOptions": {
+    "fullTemplateTypeCheck": true,
+    "strictInjectionParameters": true
   }
 }

Kyoo/ClientApp/tsconfig.spec.json

@@ -0,0 +1,18 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "outDir": "./out-tsc/spec",
+    "types": [
+      "jasmine",
+      "node"
+    ]
+  },
+  "files": [
+    "src/test.ts",
+    "src/polyfills.ts"
+  ],
+  "include": [
+    "src/**/*.spec.ts",
+    "src/**/*.d.ts"
+  ]
+}

Kyoo/ClientApp/tslint.json

@@ -1,33 +1,32 @@
 {
-  "rulesDirectory": [
+  "extends": "tslint:recommended",
-    "node_modules/codelyzer"
-  ],
   "rules": {
-    "arrow-return-shorthand": true,
+    "array-type": false,
-    "callable-types": true,
+    "arrow-parens": false,
-    "class-name": true,
-    "comment-format": [
-      true,
-      "check-space"
-    ],
-    "curly": true,
     "deprecation": {
-      "severity": "warn"
+      "severity": "warning"
     },
-    "eofline": true,
+    "component-class-suffix": true,
-    "forin": true,
+    "contextual-lifecycle": true,
+    "directive-class-suffix": true,
+    "directive-selector": [
+      true,
+      "attribute",
+      "app",
+      "camelCase"
+    ],
+    "component-selector": [
+      true,
+      "element",
+      "app",
+      "kebab-case"
+    ],
     "import-blacklist": [
       true,
-      "rxjs",
       "rxjs/Rx"
     ],
-    "import-spacing": true,
+    "interface-name": false,
-    "indent": [
+    "max-classes-per-file": false,
-      true,
-      "spaces"
-    ],
-    "interface-over-type-literal": true,
-    "label-position": true,
     "max-line-length": [
       true,
       140
@@ -44,8 +43,7 @@
         ]
       }
     ],
-    "no-arg": true,
+    "no-consecutive-blank-lines": false,
-    "no-bitwise": true,
     "no-console": [
       true,
       "debug",
@@ -54,90 +52,41 @@
       "timeEnd",
       "trace"
     ],
-    "no-construct": true,
-    "no-debugger": true,
-    "no-duplicate-super": true,
     "no-empty": false,
-    "no-empty-interface": true,
-    "no-eval": true,
     "no-inferrable-types": [
       true,
       "ignore-params"
     ],
-    "no-misused-new": true,
     "no-non-null-assertion": true,
-    "no-shadowed-variable": true,
+    "no-redundant-jsdoc": true,
-    "no-string-literal": false,
-    "no-string-throw": true,
     "no-switch-case-fall-through": true,
-    "no-trailing-whitespace": true,
-    "no-unnecessary-initializer": true,
-    "no-unused-expression": true,
     "no-use-before-declare": true,
-    "no-var-keyword": true,
+    "no-var-requires": false,
-    "object-literal-sort-keys": false,
+    "object-literal-key-quotes": [
-    "one-line": [
       true,
-      "check-open-brace",
+      "as-needed"
-      "check-catch",
-      "check-else",
-      "check-whitespace"
     ],
-    "prefer-const": true,
+    "object-literal-sort-keys": false,
+    "ordered-imports": false,
     "quotemark": [
       true,
       "single"
     ],
-    "radix": true,
+    "trailing-comma": false,
-    "semicolon": [
+    "no-conflicting-lifecycle": true,
-      true,
+    "no-host-metadata-property": true,
-      "always"
-    ],
-    "triple-equals": [
-      true,
-      "allow-null-check"
-    ],
-    "typedef-whitespace": [
-      true,
-      {
-        "call-signature": "nospace",
-        "index-signature": "nospace",
-        "parameter": "nospace",
-        "property-declaration": "nospace",
-        "variable-declaration": "nospace"
-      }
-    ],
-    "unified-signatures": true,
-    "variable-name": false,
-    "whitespace": [
-      true,
-      "check-branch",
-      "check-decl",
-      "check-operator",
-      "check-separator",
-      "check-type"
-    ],
-    "directive-selector": [
-      true,
-      "attribute",
-      "app",
-      "camelCase"
-    ],
-    "component-selector": [
-      true,
-      "element",
-      "app",
-      "kebab-case"
-    ],
-    "no-output-on-prefix": true,
-    "use-input-property-decorator": true,
-    "use-output-property-decorator": true,
-    "use-host-property-decorator": true,
     "no-input-rename": true,
+    "no-inputs-metadata-property": true,
+    "no-output-native": true,
+    "no-output-on-prefix": true,
     "no-output-rename": true,
-    "use-life-cycle-interface": true,
+    "no-outputs-metadata-property": true,
-    "use-pipe-transform-interface": true,
+    "template-banana-in-box": true,
-    "component-class-suffix": true,
+    "template-no-negated-async": true,
-    "directive-class-suffix": true
+    "use-lifecycle-interface": true,
-  }
+    "use-pipe-transform-interface": true
-}
+  },
+  "rulesDirectory": [
+    "codelyzer"
+  ]
+}

Kyoo/ClientAppBugged/.angular-cli.json

@@ -21,7 +21,9 @@
         "styles.css",
         "../node_modules/bootstrap/dist/css/bootstrap.min.css"
       ],
-      "scripts": [],
+      "scripts": [
+        "../node_modules/bootstrap/dist/js/bootstrap.min.js"
+      ],
       "environmentSource": "environments/environment.ts",
       "environments": {
         "dev": "environments/environment.ts",

Kyoo/ClientAppBugged/.editorconfig

@@ -0,0 +1,13 @@
+# Editor configuration, see http://editorconfig.org
+root = true
+
+[*]
+charset = utf-8
+indent_style = space
+indent_size = 4
+insert_final_newline = true
+trim_trailing_whitespace = true
+
+[*.md]
+max_line_length = off
+trim_trailing_whitespace = false

Kyoo/ClientAppBugged/.gitignore

@@ -0,0 +1,43 @@
+# See http://help.github.com/ignore-files/ for more about ignoring files.
+
+# compiled output
+/dist
+/dist-server
+/tmp
+/out-tsc
+
+# dependencies
+/node_modules
+
+# IDEs and editors
+/.idea
+.project
+.classpath
+.c9/
+*.launch
+.settings/
+*.sublime-workspace
+
+# IDE - VSCode
+.vscode/*
+!.vscode/settings.json
+!.vscode/tasks.json
+!.vscode/launch.json
+!.vscode/extensions.json
+
+# misc
+/.sass-cache
+/connect.lock
+/coverage
+/libpeerconnection.log
+npm-debug.log
+testem.log
+/typings
+
+# e2e
+/e2e/*.js
+/e2e/*.map
+
+# System Files
+.DS_Store
+Thumbs.db

Kyoo/ClientAppBugged/README.md

@@ -0,0 +1,27 @@
+# AngularSpa
+
+This project was generated with [Angular CLI](https://github.com/angular/angular-cli) version 1.7.0.
+
+## 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 README](https://github.com/angular/angular-cli/blob/master/README.md).

Kyoo/ClientAppBugged/package.json

@@ -0,0 +1,47 @@
+{
+  "name": "Kyoo",
+  "version": "0.0.0",
+  "license": "MIT",
+  "scripts": {
+    "ng": "ng",
+    "start": "ng serve --extract-css",
+    "build": "ng build --extract-css",
+    "build:ssr": "npm run build -- --app=ssr --output-hashing=media",
+    "test": "ng test",
+    "lint": "ng lint",
+    "e2e": "ng e2e"
+  },
+  "private": true,
+  "dependencies": {
+    "@angular/animations": "^8.2.1",
+    "@angular/common": "^8.2.1",
+    "@angular/compiler": "^8.2.1",
+    "@angular/core": "^8.2.1",
+    "@angular/forms": "^8.2.1",
+    "@angular/platform-browser": "^8.2.1",
+    "@angular/platform-browser-dynamic": "^8.2.1",
+    "@angular/platform-server": "^8.2.1",
+    "@angular/router": "^8.2.1",
+    "@nguniversal/module-map-ngfactory-loader": "^8.1.1",
+    "aspnet-prerendering": "^3.0.1",
+    "bootstrap": "^4.3.1",
+    "core-js": "^3.2.0",
+    "jquery": "^3.4.1",
+    "popper.js": "^1.15.0",
+    "rxjs": "^6.5.2",
+    "zone.js": "^0.9.1"
+  },
+  "devDependencies": {
+    "@angular/cli": "^8.2.1",
+    "@angular/compiler-cli": "^8.2.1",
+    "@angular/language-service": "^8.2.1",
+    "@types/node": "~12.7.1",
+    "codelyzer": "^5.1.0",
+    "ts-node": "~8.3.0",
+    "tslint": "~5.18.0",
+    "typescript": "~3.5.3"
+  },
+  "optionalDependencies": {
+    "node-sass": "^4.12.0"
+  }
+}

Kyoo/ClientAppBugged/src/app/app.component.css

@@ -0,0 +1,15 @@
+.navbar
+{
+  background-color: rgba(0, 0, 0, 0.8);
+  border-radius: 0;
+}
+
+.navbar-brand
+{
+  color: #ffffff;
+}
+
+.navbar-nav
+{
+  margin: 0;
+}

Kyoo/ClientAppBugged/src/app/app.component.html

@@ -0,0 +1,18 @@
+<nav class="navbar fixed-top navbar-dark bg-dark flex-column flex-md-row bd-navbar">
+  <a class="navbar-brand" routerLink="/">
+    Kyoo
+  </a>
+
+  <ul class="navbar-nav">
+    <li class="nav-item">
+      <a class="nav-link" routerLink="/browse" routerLinkActive="active">All</a>
+    </li>
+    <li class="nav-item" *ngFor="let library of this.libraries">
+      <a class="nav-link" routerLink="/browse/{{library.slug}}" routerLinkActive="active">{{library.name}}</a>
+    </li>
+  </ul>
+</nav>
+
+<main>
+  <router-outlet></router-outlet>
+</main>

Kyoo/ClientAppBugged/src/app/app.component.ts

@@ -0,0 +1,27 @@
+import { Component, Inject } from '@angular/core';
+import { HttpClient } from '@angular/common/http';
+
+@Component({
+  selector: 'app-root',
+  templateUrl: './app.component.html',
+  styleUrls: ['./app.component.css']
+})
+export class AppComponent
+{
+  libraries: Library[];
+
+  constructor(http: HttpClient, @Inject('BASE_URL') baseUrl: string)
+  {
+    http.get<Library[]>(baseUrl + 'api/libraries').subscribe(result =>
+    {
+      this.libraries = result;
+    }, error => console.error(error));
+  }
+}
+
+interface Library
+{
+  id: number;
+  slug: string;
+  name: string;
+}

Kyoo/ClientAppBugged/src/app/app.module.ts

@@ -0,0 +1,32 @@
+import { BrowserModule } from '@angular/platform-browser';
+import { NgModule } from '@angular/core';
+import { FormsModule } from '@angular/forms';
+import { HttpClientModule } from '@angular/common/http';
+import { RouterModule } from '@angular/router';
+
+import { AppComponent } from './app.component';
+import { HomeComponent } from './home/home.component';
+import { NotFoundComponent } from './not-found/not-found.component';
+import { FetchDataComponent } from './fetch-data/fetch-data.component';
+
+@NgModule({
+  declarations: [
+    AppComponent,
+    HomeComponent,
+    NotFoundComponent,
+    FetchDataComponent
+  ],
+  imports: [
+    BrowserModule.withServerTransition({ appId: 'ng-cli-universal' }),
+    HttpClientModule,
+    FormsModule,
+    RouterModule.forRoot([
+      { path: '', component: HomeComponent, pathMatch: 'full' },
+      { path: 'fetch-data', component: FetchDataComponent },
+      { path: '**', component: NotFoundComponent }
+    ])
+  ],
+  providers: [],
+  bootstrap: [AppComponent]
+})
+export class AppModule { }

Kyoo/ClientAppBugged/src/app/home/home.component.html

@@ -12,3 +12,118 @@
   <li><strong>Efficient production builds</strong>. In production mode, development-time features are disabled, and your <code>dotnet publish</code> configuration automatically invokes <code>ng build</code> to produce minified, ahead-of-time compiled JavaScript files.</li>
 </ul>
 <p>The <code>ClientApp</code> subdirectory is a standard Angular CLI application. If you open a command prompt in that directory, you can run any <code>ng</code> command (e.g., <code>ng test</code>), or use <code>npm</code> to install extra packages into it.</p>
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+<br />
+"Test"

Kyoo/ClientAppBugged/src/app/not-found/not-found.component.html

@@ -0,0 +1,3 @@
+<h1>404, NOT FOUND</h1>
+
+<p>Oops, you end up on a wrong page.</p>

Kyoo/ClientAppBugged/src/app/not-found/not-found.component.ts

@@ -0,0 +1,8 @@
+import { Component } from '@angular/core';
+
+@Component({
+  selector: 'not-found-component',
+  templateUrl: './not-found.component.html'
+})
+export class NotFoundComponent{
+}

Kyoo/ClientAppBugged/src/environments/environment.prod.ts

@@ -0,0 +1,3 @@
+export const environment = {
+  production: true
+};

Kyoo/ClientAppBugged/src/environments/environment.ts

@@ -0,0 +1,8 @@
+// The file contents for the current environment will overwrite these during build.
+// The build system defaults to the dev environment which uses `environment.ts`, but if you do
+// `ng build --env=prod` then `environment.prod.ts` will be used instead.
+// The list of which env maps to which file can be found in `.angular-cli.json`.
+
+export const environment = {
+  production: false
+};

Kyoo/ClientAppBugged/src/index.html

@@ -0,0 +1,14 @@
+<!doctype html>
+<html lang="en">
+<head>
+  <meta charset="utf-8">
+  <title>Kyoo</title>
+  <base href="/">
+
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="icon" type="image/x-icon" href="favicon.ico">
+</head>
+<body>
+  <app-root>Loading...</app-root>
+</body>
+</html>

Kyoo/ClientAppBugged/src/main.ts

@@ -0,0 +1,20 @@
+import { enableProdMode } from '@angular/core';
+import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
+
+import { AppModule } from './app/app.module';
+import { environment } from './environments/environment';
+
+export function getBaseUrl() {
+  return document.getElementsByTagName('base')[0].href;
+}
+
+const providers = [
+  { provide: 'BASE_URL', useFactory: getBaseUrl, deps: [] }
+];
+
+if (environment.production) {
+  enableProdMode();
+}
+
+platformBrowserDynamic(providers).bootstrapModule(AppModule)
+  .catch(err => console.log(err));

Kyoo/ClientAppBugged/src/polyfills.ts

@@ -0,0 +1,79 @@
+/**
+ * This file includes polyfills needed by Angular and is loaded before the app.
+ * You can add your own extra polyfills to this file.
+ *
+ * This file is divided into 2 sections:
+ *   1. Browser polyfills. These are applied before loading ZoneJS and are sorted by browsers.
+ *   2. Application imports. Files imported after ZoneJS that should be loaded before your main
+ *      file.
+ *
+ * The current setup is for so-called "evergreen" browsers; the last versions of browsers that
+ * automatically update themselves. This includes Safari >= 10, Chrome >= 55 (including Opera),
+ * Edge >= 13 on the desktop, and iOS 10 and Chrome on mobile.
+ *
+ * Learn more in https://angular.io/docs/ts/latest/guide/browser-support.html
+ */
+
+/***************************************************************************************************
+ * BROWSER POLYFILLS
+ */
+
+/** IE9, IE10 and IE11 requires all of the following polyfills. **/
+// import 'core-js/es6/symbol';
+// import 'core-js/es6/object';
+// import 'core-js/es6/function';
+// import 'core-js/es6/parse-int';
+// import 'core-js/es6/parse-float';
+// import 'core-js/es6/number';
+// import 'core-js/es6/math';
+// import 'core-js/es6/string';
+// import 'core-js/es6/date';
+// import 'core-js/es6/array';
+// import 'core-js/es6/regexp';
+// import 'core-js/es6/map';
+// import 'core-js/es6/weak-map';
+// import 'core-js/es6/set';
+
+/** IE10 and IE11 requires the following for NgClass support on SVG elements */
+// import 'classlist.js';  // Run `npm install --save classlist.js`.
+
+/** IE10 and IE11 requires the following for the Reflect API. */
+// import 'core-js/es6/reflect';
+
+
+/** Evergreen browsers require these. **/
+// Used for reflect-metadata in JIT. If you use AOT (and only Angular decorators), you can remove.
+import 'core-js/es7/reflect';
+
+
+/**
+ * Required to support Web Animations `@angular/platform-browser/animations`.
+ * Needed for: All but Chrome, Firefox and Opera. http://caniuse.com/#feat=web-animation
+ **/
+// import 'web-animations-js';  // Run `npm install --save web-animations-js`.
+
+/**
+ * By default, zone.js will patch all possible macroTask and DomEvents
+ * user can disable parts of macroTask/DomEvents patch by setting following flags
+ */
+
+ // (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
+ // (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
+ // (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
+
+ /*
+ * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
+ * with the following flag, it will bypass `zone.js` patch for IE/Edge
+ */
+// (window as any).__Zone_enable_cross_context_check = true;
+
+/***************************************************************************************************
+ * Zone JS is required by default for Angular itself.
+ */
+import 'zone.js/dist/zone';  // Included with Angular CLI.
+
+
+
+/***************************************************************************************************
+ * APPLICATION IMPORTS
+ */

Kyoo/ClientAppBugged/src/styles.css

@@ -0,0 +1 @@
+/* You can add global styles to this file, and also import other style files */

Kyoo/ClientAppBugged/src/test.ts

@@ -0,0 +1,20 @@
+// This file is required by karma.conf.js and loads recursively all the .spec and framework files
+
+import 'zone.js/dist/zone-testing';
+import { getTestBed } from '@angular/core/testing';
+import {
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting
+} from '@angular/platform-browser-dynamic/testing';
+
+declare const require: any;
+
+// First, initialize the Angular testing environment.
+getTestBed().initTestEnvironment(
+  BrowserDynamicTestingModule,
+  platformBrowserDynamicTesting()
+);
+// Then we find all the tests.
+const context = require.context('./', true, /\.spec\.ts$/);
+// And load the modules.
+context.keys().map(context);

Kyoo/ClientAppBugged/tsconfig.json

@@ -0,0 +1,19 @@
+{
+  "compileOnSave": false,
+  "compilerOptions": {
+    "outDir": "./dist/out-tsc",
+    "sourceMap": true,
+    "declaration": false,
+    "moduleResolution": "node",
+    "emitDecoratorMetadata": true,
+    "experimentalDecorators": true,
+    "target": "es5",
+    "typeRoots": [
+      "node_modules/@types"
+    ],
+    "lib": [
+      "es2017",
+      "dom"
+    ]
+  }
+}

Kyoo/ClientAppBugged/tslint.json

@@ -0,0 +1,143 @@
+{
+  "rulesDirectory": [
+    "node_modules/codelyzer"
+  ],
+  "rules": {
+    "arrow-return-shorthand": true,
+    "callable-types": true,
+    "class-name": true,
+    "comment-format": [
+      true,
+      "check-space"
+    ],
+    "curly": true,
+    "deprecation": {
+      "severity": "warn"
+    },
+    "eofline": true,
+    "forin": true,
+    "import-blacklist": [
+      true,
+      "rxjs",
+      "rxjs/Rx"
+    ],
+    "import-spacing": true,
+    "indent": [
+      true,
+      "spaces"
+    ],
+    "interface-over-type-literal": true,
+    "label-position": true,
+    "max-line-length": [
+      true,
+      140
+    ],
+    "member-access": false,
+    "member-ordering": [
+      true,
+      {
+        "order": [
+          "static-field",
+          "instance-field",
+          "static-method",
+          "instance-method"
+        ]
+      }
+    ],
+    "no-arg": true,
+    "no-bitwise": true,
+    "no-console": [
+      true,
+      "debug",
+      "info",
+      "time",
+      "timeEnd",
+      "trace"
+    ],
+    "no-construct": true,
+    "no-debugger": true,
+    "no-duplicate-super": true,
+    "no-empty": false,
+    "no-empty-interface": true,
+    "no-eval": true,
+    "no-inferrable-types": [
+      true,
+      "ignore-params"
+    ],
+    "no-misused-new": true,
+    "no-non-null-assertion": true,
+    "no-shadowed-variable": true,
+    "no-string-literal": false,
+    "no-string-throw": true,
+    "no-switch-case-fall-through": true,
+    "no-trailing-whitespace": true,
+    "no-unnecessary-initializer": true,
+    "no-unused-expression": true,
+    "no-use-before-declare": true,
+    "no-var-keyword": true,
+    "object-literal-sort-keys": false,
+    "one-line": [
+      true,
+      "check-open-brace",
+      "check-catch",
+      "check-else",
+      "check-whitespace"
+    ],
+    "prefer-const": true,
+    "quotemark": [
+      true,
+      "single"
+    ],
+    "radix": true,
+    "semicolon": [
+      true,
+      "always"
+    ],
+    "triple-equals": [
+      true,
+      "allow-null-check"
+    ],
+    "typedef-whitespace": [
+      true,
+      {
+        "call-signature": "nospace",
+        "index-signature": "nospace",
+        "parameter": "nospace",
+        "property-declaration": "nospace",
+        "variable-declaration": "nospace"
+      }
+    ],
+    "unified-signatures": true,
+    "variable-name": false,
+    "whitespace": [
+      true,
+      "check-branch",
+      "check-decl",
+      "check-operator",
+      "check-separator",
+      "check-type"
+    ],
+    "directive-selector": [
+      true,
+      "attribute",
+      "app",
+      "camelCase"
+    ],
+    "component-selector": [
+      true,
+      "element",
+      "app",
+      "kebab-case"
+    ],
+    "no-output-on-prefix": true,
+    "use-input-property-decorator": true,
+    "use-output-property-decorator": true,
+    "use-host-property-decorator": true,
+    "no-input-rename": true,
+    "no-output-rename": true,
+    "use-life-cycle-interface": true,
+    "use-pipe-transform-interface": true,
+    "component-class-suffix": true,
+    "directive-class-suffix": true
+  }
+}

Kyoo/Controllers/BrowseController.cs

@@ -1,26 +0,0 @@
-using Kyoo.InternalAPI;
-using Kyoo.Models;
-using Microsoft.AspNetCore.Mvc;
-using System.Collections.Generic;
-using System.Diagnostics;
-
-namespace Kyoo.Controllers
-{
-    [ApiController]
-    public class BrowseController : ControllerBase
-    {
-        private readonly ILibraryManager libraryManager;
-
-        public BrowseController(ILibraryManager libraryManager)
-        {
-            Debug.WriteLine("&Browse controller init");
-            this.libraryManager = libraryManager;
-        }
-
-        [HttpGet("api/getall")]
-        public IEnumerable<Show> GetAll()
-        {
-            return libraryManager.QueryShows(null);
-        }
-    }
-}

Kyoo/Controllers/EpisodesController.cs

@@ -0,0 +1,19 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Threading.Tasks;
+using Microsoft.AspNetCore.Http;
+using Microsoft.AspNetCore.Mvc;
+
+namespace Kyoo.Controllers
+{
+    [Route("api/[controller]")]
+    [ApiController]
+    public class EpisodesController : ControllerBase
+    {
+        public string Index()
+        {
+            return "Episode Test";
+        }
+    }
+}

Kyoo/Controllers/LibrariesController.cs

@@ -0,0 +1,25 @@
+using Kyoo.InternalAPI;
+using Kyoo.Models;
+using Microsoft.AspNetCore.Mvc;
+using System.Collections.Generic;
+
+namespace Kyoo.Controllers
+{
+    [Route("api/libraries")]
+    [ApiController]
+    public class LibrariesController : ControllerBase
+    {
+        private readonly ILibraryManager libraryManager;
+
+        public LibrariesController(ILibraryManager libraryManager)
+        {
+            this.libraryManager = libraryManager;
+        }
+
+        [HttpGet]
+        public IEnumerable<Library> GetLibraries()
+        {
+            return libraryManager.GetLibraries();
+        }
+    }
+}

Kyoo/Controllers/ShowsController.cs

@@ -0,0 +1,37 @@
+using Kyoo.InternalAPI;
+using Kyoo.Models;
+using Microsoft.AspNetCore.Mvc;
+using System.Collections.Generic;
+using System.Diagnostics;
+
+namespace Kyoo.Controllers
+{
+    [Route("api/shows")]
+    [ApiController]
+    public class ShowsController : ControllerBase
+    {
+        private readonly ILibraryManager libraryManager;
+
+        public ShowsController(ILibraryManager libraryManager)
+        {
+            this.libraryManager = libraryManager;
+        }
+
+        [HttpGet]
+        public IEnumerable<Show> GetShows()
+        {
+            return libraryManager.QueryShows(null);
+        }
+
+        [HttpGet("{slug}")]
+        public ActionResult<Show> GetShow(string slug)
+        {
+            Show show = libraryManager.GetShowBySlug(slug);
+
+            if (show == null)
+                return NotFound();
+
+            return show;
+        }
+    }
+}

Kyoo/InternalAPI/Crawler/Crawler.cs

@@ -77,6 +77,7 @@ namespace Kyoo.InternalAPI
                     Episode episode = await metadataProvider.GetEpisode(showProviderIDs, seasonNumber, episodeNumber);
                     episode.ShowID = showID;
                     episode.SeasonID = seasonID;
+                    episode.Path = file;
                     libraryManager.RegisterEpisode(episode);
                 }
             }

Kyoo/InternalAPI/LibraryManager/ILibraryManager.cs

@@ -9,6 +9,10 @@ namespace Kyoo.InternalAPI
         string GetShowExternalIDs(long showID);
         IEnumerable<Show> QueryShows(string selection);
 
+        //Public read
+        IEnumerable<Library> GetLibraries();
+        Show GetShowBySlug(string slug);
+
         //Check if value exists
         bool IsShowRegistered(string showPath);
         bool IsShowRegistered(string showPath, out long showID);

Kyoo/InternalAPI/LibraryManager/LibraryManager.cs

@@ -164,16 +164,35 @@ namespace Kyoo.InternalAPI
         }
 
         #region Read the database
-        public string GetShowExternalIDs(long showID)
+        public IEnumerable<Library> GetLibraries()
         {
-            string query = string.Format("SELECT 1 FROM shows WHERE showID = {0};", showID);
+            string query = "SELECT * FROM libraries;";
 
             using (SQLiteCommand cmd = new SQLiteCommand(query, sqlConnection))
             {
                 SQLiteDataReader reader = cmd.ExecuteReader();
 
-                reader.Read();
+                List<Library> libraries = new List<Library>();
-                return Show.FromReader(reader).ExternalIDs;
+
+                while (reader.Read())
+                    libraries.Add(Library.FromReader(reader));
+
+                return libraries;
+            }
+        }
+
+        public string GetShowExternalIDs(long showID)
+        {
+            string query = string.Format("SELECT * FROM shows WHERE id = {0};", showID);
+
+            using (SQLiteCommand cmd = new SQLiteCommand(query, sqlConnection))
+            {
+                SQLiteDataReader reader = cmd.ExecuteReader();
+
+                if (reader.Read())
+                    return Show.FromReader(reader).ExternalIDs;
+                else
+                    return null;
             }
         }
 
@@ -194,6 +213,22 @@ namespace Kyoo.InternalAPI
                 return shows;
             }
         }
+
+        public Show GetShowBySlug(string slug)
+        {
+            string query = "SELECT * FROM shows WHERE slug = $slug;";
+
+            using (SQLiteCommand cmd = new SQLiteCommand(query, sqlConnection))
+            {
+                cmd.Parameters.AddWithValue("$slug", slug);
+                SQLiteDataReader reader = cmd.ExecuteReader();
+
+                if (reader.Read())
+                    return Show.FromReader(reader);
+                else
+                    return null;
+            }
+        }
         #endregion
 
         #region Check if items exists
@@ -305,12 +340,13 @@ namespace Kyoo.InternalAPI
 
         public long RegisterEpisode(Episode episode)
         {
-            string query = "INSERT INTO episodes (showID, seasonID, episodeNumber, title, overview, releaseDate, runtime, imgPrimary, externalIDs) VALUES($showID, $seasonID, $episodeNumber, $title, $overview, $releaseDate, $runtime, $imgPrimary, $externalIDs);";
+            string query = "INSERT INTO episodes (showID, seasonID, episodeNumber, path, title, overview, releaseDate, runtime, imgPrimary, externalIDs) VALUES($showID, $seasonID, $episodeNumber, $path, $title, $overview, $releaseDate, $runtime, $imgPrimary, $externalIDs);";
             using (SQLiteCommand cmd = new SQLiteCommand(query, sqlConnection))
             {
                 cmd.Parameters.AddWithValue("$showID", episode.ShowID);
                 cmd.Parameters.AddWithValue("seasonID", episode.SeasonID);
                 cmd.Parameters.AddWithValue("episodeNumber", episode.episodeNumber);
+                cmd.Parameters.AddWithValue("path", episode.Path);
                 cmd.Parameters.AddWithValue("$title", episode.Title);
                 cmd.Parameters.AddWithValue("$overview", episode.Overview);
                 cmd.Parameters.AddWithValue("$releaseDate", episode.ReleaseDate);

Kyoo/Kyoo.csproj

@@ -13,10 +13,12 @@
   </PropertyGroup>
 
   <ItemGroup>
+    <PackageReference Include="Microsoft.AspNet.WebApi.Core" Version="5.2.7" />
     <PackageReference Include="Microsoft.AspNetCore.App" />
     <PackageReference Include="Microsoft.AspNetCore.Razor.Design" Version="2.1.2" PrivateAssets="All" />
     <PackageReference Include="Microsoft.AspNetCore.SpaServices.Extensions" Version="2.1.1" />
     <PackageReference Include="Microsoft.Extensions.Options.ConfigurationExtensions" Version="2.1.1" />
+    <PackageReference Include="Microsoft.VisualStudio.Web.CodeGeneration.Design" Version="2.1.9" />
     <PackageReference Include="Newtonsoft.Json" Version="12.0.2" />
     <PackageReference Include="System.Data.SQLite" Version="1.0.111" />
   </ItemGroup>

Kyoo/Models/Episode.cs

@@ -9,6 +9,7 @@ namespace Kyoo.Models
         public long SeasonID;
 
         public long episodeNumber;
+        public string Path;
         public string Title;
         public string Overview;
         public DateTime ReleaseDate;
@@ -43,12 +44,13 @@ namespace Kyoo.Models
             ExternalIDs = externalIDs;
         }
 
-        public Episode(long id, long showID, long seasonID, long episodeNumber, string title, string overview, DateTime releaseDate, long runtime, string imgPrimary, string externalIDs)
+        public Episode(long id, long showID, long seasonID, long episodeNumber, string path, string title, string overview, DateTime releaseDate, long runtime, string imgPrimary, string externalIDs)
         {
             this.id = id;
             ShowID = showID;
             SeasonID = seasonID;
             this.episodeNumber = episodeNumber;
+            Path = path;
             Title = title;
             Overview = overview;
             ReleaseDate = releaseDate;

Kyoo/Models/Library.cs

@@ -0,0 +1,23 @@
+namespace Kyoo.Models
+{
+    public struct Library
+    {
+        public readonly long id;
+        public string Slug;
+        public string Name;
+
+        public Library(long id, string slug, string name)
+        {
+            this.id = id;
+            Slug = slug;
+            Name = name;
+        }
+
+        public static Library FromReader(System.Data.SQLite.SQLiteDataReader reader)
+        {
+            return new Library((long)reader["id"],
+                reader["slug"] as string,
+                reader["name"] as string);
+        }
+    }
+}

Kyoo/Startup.cs

@@ -7,6 +7,8 @@ using Microsoft.AspNetCore.Mvc;
 using Microsoft.AspNetCore.SpaServices.AngularCli;
 using Microsoft.Extensions.Configuration;
 using Microsoft.Extensions.DependencyInjection;
+using System.Diagnostics;
+using System.Web.Http;
 
 namespace Kyoo
 {
@@ -55,8 +57,9 @@ namespace Kyoo
             app.UseMvc(routes =>
             {
                 routes.MapRoute(
-                    name: "default",
+                    name: "API Route",
-                    template: "{controller}/{action=Index}/{id?}");
+                    template: "api/{controller}/{id}",
+                    defaults: new { id = RouteParameter.Optional });
             });
 
             app.UseSpa(spa =>