X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fapp.component.ts;h=c1e2961820a255a08f8664669bfccb6b6df67ef3;hb=27bc95867442c772841fb183a625bbda61dede51;hp=863c3f3b5885242ca44d440d23f18086236e0771;hpb=4d7ce9218a3f695bf3d013cbdce1c5c6a5221927;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts index 863c3f3b5..c1e296182 100644 --- a/client/src/app/app.component.ts +++ b/client/src/app/app.component.ts @@ -1,7 +1,6 @@ import { Hotkey, HotkeysService } from 'angular2-hotkeys' -import { concat } from 'rxjs' -import { filter, first, map, pairwise } from 'rxjs/operators' -import { DOCUMENT, PlatformLocation, ViewportScroller } from '@angular/common' +import { filter, map, pairwise, switchMap } from 'rxjs/operators' +import { DOCUMENT, getLocaleDirection, PlatformLocation, ViewportScroller } from '@angular/common' import { AfterViewInit, Component, Inject, LOCALE_ID, OnInit, ViewChild } from '@angular/core' import { DomSanitizer, SafeHtml } from '@angular/platform-browser' import { Event, GuardsCheckStart, NavigationEnd, RouteConfigLoadEnd, RouteConfigLoadStart, Router, Scroll } from '@angular/router' @@ -14,8 +13,8 @@ import { WelcomeModalComponent } from '@app/modal/welcome-modal.component' import { NgbConfig, NgbModal } from '@ng-bootstrap/ng-bootstrap' import { LoadingBarService } from '@ngx-loading-bar/core' import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage' -import { getShortLocale, is18nPath } from '@shared/core-utils/i18n' -import { BroadcastMessageLevel, ServerConfig, UserRole } from '@shared/models' +import { getShortLocale } from '@shared/core-utils/i18n' +import { BroadcastMessageLevel, HTMLServerConfig, ServerConfig, UserRole } from '@shared/models' import { MenuService } from './core/menu/menu.service' import { POP_STATE_MODAL_DISMISS } from './helpers' import { InstanceService } from './shared/shared-instance' @@ -35,7 +34,7 @@ export class AppComponent implements OnInit, AfterViewInit { customCSS: SafeHtml broadcastMessage: { message: string, dismissable: boolean, class: string } | null = null - private serverConfig: ServerConfig + private serverConfig: HTMLServerConfig constructor ( @Inject(DOCUMENT) private document: Document, @@ -73,11 +72,9 @@ export class AppComponent implements OnInit, AfterViewInit { ngOnInit () { document.getElementById('incompatible-browser').className += ' browser-ok' - this.serverConfig = this.serverService.getTmpConfig() - this.serverService.getConfig() - .subscribe(config => this.serverConfig = config) + this.serverConfig = this.serverService.getHTMLConfig() - this.loadPlugins() + this.hooks.runAction('action:application.init', 'common') this.themeService.initialize() this.authService.loadClientCredentials() @@ -88,10 +85,21 @@ export class AppComponent implements OnInit, AfterViewInit { } this.initRouteEvents() + this.injectJS() this.injectCSS() this.injectBroadcastMessage() + this.serverService.configReloaded + .subscribe(config => { + this.serverConfig = config + + this.injectBroadcastMessage() + this.injectCSS() + + // Don't reinject JS since it could conflict with existing one + }) + this.initHotkeys() this.location.onPopState(() => this.modalService.dismissAll(POP_STATE_MODAL_DISMISS)) @@ -99,6 +107,7 @@ export class AppComponent implements OnInit, AfterViewInit { this.openModalsIfNeeded() this.document.documentElement.lang = getShortLocale(this.localeId) + this.document.documentElement.dir = getLocaleDirection(this.localeId) } ngAfterViewInit () { @@ -181,12 +190,6 @@ export class AppComponent implements OnInit, AfterViewInit { } }) - // Homepage redirection - navigationEndEvent.pipe( - map(() => window.location.pathname), - filter(pathname => !pathname || pathname === '/' || is18nPath(pathname)) - ).subscribe(() => this.redirectService.redirectToHomepage(true)) - // Plugin hooks navigationEndEvent.subscribe(e => { this.hooks.runAction('action:router.navigation-end', 'common', { path: e.url }) @@ -208,89 +211,73 @@ export class AppComponent implements OnInit, AfterViewInit { ).subscribe(() => this.loadingBar.useRef().complete()) } - private injectBroadcastMessage () { - concat( - this.serverService.getConfig().pipe(first()), - this.serverService.configReloaded - ).subscribe(async config => { - this.broadcastMessage = null - this.screenService.isBroadcastMessageDisplayed = false - - const messageConfig = config.broadcastMessage + private async injectBroadcastMessage () { + this.broadcastMessage = null + this.screenService.isBroadcastMessageDisplayed = false - if (messageConfig.enabled) { - // Already dismissed this message? - if (messageConfig.dismissable && localStorage.getItem(AppComponent.BROADCAST_MESSAGE_KEY) === messageConfig.message) { - return - } + const messageConfig = this.serverConfig.broadcastMessage - const classes: { [id in BroadcastMessageLevel]: string } = { - info: 'alert-info', - warning: 'alert-warning', - error: 'alert-danger' - } + if (messageConfig.enabled) { + // Already dismissed this message? + if (messageConfig.dismissable && localStorage.getItem(AppComponent.BROADCAST_MESSAGE_KEY) === messageConfig.message) { + return + } - this.broadcastMessage = { - message: await this.markdownService.unsafeMarkdownToHTML(messageConfig.message, true), - dismissable: messageConfig.dismissable, - class: classes[messageConfig.level] - } + const classes: { [id in BroadcastMessageLevel]: string } = { + info: 'alert-info', + warning: 'alert-warning', + error: 'alert-danger' + } - this.screenService.isBroadcastMessageDisplayed = true + this.broadcastMessage = { + message: await this.markdownService.unsafeMarkdownToHTML(messageConfig.message, true), + dismissable: messageConfig.dismissable, + class: classes[messageConfig.level] } - }) + + this.screenService.isBroadcastMessageDisplayed = true + } } private injectJS () { // Inject JS - this.serverService.getConfig() - .subscribe(config => { - if (config.instance.customizations.javascript) { - try { - // tslint:disable:no-eval - eval(config.instance.customizations.javascript) - } catch (err) { - console.error('Cannot eval custom JavaScript.', err) - } - } - }) - } - - private injectCSS () { - // Inject CSS if modified (admin config settings) - concat( - this.serverService.getConfig().pipe(first()), - this.serverService.configReloaded - ).subscribe(config => { - const headStyle = document.querySelector('style.custom-css-style') - if (headStyle) headStyle.parentNode.removeChild(headStyle) - - // We test customCSS if the admin removed the css - if (this.customCSS || config.instance.customizations.css) { - const styleTag = '' - this.customCSS = this.domSanitizer.bypassSecurityTrustHtml(styleTag) + if (this.serverConfig.instance.customizations.javascript) { + try { + // tslint:disable:no-eval + eval(this.serverConfig.instance.customizations.javascript) + } catch (err) { + console.error('Cannot eval custom JavaScript.', err) } - }) + } } - private async loadPlugins () { - this.pluginService.initializePlugins() + private injectCSS () { + const headStyle = document.querySelector('style.custom-css-style') + if (headStyle) headStyle.parentNode.removeChild(headStyle) - this.hooks.runAction('action:application.init', 'common') + // We test customCSS if the admin removed the css + if (this.customCSS || this.serverConfig.instance.customizations.css) { + const styleTag = '' + this.customCSS = this.domSanitizer.bypassSecurityTrustHtml(styleTag) + } } private async openModalsIfNeeded () { this.authService.userInformationLoaded .pipe( map(() => this.authService.getUser()), - filter(user => user.role === UserRole.ADMINISTRATOR) - ).subscribe(user => setTimeout(() => this._openAdminModalsIfNeeded(user))) // setTimeout because of ngIf in template + filter(user => user.role === UserRole.ADMINISTRATOR), + switchMap(user => { + return this.serverService.getConfig() + .pipe(map(serverConfig => ({ serverConfig, user }))) + }) + ).subscribe(({ serverConfig, user }) => this._openAdminModalsIfNeeded(serverConfig, user)) } - private async _openAdminModalsIfNeeded (user: User) { + private async _openAdminModalsIfNeeded (serverConfig: ServerConfig, user: User) { if (user.noWelcomeModal !== true) return this.welcomeModal.show() - if (user.noInstanceConfigWarningModal === true || !this.serverConfig.signup.allowed) return + if (user.noInstanceConfigWarningModal === true || !serverConfig.signup.allowed) return this.instanceService.getAbout() .subscribe(about => {