X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;ds=sidebyside;f=client%2Fsrc%2Fapp%2Fapp.component.ts;h=5d8e8badf757bf6692384301d994d838a5c2fab7;hb=73e09f270660c78e50e86921a5ca6b356f760c7c;hp=9d05c272ffc1f47c05f28a78bcafa2fa5a7df62b;hpb=de59c48f5f317018e3f746bbe4a7b7efe00109f2;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts index 9d05c272f..5d8e8badf 100644 --- a/client/src/app/app.component.ts +++ b/client/src/app/app.component.ts @@ -1,23 +1,114 @@ -import { Component } from '@angular/core'; -import { Router, ROUTER_DIRECTIVES } from '@angular/router'; - -import { MenuAdminComponent } from './admin'; -import { MenuComponent } from './menu.component'; -import { RestExtractor, RestService, SearchComponent, SearchService } from './shared'; -import { VideoService } from './videos'; +import { Component, OnInit } from '@angular/core' +import { DomSanitizer, SafeHtml } from '@angular/platform-browser' +import { GuardsCheckStart, Router } from '@angular/router' +import { AuthService, RedirectService, ServerService } from '@app/core' +import { isInSmallView } from '@app/shared/misc/utils' @Component({ - selector: 'my-app', - template: require('./app.component.html'), - styles: [ require('./app.component.scss') ], - directives: [ MenuAdminComponent, MenuComponent, ROUTER_DIRECTIVES, SearchComponent ], - providers: [ RestExtractor, RestService, VideoService, SearchService ] + selector: 'my-app', + templateUrl: './app.component.html', + styleUrls: [ './app.component.scss' ] }) +export class AppComponent implements OnInit { + notificationOptions = { + timeOut: 5000, + lastOnBottom: true, + clickToClose: true, + maxLength: 0, + maxStack: 7, + showProgressBar: false, + pauseOnHover: false, + preventDuplicates: false, + preventLastDuplicates: 'visible', + rtl: false + } + + isMenuDisplayed = true + + customCSS: SafeHtml + + constructor ( + private router: Router, + private authService: AuthService, + private serverService: ServerService, + private domSanitizer: DomSanitizer, + private redirectService: RedirectService + ) {} + + get serverVersion () { + return this.serverService.getConfig().serverVersion + } + + get instanceName () { + return this.serverService.getConfig().instance.name + } + + ngOnInit () { + document.getElementById('incompatible-browser').className += 'browser-ok' + + const pathname = window.location.pathname + if (!pathname || pathname === '/') { + this.redirectService.redirectToHomepage() + } + + this.authService.loadClientCredentials() + + if (this.authService.isLoggedIn()) { + // The service will automatically redirect to the login page if the token is not valid anymore + this.authService.refreshUserInformation() + } + + // Load custom data from server + this.serverService.loadConfig() + this.serverService.loadVideoCategories() + this.serverService.loadVideoLanguages() + this.serverService.loadVideoLicences() + this.serverService.loadVideoPrivacies() + + // Do not display menu on small screens + if (isInSmallView()) { + this.isMenuDisplayed = false + } + + this.router.events.subscribe( + e => { + // User clicked on a link in the menu, change the page + if (e instanceof GuardsCheckStart && isInSmallView()) { + this.isMenuDisplayed = false + } + } + ) + + this.serverService.configLoaded + .subscribe(() => { + const config = this.serverService.getConfig() + + // We test customCSS in case or the admin removed the css + if (this.customCSS || config.instance.customizations.css) { + const styleTag = '' + this.customCSS = this.domSanitizer.bypassSecurityTrustHtml(styleTag) + } + + if (config.instance.customizations.javascript) { + try { + // tslint:disable:no-eval + eval(config.instance.customizations.javascript) + } catch (err) { + console.error('Cannot eval custom JavaScript.', err) + } + } + }) + } + + toggleMenu () { + window.scrollTo(0, 0) + this.isMenuDisplayed = !this.isMenuDisplayed + } -export class AppComponent { - constructor(private router: Router) {} + getMainColClasses () { + // Take all width is the menu is not displayed + if (this.isMenuDisplayed === false) return [ 'expanded' ] - isInAdmin() { - return this.router.url.indexOf('/admin/') !== -1; + return [] } }