aboutsummaryrefslogtreecommitdiffhomepage
path: root/client/src/app
diff options
context:
space:
mode:
authorChocobozzz <florian.bigard@gmail.com>2017-06-11 12:28:22 +0200
committerChocobozzz <florian.bigard@gmail.com>2017-06-11 12:28:22 +0200
commit8635a2c70cc24a4c52558162ac058de95750271f (patch)
treea9699b7c6696218604e6b273b4f34a6898d4f16b /client/src/app
parent66dd264f7b15c05006faa00694c88c56794edc54 (diff)
downloadPeerTube-8635a2c70cc24a4c52558162ac058de95750271f.tar.gz
PeerTube-8635a2c70cc24a4c52558162ac058de95750271f.tar.zst
PeerTube-8635a2c70cc24a4c52558162ac058de95750271f.zip
Update client modules
Diffstat (limited to 'client/src/app')
-rw-r--r--client/src/app/app.module.ts67
-rw-r--r--client/src/app/app.resolver.ts18
-rw-r--r--client/src/app/app.service.ts20
-rw-r--r--client/src/app/environment.ts54
-rw-r--r--client/src/app/videos/video-watch/video-watch.component.ts2
5 files changed, 126 insertions, 35 deletions
diff --git a/client/src/app/app.module.ts b/client/src/app/app.module.ts
index 7d1760fcd..8a072eaac 100644
--- a/client/src/app/app.module.ts
+++ b/client/src/app/app.module.ts
@@ -1,6 +1,10 @@
1import { ApplicationRef, NgModule } from '@angular/core'; 1import { ApplicationRef, NgModule } from '@angular/core';
2import { BrowserModule } from '@angular/platform-browser'; 2import { BrowserModule } from '@angular/platform-browser';
3import { removeNgStyles, createNewHosts } from '@angularclass/hmr'; 3import {
4 removeNgStyles,
5 createNewHosts,
6 createInputTransfer
7} from '@angularclass/hmr';
4 8
5import { MetaModule, MetaLoader, MetaStaticLoader, PageTitlePositioning } from '@nglibs/meta'; 9import { MetaModule, MetaLoader, MetaStaticLoader, PageTitlePositioning } from '@nglibs/meta';
6// TODO: remove, we need this to avoid error in ng2-smart-table 10// TODO: remove, we need this to avoid error in ng2-smart-table
@@ -10,7 +14,7 @@ import 'bootstrap-loader';
10import { ENV_PROVIDERS } from './environment'; 14import { ENV_PROVIDERS } from './environment';
11import { AppRoutingModule } from './app-routing.module'; 15import { AppRoutingModule } from './app-routing.module';
12import { AppComponent } from './app.component'; 16import { AppComponent } from './app.component';
13import { AppState } from './app.service'; 17import { AppState, InternalStateType } from './app.service';
14 18
15import { AccountModule } from './account'; 19import { AccountModule } from './account';
16import { CoreModule } from './core'; 20import { CoreModule } from './core';
@@ -31,6 +35,12 @@ export function metaFactory(): MetaLoader {
31 }); 35 });
32} 36}
33 37
38type StoreType = {
39 state: InternalStateType,
40 restoreInputValues: () => void,
41 disposeOldHosts: () => void
42};
43
34// Application wide providers 44// Application wide providers
35const APP_PROVIDERS = [ 45const APP_PROVIDERS = [
36 AppState 46 AppState
@@ -67,25 +77,58 @@ const APP_PROVIDERS = [
67 ] 77 ]
68}) 78})
69export class AppModule { 79export class AppModule {
70 constructor(public appRef: ApplicationRef, public appState: AppState) {} 80 constructor(
71 hmrOnInit(store) { 81 public appRef: ApplicationRef,
72 if (!store || !store.state) return; 82 public appState: AppState
73 console.log('HMR store', store); 83 ) {}
84
85 public hmrOnInit(store: StoreType) {
86 if (!store || !store.state) {
87 return;
88 }
89 console.log('HMR store', JSON.stringify(store, null, 2));
90 /**
91 * Set state
92 */
74 this.appState._state = store.state; 93 this.appState._state = store.state;
94 /**
95 * Set input values
96 */
97 if ('restoreInputValues' in store) {
98 let restoreInputValues = store.restoreInputValues;
99 setTimeout(restoreInputValues);
100 }
101
75 this.appRef.tick(); 102 this.appRef.tick();
76 delete store.state; 103 delete store.state;
104 delete store.restoreInputValues;
77 } 105 }
78 hmrOnDestroy(store) { 106
79 const cmpLocation = this.appRef.components.map(cmp => cmp.location.nativeElement); 107 public hmrOnDestroy(store: StoreType) {
80 // recreate elements 108 const cmpLocation = this.appRef.components.map((cmp) => cmp.location.nativeElement);
109 /**
110 * Save state
111 */
81 const state = this.appState._state; 112 const state = this.appState._state;
82 store.state = state; 113 store.state = state;
114 /**
115 * Recreate root elements
116 */
83 store.disposeOldHosts = createNewHosts(cmpLocation); 117 store.disposeOldHosts = createNewHosts(cmpLocation);
84 // remove styles 118 /**
119 * Save input values
120 */
121 store.restoreInputValues = createInputTransfer();
122 /**
123 * Remove styles
124 */
85 removeNgStyles(); 125 removeNgStyles();
86 } 126 }
87 hmrAfterDestroy(store) { 127
88 // display new elements 128 public hmrAfterDestroy(store: StoreType) {
129 /**
130 * Display new elements
131 */
89 store.disposeOldHosts(); 132 store.disposeOldHosts();
90 delete store.disposeOldHosts; 133 delete store.disposeOldHosts;
91 } 134 }
diff --git a/client/src/app/app.resolver.ts b/client/src/app/app.resolver.ts
new file mode 100644
index 000000000..45774b8d1
--- /dev/null
+++ b/client/src/app/app.resolver.ts
@@ -0,0 +1,18 @@
1import { Resolve, ActivatedRouteSnapshot, RouterStateSnapshot } from '@angular/router';
2import { Injectable } from '@angular/core';
3import { Observable } from 'rxjs/Observable';
4import 'rxjs/add/observable/of';
5
6@Injectable()
7export class DataResolver implements Resolve<any> {
8 public resolve(route: ActivatedRouteSnapshot, state: RouterStateSnapshot) {
9 return Observable.of({ res: 'I am data'});
10 }
11}
12
13/**
14 * An array of services to resolve routes with data.
15 */
16export const APP_RESOLVER_PROVIDERS = [
17 DataResolver
18];
diff --git a/client/src/app/app.service.ts b/client/src/app/app.service.ts
index 9b582e472..a7eb880a4 100644
--- a/client/src/app/app.service.ts
+++ b/client/src/app/app.service.ts
@@ -9,28 +9,38 @@ export class AppState {
9 9
10 public _state: InternalStateType = { }; 10 public _state: InternalStateType = { };
11 11
12 // already return a clone of the current state 12 /**
13 * Already return a clone of the current state.
14 */
13 public get state() { 15 public get state() {
14 return this._state = this._clone(this._state); 16 return this._state = this._clone(this._state);
15 } 17 }
16 // never allow mutation 18 /**
19 * Never allow mutation
20 */
17 public set state(value) { 21 public set state(value) {
18 throw new Error('do not mutate the `.state` directly'); 22 throw new Error('do not mutate the `.state` directly');
19 } 23 }
20 24
21 public get(prop?: any) { 25 public get(prop?: any) {
22 // use our state getter for the clone 26 /**
27 * Use our state getter for the clone.
28 */
23 const state = this.state; 29 const state = this.state;
24 return state.hasOwnProperty(prop) ? state[prop] : state; 30 return state.hasOwnProperty(prop) ? state[prop] : state;
25 } 31 }
26 32
27 public set(prop: string, value: any) { 33 public set(prop: string, value: any) {
28 // internally mutate our state 34 /**
35 * Internally mutate our state.
36 */
29 return this._state[prop] = value; 37 return this._state[prop] = value;
30 } 38 }
31 39
32 private _clone(object: InternalStateType) { 40 private _clone(object: InternalStateType) {
33 // simple object clone 41 /**
42 * Simple object clone.
43 */
34 return JSON.parse(JSON.stringify( object )); 44 return JSON.parse(JSON.stringify( object ));
35 } 45 }
36} 46}
diff --git a/client/src/app/environment.ts b/client/src/app/environment.ts
index 929e09490..799102d82 100644
--- a/client/src/app/environment.ts
+++ b/client/src/app/environment.ts
@@ -1,21 +1,35 @@
1 1/**
2// Angular 2 2 * Angular 2
3// rc2 workaround 3 */
4import { enableDebugTools, disableDebugTools } from '@angular/platform-browser'; 4import {
5import { enableProdMode, ApplicationRef } from '@angular/core'; 5 enableDebugTools,
6// Environment Providers 6 disableDebugTools
7} from '@angular/platform-browser';
8import {
9 ApplicationRef,
10 enableProdMode
11} from '@angular/core';
12/**
13 * Environment Providers
14 */
7let PROVIDERS: any[] = [ 15let PROVIDERS: any[] = [
8 // common env directives 16 /**
17 * Common env directives
18 */
9]; 19];
10 20
11// Angular debug tools in the dev console 21/**
12// https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md 22 * Angular debug tools in the dev console
13let _decorateModuleRef = function identity<T>(value: T): T { return value; }; 23 * https://github.com/angular/angular/blob/86405345b781a9dc2438c0fbe3e9409245647019/TOOLS_JS.md
24 */
25let _decorateModuleRef = <T>(value: T): T => { return value; };
14 26
15if ('production' === ENV) { 27if ('production' === ENV) {
16 enableProdMode(); 28 enableProdMode();
17 29
18 // Production 30 /**
31 * Production
32 */
19 _decorateModuleRef = (modRef: any) => { 33 _decorateModuleRef = (modRef: any) => {
20 disableDebugTools(); 34 disableDebugTools();
21 35
@@ -24,7 +38,9 @@ if ('production' === ENV) {
24 38
25 PROVIDERS = [ 39 PROVIDERS = [
26 ...PROVIDERS, 40 ...PROVIDERS,
27 // custom providers in production 41 /**
42 * Custom providers in production.
43 */
28 ]; 44 ];
29 45
30} else { 46} else {
@@ -33,17 +49,21 @@ if ('production' === ENV) {
33 const appRef = modRef.injector.get(ApplicationRef); 49 const appRef = modRef.injector.get(ApplicationRef);
34 const cmpRef = appRef.components[0]; 50 const cmpRef = appRef.components[0];
35 51
36 let _ng = (<any>window).ng; 52 let _ng = (<any> window).ng;
37 enableDebugTools(cmpRef); 53 enableDebugTools(cmpRef);
38 (<any>window).ng.probe = _ng.probe; 54 (<any> window).ng.probe = _ng.probe;
39 (<any>window).ng.coreTokens = _ng.coreTokens; 55 (<any> window).ng.coreTokens = _ng.coreTokens;
40 return modRef; 56 return modRef;
41 }; 57 };
42 58
43 // Development 59 /**
60 * Development
61 */
44 PROVIDERS = [ 62 PROVIDERS = [
45 ...PROVIDERS, 63 ...PROVIDERS,
46 // custom providers in development 64 /**
65 * Custom providers in development.
66 */
47 ]; 67 ];
48 68
49} 69}
diff --git a/client/src/app/videos/video-watch/video-watch.component.ts b/client/src/app/videos/video-watch/video-watch.component.ts
index d4b60b001..32c847785 100644
--- a/client/src/app/videos/video-watch/video-watch.component.ts
+++ b/client/src/app/videos/video-watch/video-watch.component.ts
@@ -31,7 +31,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy {
31 error: boolean = false; 31 error: boolean = false;
32 loading: boolean = false; 32 loading: boolean = false;
33 numPeers: number; 33 numPeers: number;
34 player: VideoJSPlayer; 34 player: videojs.Player;
35 playerElement: Element; 35 playerElement: Element;
36 uploadSpeed: number; 36 uploadSpeed: number;
37 userRating: RateType = null; 37 userRating: RateType = null;