X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fapp.component.ts;h=2149768a232accf60c28978cb10d24dcd1864907;hb=4a9e71c2b1ef57de01cd04984348b3957ebbc21d;hp=ba52c2102b854abfc417cb4253f0531f83eeb56c;hpb=c8cf5952f3be2dd64016c10dfe1825a6de1ec39b;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts index ba52c2102..2149768a2 100644 --- a/client/src/app/app.component.ts +++ b/client/src/app/app.component.ts @@ -1,6 +1,10 @@ import { Component, OnInit } from '@angular/core' -import { NavigationEnd, Router } from '@angular/router' -import { AuthService, ServerService } from '@app/core' +import { DomSanitizer, SafeHtml } from '@angular/platform-browser' +import { GuardsCheckStart, NavigationEnd, Router } from '@angular/router' +import { AuthService, RedirectService, ServerService } from '@app/core' +import { is18nPath } from '../../../shared/models/i18n' +import { ScreenService } from '@app/shared/misc/screen.service' +import { skip } from 'rxjs/operators' @Component({ selector: 'my-app', @@ -23,16 +27,44 @@ export class AppComponent implements OnInit { isMenuDisplayed = true + customCSS: SafeHtml + constructor ( private router: Router, private authService: AuthService, - private serverService: ServerService - ) {} + private serverService: ServerService, + private domSanitizer: DomSanitizer, + private redirectService: RedirectService, + private screenService: ScreenService + ) { } + + get serverVersion () { + return this.serverService.getConfig().serverVersion + } + + get instanceName () { + return this.serverService.getConfig().instance.name + } + + get defaultRoute () { + return RedirectService.DEFAULT_ROUTE + } ngOnInit () { + document.getElementById('incompatible-browser').className += ' browser-ok' + + this.router.events.subscribe(e => { + if (e instanceof NavigationEnd) { + const pathname = window.location.pathname + if (!pathname || pathname === '/' || is18nPath(pathname)) { + this.redirectService.redirectToHomepage(true) + } + } + }) + this.authService.loadClientCredentials() - if (this.authService.isLoggedIn()) { + if (this.isUserLoggedIn()) { // The service will automatically redirect to the login page if the token is not valid anymore this.authService.refreshUserInformation() } @@ -45,29 +77,56 @@ export class AppComponent implements OnInit { this.serverService.loadVideoPrivacies() // Do not display menu on small screens - if (window.innerWidth < 600) { + if (this.screenService.isInSmallView()) { this.isMenuDisplayed = false } this.router.events.subscribe( e => { // User clicked on a link in the menu, change the page - if (e instanceof NavigationEnd && window.innerWidth < 600) { + if (e instanceof GuardsCheckStart && this.screenService.isInSmallView()) { this.isMenuDisplayed = false } } ) - } - toggleMenu () { - window.scrollTo(0, 0) - this.isMenuDisplayed = !this.isMenuDisplayed + // Inject JS + this.serverService.configLoaded + .subscribe(() => { + const config = this.serverService.getConfig() + + if (config.instance.customizations.javascript) { + try { + // tslint:disable:no-eval + eval(config.instance.customizations.javascript) + } catch (err) { + console.error('Cannot eval custom JavaScript.', err) + } + } + }) + + // Inject CSS if modified (admin config settings) + this.serverService.configLoaded + .pipe(skip(1)) // We only want to subscribe to reloads, because the CSS is already injected by the server + .subscribe(() => { + const headStyle = document.querySelector('style.custom-css-style') + if (headStyle) headStyle.parentNode.removeChild(headStyle) + + const config = this.serverService.getConfig() + + // We test customCSS if the admin removed the css + if (this.customCSS || config.instance.customizations.css) { + const styleTag = '' + this.customCSS = this.domSanitizer.bypassSecurityTrustHtml(styleTag) + } + }) } - getMainColClasses () { - // Take all width is the menu is not displayed - if (this.isMenuDisplayed === false) return [ 'expanded' ] + isUserLoggedIn () { + return this.authService.isLoggedIn() + } - return [] + toggleMenu () { + this.isMenuDisplayed = !this.isMenuDisplayed } }