From 74b7c6d48e9ca377fe938c8134ed74b612e62ba0 Mon Sep 17 00:00:00 2001 From: Chocobozzz Date: Wed, 6 Jun 2018 17:37:13 +0200 Subject: Little i18n refractoring --- client/src/app/app.module.ts | 18 +++++++++--------- client/src/app/core/server/server.service.ts | 20 +++++++++++--------- client/src/app/shared/i18n/i18n-utils.ts | 12 ++++++++++++ client/src/app/shared/video/video.service.ts | 4 ++-- .../app/videos/+video-watch/video-watch.component.ts | 3 ++- client/src/assets/player/peertube-player.ts | 10 ++++++---- client/src/main.ts | 7 +++++-- 7 files changed, 47 insertions(+), 27 deletions(-) (limited to 'client') diff --git a/client/src/app/app.module.ts b/client/src/app/app.module.ts index e60a74cc0..51e354378 100644 --- a/client/src/app/app.module.ts +++ b/client/src/app/app.module.ts @@ -16,8 +16,8 @@ import { MenuComponent } from './menu' import { SharedModule } from './shared' import { SignupModule } from './signup' import { VideosModule } from './videos' -import { buildFileLocale, getDefaultLocale } from '../../../shared/models/i18n' -import { environment } from '../environments/environment' +import { buildFileLocale, getCompleteLocale, getDefaultLocale, isDefaultLocale } from '../../../shared/models/i18n' +import { getDevLocale, isOnDevLocale } from '@app/shared/i18n/i18n-utils' export function metaFactory (serverService: ServerService): MetaLoader { return new MetaStaticLoader({ @@ -67,17 +67,17 @@ export function metaFactory (serverService: ServerService): MetaLoader { { provide: TRANSLATIONS, useFactory: (locale) => { - // On dev mode, test locales - if (environment.production === false && window.location.search === '?lang=fr') { - return require(`raw-loader!../locale/target/angular_fr.xml`) + // On dev mode, test localization + if (isOnDevLocale()) { + locale = getDevLocale() + return require(`raw-loader!../locale/target/angular_${locale}.xml`) } - const fileLocale = buildFileLocale(locale) - // Default locale, nothing to translate - const defaultFileLocale = buildFileLocale(getDefaultLocale()) - if (fileLocale === defaultFileLocale) return '' + const completeLocale = getCompleteLocale(locale) + if (isDefaultLocale(completeLocale)) return '' + const fileLocale = buildFileLocale(locale) return require(`raw-loader!../locale/target/angular_${fileLocale}.xml`) }, deps: [ LOCALE_ID ] diff --git a/client/src/app/core/server/server.service.ts b/client/src/app/core/server/server.service.ts index 56d33339e..74363e6a1 100644 --- a/client/src/app/core/server/server.service.ts +++ b/client/src/app/core/server/server.service.ts @@ -2,13 +2,13 @@ import { map, share, switchMap, tap } from 'rxjs/operators' import { HttpClient } from '@angular/common/http' import { Inject, Injectable, LOCALE_ID } from '@angular/core' import { peertubeLocalStorage } from '@app/shared/misc/peertube-local-storage' -import { Observable, ReplaySubject } from 'rxjs' -import { ServerConfig } from '../../../../../shared' +import { Observable, ReplaySubject, of } from 'rxjs' +import { getCompleteLocale, ServerConfig } from '../../../../../shared' import { About } from '../../../../../shared/models/server/about.model' import { environment } from '../../../environments/environment' import { VideoConstant, VideoPrivacy } from '../../../../../shared/models/videos' -import { buildFileLocale, getDefaultLocale } from '../../../../../shared/models/i18n' -import { peertubeTranslate } from '@app/shared/i18n/i18n-utils' +import { isDefaultLocale } from '../../../../../shared/models/i18n' +import { getDevLocale, isOnDevLocale, peertubeTranslate } from '@app/shared/i18n/i18n-utils' @Injectable() export class ServerService { @@ -72,8 +72,8 @@ export class ServerService { private http: HttpClient, @Inject(LOCALE_ID) private localeId: string ) { - this.loadConfigLocally() this.loadServerLocale() + this.loadConfigLocally() } loadConfig () { @@ -163,14 +163,16 @@ export class ServerService { } private loadServerLocale () { - const fileLocale = buildFileLocale(environment.production === true ? this.localeId : 'fr') + const completeLocale = isOnDevLocale() ? getDevLocale() : getCompleteLocale(this.localeId) // Default locale, nothing to translate - const defaultFileLocale = buildFileLocale(getDefaultLocale()) - if (fileLocale === defaultFileLocale) return {} + if (isDefaultLocale(completeLocale)) { + this.localeObservable = of({}).pipe(share()) + return + } this.localeObservable = this.http - .get(ServerService.BASE_LOCALE_URL + fileLocale + '/server.json') + .get(ServerService.BASE_LOCALE_URL + completeLocale + '/server.json') .pipe(share()) } diff --git a/client/src/app/shared/i18n/i18n-utils.ts b/client/src/app/shared/i18n/i18n-utils.ts index c1de51b7b..37180b930 100644 --- a/client/src/app/shared/i18n/i18n-utils.ts +++ b/client/src/app/shared/i18n/i18n-utils.ts @@ -1,7 +1,19 @@ +import { environment } from '../../../environments/environment' + function peertubeTranslate (str: string, translations: { [ id: string ]: string }) { return translations[str] ? translations[str] : str } +function isOnDevLocale () { + return environment.production === false && window.location.search === '?lang=fr' +} + +function getDevLocale () { + return 'fr' +} + export { + getDevLocale, + isOnDevLocale, peertubeTranslate } diff --git a/client/src/app/shared/video/video.service.ts b/client/src/app/shared/video/video.service.ts index c607b7d6a..58cb52efc 100644 --- a/client/src/app/shared/video/video.service.ts +++ b/client/src/app/shared/video/video.service.ts @@ -46,8 +46,8 @@ export class VideoService { return this.serverService.localeObservable .pipe( switchMap(translations => { - return this.authHttp.get(VideoService.BASE_VIDEO_URL + uuid) - .pipe(map(videoHash => ({ videoHash, translations }))) + return this.authHttp.get(VideoService.BASE_VIDEO_URL + uuid) + .pipe(map(videoHash => ({ videoHash, translations }))) }), map(({ videoHash, translations }) => new VideoDetails(videoHash, translations)), catchError(res => this.restExtractor.handleError(res)) diff --git a/client/src/app/videos/+video-watch/video-watch.component.ts b/client/src/app/videos/+video-watch/video-watch.component.ts index d3e16c4cf..4a67d456e 100644 --- a/client/src/app/videos/+video-watch/video-watch.component.ts +++ b/client/src/app/videos/+video-watch/video-watch.component.ts @@ -25,6 +25,7 @@ import { getVideojsOptions, loadLocale, addContextMenu } from '../../../assets/p import { ServerService } from '@app/core' import { I18n } from '@ngx-translate/i18n-polyfill' import { environment } from '../../../environments/environment' +import { getDevLocale, isOnDevLocale } from '@app/shared/i18n/i18n-utils' @Component({ selector: 'my-video-watch', @@ -377,7 +378,7 @@ export class VideoWatchComponent implements OnInit, OnDestroy { }) if (this.videojsLocaleLoaded === false) { - await loadLocale(environment.apiUrl, videojs, environment.production === true ? this.localeId : 'fr') + await loadLocale(environment.apiUrl, videojs, isOnDevLocale() ? getDevLocale() : this.localeId) this.videojsLocaleLoaded = true } diff --git a/client/src/assets/player/peertube-player.ts b/client/src/assets/player/peertube-player.ts index b604097fa..9e37b75d2 100644 --- a/client/src/assets/player/peertube-player.ts +++ b/client/src/assets/player/peertube-player.ts @@ -12,7 +12,7 @@ import './peertube-videojs-plugin' import './peertube-load-progress-bar' import { videojsUntyped } from './peertube-videojs-typings' import { buildVideoEmbed, buildVideoLink, copyToClipboard } from './utils' -import { is18nLocale, isDefaultLocale } from '../../../../shared/models/i18n/i18n' +import { getCompleteLocale, is18nLocale, isDefaultLocale } from '../../../../shared/models/i18n/i18n' // Change 'Playback Rate' to 'Speed' (smaller for our settings menu) videojsUntyped.getComponent('PlaybackRateMenuButton').prototype.controlText_ = 'Speed' @@ -141,11 +141,13 @@ function addContextMenu (player: any, videoEmbedUrl: string) { } function loadLocale (serverUrl: string, videojs: any, locale: string) { - if (!is18nLocale(locale) || isDefaultLocale(locale)) return undefined + const completeLocale = getCompleteLocale(locale) - return fetch(serverUrl + '/client/locales/' + locale + '/player.json') + if (!is18nLocale(completeLocale) || isDefaultLocale(completeLocale)) return Promise.resolve(undefined) + + return fetch(serverUrl + '/client/locales/' + completeLocale + '/player.json') .then(res => res.json()) - .then(json => videojs.addLanguage(locale, json)) + .then(json => videojs.addLanguage(completeLocale, json)) } export { diff --git a/client/src/main.ts b/client/src/main.ts index 19f45a3e3..061be17de 100644 --- a/client/src/main.ts +++ b/client/src/main.ts @@ -5,14 +5,17 @@ import { AppModule } from './app/app.module' import { environment } from './environments/environment' import { hmrBootstrap } from './hmr' +import { getDevLocale, isOnDevLocale } from '@app/shared/i18n/i18n-utils' let providers = [] if (environment.production) { enableProdMode() } -if (environment.production === false && window.location.search === '?lang=fr') { - const translations = require(`raw-loader!./locale/target/angular_fr.xml`) +// Template translation, should be in the bootstrap step +if (isOnDevLocale()) { + const locale = getDevLocale() + const translations = require(`raw-loader!./locale/target/angular_${locale}.xml`) providers = [ { provide: TRANSLATIONS, useValue: translations }, -- cgit v1.2.3