494cd9ea618d9c79f36c767f8933efe8ad25f7b7
[oweals/peertube.git] / client / src / app / app.component.ts
1 import { Component, OnInit } from '@angular/core'
2 import { DomSanitizer, SafeHtml } from '@angular/platform-browser'
3 import { GuardsCheckStart, NavigationEnd, Router } from '@angular/router'
4 import { AuthService, RedirectService, ServerService } from '@app/core'
5 import { is18nPath } from '../../../shared/models/i18n'
6 import { ScreenService } from '@app/shared/misc/screen.service'
7
8 @Component({
9   selector: 'my-app',
10   templateUrl: './app.component.html',
11   styleUrls: [ './app.component.scss' ]
12 })
13 export class AppComponent implements OnInit {
14   notificationOptions = {
15     timeOut: 5000,
16     lastOnBottom: true,
17     clickToClose: true,
18     maxLength: 0,
19     maxStack: 7,
20     showProgressBar: false,
21     pauseOnHover: false,
22     preventDuplicates: false,
23     preventLastDuplicates: 'visible',
24     rtl: false
25   }
26
27   isMenuDisplayed = true
28
29   customCSS: SafeHtml
30
31   constructor (
32     private router: Router,
33     private authService: AuthService,
34     private serverService: ServerService,
35     private domSanitizer: DomSanitizer,
36     private redirectService: RedirectService,
37     private screenService: ScreenService
38   ) { }
39
40   get serverVersion () {
41     return this.serverService.getConfig().serverVersion
42   }
43
44   get instanceName () {
45     return this.serverService.getConfig().instance.name
46   }
47
48   get defaultRoute () {
49     return RedirectService.DEFAULT_ROUTE
50   }
51
52   ngOnInit () {
53     document.getElementById('incompatible-browser').className += ' browser-ok'
54
55     this.router.events.subscribe(e => {
56       if (e instanceof NavigationEnd) {
57         const pathname = window.location.pathname
58         if (!pathname || pathname === '/' || is18nPath(pathname)) {
59           this.redirectService.redirectToHomepage(true)
60         }
61       }
62     })
63
64     this.authService.loadClientCredentials()
65
66     if (this.isUserLoggedIn()) {
67       // The service will automatically redirect to the login page if the token is not valid anymore
68       this.authService.refreshUserInformation()
69     }
70
71     // Load custom data from server
72     this.serverService.loadConfig()
73     this.serverService.loadVideoCategories()
74     this.serverService.loadVideoLanguages()
75     this.serverService.loadVideoLicences()
76     this.serverService.loadVideoPrivacies()
77
78     // Do not display menu on small screens
79     if (this.screenService.isInSmallView()) {
80       this.isMenuDisplayed = false
81     }
82
83     this.router.events.subscribe(
84       e => {
85         // User clicked on a link in the menu, change the page
86         if (e instanceof GuardsCheckStart && this.screenService.isInSmallView()) {
87           this.isMenuDisplayed = false
88         }
89       }
90     )
91
92     this.serverService.configLoaded
93       .subscribe(() => {
94         const config = this.serverService.getConfig()
95
96         // We test customCSS if the admin removed the css
97         if (this.customCSS || config.instance.customizations.css) {
98           const styleTag = '<style>' + config.instance.customizations.css + '</style>'
99           this.customCSS = this.domSanitizer.bypassSecurityTrustHtml(styleTag)
100         }
101
102         if (config.instance.customizations.javascript) {
103           try {
104             // tslint:disable:no-eval
105             eval(config.instance.customizations.javascript)
106           } catch (err) {
107             console.error('Cannot eval custom JavaScript.', err)
108           }
109         }
110       })
111   }
112
113   isUserLoggedIn () {
114     return this.authService.isLoggedIn()
115   }
116
117   toggleMenu () {
118     window.scrollTo(0, 0)
119     this.isMenuDisplayed = !this.isMenuDisplayed
120   }
121 }