X-Git-Url: https://git.immae.eu/?a=blobdiff_plain;f=client%2Fsrc%2Fapp%2Fapp.component.ts;h=ef0b1ae56efff122389b63638169bd570b238491;hb=66357162f8e1227495f09bd4f68446aad7071c6d;hp=aba91aad2b528610f9dd5f8ac576f3387097ffe5;hpb=140ea386dea49220f4cdd5b67027e8d30eee1b06;p=github%2FChocobozzz%2FPeerTube.git diff --git a/client/src/app/app.component.ts b/client/src/app/app.component.ts index aba91aad2..ef0b1ae56 100644 --- a/client/src/app/app.component.ts +++ b/client/src/app/app.component.ts @@ -1,28 +1,23 @@ -import { Component, OnInit, ViewChild, AfterViewInit, Inject } from '@angular/core' +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 { AfterViewInit, Component, Inject, LOCALE_ID, OnInit, ViewChild } from '@angular/core' import { DomSanitizer, SafeHtml } from '@angular/platform-browser' import { Event, GuardsCheckStart, NavigationEnd, Router, Scroll } from '@angular/router' -import { AuthService, RedirectService, ServerService, ThemeService } from '@app/core' -import { is18nPath, getShortLocale } from '../../../shared/models/i18n' -import { ScreenService } from '@app/shared/misc/screen.service' -import { filter, map, pairwise, first } from 'rxjs/operators' -import { Hotkey, HotkeysService } from 'angular2-hotkeys' -import { I18n } from '@ngx-translate/i18n-polyfill' -import { PlatformLocation, ViewportScroller, DOCUMENT } from '@angular/common' -import { PluginService } from '@app/core/plugins/plugin.service' +import { AuthService, MarkdownService, RedirectService, ScreenService, ServerService, ThemeService, User } from '@app/core' import { HooksService } from '@app/core/plugins/hooks.service' -import { NgbModal } from '@ng-bootstrap/ng-bootstrap' -import { POP_STATE_MODAL_DISMISS } from '@app/shared/misc/constants' -import { WelcomeModalComponent } from '@app/modal/welcome-modal.component' -import { InstanceConfigWarningModalComponent } from '@app/modal/instance-config-warning-modal.component' +import { PluginService } from '@app/core/plugins/plugin.service' import { CustomModalComponent } from '@app/modal/custom-modal.component' -import { ServerConfig, UserRole } from '@shared/models' -import { User } from '@app/shared' -import { InstanceService } from '@app/shared/instance/instance.service' +import { InstanceConfigWarningModalComponent } from '@app/modal/instance-config-warning-modal.component' +import { WelcomeModalComponent } from '@app/modal/welcome-modal.component' +import { NgbModal } from '@ng-bootstrap/ng-bootstrap' +import { peertubeLocalStorage } from '@root-helpers/peertube-web-storage' +import { getShortLocale, is18nPath } from '@shared/core-utils/i18n' +import { BroadcastMessageLevel, ServerConfig, UserRole } from '@shared/models' import { MenuService } from './core/menu/menu.service' -import { BroadcastMessageLevel } from '@shared/models/server' -import { MarkdownService } from './shared/renderer' -import { concat } from 'rxjs' -import { peertubeLocalStorage } from './shared/misc/peertube-web-storage' +import { POP_STATE_MODAL_DISMISS } from './helpers' +import { InstanceService } from './shared/shared-instance' @Component({ selector: 'my-app', @@ -43,7 +38,7 @@ export class AppComponent implements OnInit, AfterViewInit { constructor ( @Inject(DOCUMENT) private document: Document, - private i18n: I18n, + @Inject(LOCALE_ID) private localeId: string, private viewportScroller: ViewportScroller, private router: Router, private authService: AuthService, @@ -97,6 +92,8 @@ export class AppComponent implements OnInit, AfterViewInit { this.location.onPopState(() => this.modalService.dismissAll(POP_STATE_MODAL_DISMISS)) this.openModalsIfNeeded() + + this.document.documentElement.lang = getShortLocale(this.localeId) } ngAfterViewInit () { @@ -111,6 +108,7 @@ export class AppComponent implements OnInit, AfterViewInit { peertubeLocalStorage.setItem(AppComponent.BROADCAST_MESSAGE_KEY, this.serverConfig.broadcastMessage.message) this.broadcastMessage = null + this.screenService.isBroadcastMessageDisplayed = false } private initRouteEvents () { @@ -120,12 +118,17 @@ export class AppComponent implements OnInit, AfterViewInit { const scrollEvent = eventsObs.pipe(filter((e: Event): e is Scroll => e instanceof Scroll)) scrollEvent.subscribe(e => { - if (e.position) { - return this.viewportScroller.scrollToPosition(e.position) + // scrollToAnchor first to preserve anchor position when using history navigation + if (e.anchor) { + setTimeout(() => { + this.viewportScroller.scrollToAnchor(e.anchor) + }) + + return } - if (e.anchor) { - return this.viewportScroller.scrollToAnchor(e.anchor) + if (e.position) { + return this.viewportScroller.scrollToPosition(e.position) } if (resetScroll) { @@ -171,16 +174,6 @@ export class AppComponent implements OnInit, AfterViewInit { filter(pathname => !pathname || pathname === '/' || is18nPath(pathname)) ).subscribe(() => this.redirectService.redirectToHomepage(true)) - navigationEndEvent.pipe( - map(() => window.location.pathname), - ).subscribe(pathname => { - if (is18nPath(pathname)) { - this.document.documentElement.lang = getShortLocale(pathname.split('/')[1]) - } else { - this.document.documentElement.lang = 'en' - } - }) - navigationEndEvent.subscribe(e => { this.hooks.runAction('action:router.navigation-end', 'common', { path: e.url }) }) @@ -197,6 +190,7 @@ export class AppComponent implements OnInit, AfterViewInit { this.serverService.configReloaded ).subscribe(async config => { this.broadcastMessage = null + this.screenService.isBroadcastMessageDisplayed = false const messageConfig = config.broadcastMessage @@ -217,6 +211,8 @@ export class AppComponent implements OnInit, AfterViewInit { dismissable: messageConfig.dismissable, class: classes[messageConfig.level] } + + this.screenService.isBroadcastMessageDisplayed = true } }) } @@ -290,37 +286,37 @@ export class AppComponent implements OnInit, AfterViewInit { new Hotkey(['/', 's'], (event: KeyboardEvent): boolean => { document.getElementById('search-video').focus() return false - }, undefined, this.i18n('Focus the search bar')), + }, undefined, $localize`Focus the search bar`), new Hotkey('b', (event: KeyboardEvent): boolean => { this.menu.toggleMenu() return false - }, undefined, this.i18n('Toggle the left menu')), + }, undefined, $localize`Toggle the left menu`), new Hotkey('g o', (event: KeyboardEvent): boolean => { this.router.navigate([ '/videos/overview' ]) return false - }, undefined, this.i18n('Go to the discover videos page')), + }, undefined, $localize`Go to the discover videos page`), new Hotkey('g t', (event: KeyboardEvent): boolean => { this.router.navigate([ '/videos/trending' ]) return false - }, undefined, this.i18n('Go to the trending videos page')), + }, undefined, $localize`Go to the trending videos page`), new Hotkey('g r', (event: KeyboardEvent): boolean => { this.router.navigate([ '/videos/recently-added' ]) return false - }, undefined, this.i18n('Go to the recently added videos page')), + }, undefined, $localize`Go to the recently added videos page`), new Hotkey('g l', (event: KeyboardEvent): boolean => { this.router.navigate([ '/videos/local' ]) return false - }, undefined, this.i18n('Go to the local videos page')), + }, undefined, $localize`Go to the local videos page`), new Hotkey('g u', (event: KeyboardEvent): boolean => { this.router.navigate([ '/videos/upload' ]) return false - }, undefined, this.i18n('Go to the videos upload page')) + }, undefined, $localize`Go to the videos upload page`) ]) } }