'use strict'; // ============================================================================ // Localization // ============================================================================ import Parser from '@ffz/icu-msgparser'; import {SERVER} from 'utilities/constants'; import {get, pick_random, timeout} from 'utilities/object'; import Module from 'utilities/module'; import NewTransCore from 'utilities/translation-core'; const FACES = ['(・`ω´・)', ';;w;;', 'owo', 'ono', 'oAo', 'oxo', 'ovo;', 'UwU', '>w<', '^w^', '> w >', 'v.v'], transformText = (ast, fn) => { return ast.map(node => { if ( typeof node === 'string' ) return fn(node); else if ( typeof node === 'object' && node.o ) { const out = Object.assign(node, {o: {}}); for(const key of Object.keys(node.o)) out.o[key] = transformText(node.o[key], fn) } return node; }) }, owo = text => text .replace(/(?:r|l)/g, 'w') .replace(/(?:R|L)/g, 'W') .replace(/n([aeiou])/g, 'ny$1') .replace(/N([aeiou])/g, 'Ny$1') .replace(/N([AEIOU])/g, 'NY$1') .replace(/ove/g, 'uv') .replace(/!+/g, ` ${pick_random(FACES)} `), TRANSFORMATIONS = { double: (key, ast) => [...ast, ' ', ...ast], upper: (key, ast) => transformText(ast, n => n.toUpperCase()), lower: (key, ast) => transformText(ast, n => n.toLowerCase()), append_key: (key, ast) => [...ast, ` (${key})`], set_key: key => [key], owo: (key, ast) => transformText(ast, owo) }; // ============================================================================ // TranslationManager // ============================================================================ export class TranslationManager extends Module { constructor(...args) { super(...args); this.inject('settings'); this.parser = new Parser; this._seen = new Set; this.availableLocales = ['en']; //, 'de', 'ja']; this.localeData = { en: { name: 'English' }/*, de: { name: 'Deutsch' }, ja: { name: '日本語' }*/ } this.settings.add('i18n.debug.transform', { default: null, ui: { path: 'Debugging > Localization >> General', title: 'Transformation', description: 'Transform all localized strings to test string coverage as well as length.', component: 'setting-select-box', data: [ {value: null, title: 'Disabled'}, {value: 'upper', title: 'Upper Case'}, {value: 'lower', title: 'Lower Case'}, {value: 'append_key', title: 'Append Key'}, {value: 'set_key', title: 'Set to Key'}, {value: 'double', title: 'Double'}, {value: 'owo', title: "owo what's this"} ] }, changed: val => { this._.transformation = TRANSFORMATIONS[val]; this.emit(':update') } }); this.settings.add('i18n.locale', { default: -1, process: (ctx, val) => { if ( val === -1 ) val = ctx.get('context.session.languageCode'); return this.availableLocales.includes(val) ? val : 'en' }, _ui: { path: 'Appearance > Localization >> General', title: 'Language', // description: '', component: 'setting-select-box', data: (profile, val) => [{ selected: val === -1, value: -1, i18n_key: 'setting.appearance.localization.general.language.twitch', title: "Use Twitch's Language" }].concat(this.availableLocales.map(l => ({ selected: val === l, value: l, title: this.localeData[l].name }))) }, changed: val => this.locale = val }); } onEnable() { this._ = new NewTransCore({ //TranslationCore({ warn: (...args) => this.log.warn(...args), }); if ( window.BroadcastChannel ) { const bc = this._broadcaster = new BroadcastChannel('ffz-i18n'); bc.addEventListener('message', this._boundHandleMessage = this.handleMessage.bind(this)); } this._.transformation = TRANSFORMATIONS[this.settings.get('i18n.debug.transform')]; this.locale = this.settings.get('i18n.locale'); } get locale() { return this._.locale; } set locale(new_locale) { this.setLocale(new_locale); } handleMessage(event) { const msg = event.data; if ( ! msg ) return; if ( msg.type === 'seen' ) this.see(msg.key, true); else if ( msg.type === 'request-keys' ) { this.broadcast({type: 'keys', keys: Array.from(this._seen)}) } else if ( msg.type === 'keys' ) this.emit(':receive-keys', msg.keys); } async getKeys() { this.broadcast({type: 'request-keys'}); let data; try { data = await timeout(this.waitFor(':receive-keys'), 100); } catch(err) { /* no-op */ } if ( data ) for(const val of data) this._seen.add(val); return this._seen; } broadcast(msg) { if ( this._broadcaster ) this._broadcaster.postMessage(msg) } see(key, from_broadcast = false) { if ( this._seen.has(key) ) return; this._seen.add(key); this.emit(':seen', key); if ( ! from_broadcast ) this.broadcast({type: 'seen', key}); } async loadLocale(locale) { if ( locale === 'en' ) return {}; /*if ( locale === 'de' ) return { site: { menu_button: 'FrankerFaceZ Leitstelle' }, player: { reset_button: 'Doppelklicken, um den Player zurückzusetzen' }, setting: { reset: 'Zurücksetzen', appearance: { _: 'Aussehen', description: 'Personalisieren Sie das Aussehen von Twitch. Ändern Sie das Farbschema und die Schriften und stimmen Sie das Layout so ab, dass Sie ein optimales Erlebnis erleben.

(Yes, this is Google Translate still.)', localization: { _: 'Lokalisierung', general: { language: { _: 'Sprache', twitch: "Verwenden Sie Twitch's Sprache" } }, dates_and_times: { _: 'Termine und Zeiten', allow_relative_times: { _: 'Relative Zeiten zulassen', description: 'Wenn dies aktiviert ist, zeigt FrankerFaceZ einige Male in einem relativen Format an.
Beispiel: vor 3 Stunden' } } }, layout: 'Layout', theme: 'Thema' }, profiles: { _: 'Profile', active: 'Dieses Profil ist aktiv.', inactive: { _: 'Dieses Profil ist nicht aktiv.', description: 'Dieses Profil stimmt nicht mit dem aktuellen Kontext überein und ist momentan nicht aktiv, so dass Sie keine Änderungen sehen, die Sie hier bei Twitch vorgenommen haben.' }, configure: 'Konfigurieren', default: { _: 'Standard Profil', description: 'Einstellungen, die überall auf Twitch angewendet werden.' }, moderation: { _: 'Mäßigung', description: 'Einstellungen, die gelten, wenn Sie ein Moderator des aktuellen Kanals sind.' } }, add_ons: { _: 'Erweiterung' }, 'inherited-from': 'Vererbt von: {title}', 'overridden-by': 'Überschrieben von: {title}' }, 'main-menu': { search: 'Sucheinstellungen', about: { _: 'Über', news: 'Nachrichten', support: 'Unterstützung' } } } if ( locale === 'ja' ) return { greeting: 'こんにちは', site: { menu_button: 'FrankerFaceZコントロールセンター' }, setting: { appearance: { _: '外観', localization: '局地化', layout: '設計', theme: '題材' } }, 'main-menu': { search: '検索設定', version: 'バージョン{version}', about: { _: '約', news: '便り', support: '対応' } } }*/ const resp = await fetch(`${SERVER}/script/i18n/${locale}.json`); if ( ! resp.ok ) { if ( resp.status === 404 ) { this.log.info(`Cannot Load Locale: ${locale}`); return {}; } this.log.warn(`Cannot Load Locale: ${locale} -- Status: ${resp.status}`); throw new Error(`http error ${resp.status} loading phrases`); } return resp.json(); } async setLocale(new_locale) { const old_locale = this._.locale; if ( new_locale === old_locale ) return []; await this.loadDayjsLocale(new_locale); this._.locale = new_locale; this._.clear(); this.log.info(`Changed Locale: ${new_locale} -- Old: ${old_locale}`); this.emit(':changed', new_locale, old_locale); this.emit(':update'); if ( new_locale === 'en' ) { // All the built-in messages are English. We don't need special // logic to load the translations. this.emit(':loaded', []); return []; } const phrases = await this.loadLocale(new_locale); if ( this._.locale !== new_locale ) throw new Error('locale has changed since we started loading'); const added = this._.extend(phrases); if ( added.length ) { this.log.info(`Loaded Locale: ${new_locale} -- Phrases: ${added.length}`); this.emit(':loaded', added); this.emit(':update'); } return added; } async loadDayjsLocale(locale) { if ( locale === 'en' ) return; try { await import( /* webpackMode: 'lazy' */ /* webpackChunkName: 'i18n-[index]' */ `dayjs/locale/${locale}` ); } catch(err) { this.log.warn(`Unable to load day.js locale data for locale "${locale}"`, err); } } has(key) { return this._.has(key); } toLocaleString(...args) { return this._.toLocaleString(...args); } toHumanTime(...args) { return this._.formatHumanTime(...args); } formatNumber(...args) { return this._.formatNumber(...args); } formatDate(...args) { return this._.formatDate(...args) } formatTime(...args) { return this._.formatTime(...args) } formatDateTime(...args) { return this._.formatDateTime(...args) } t(key, ...args) { this.see(key); return this._.t(key, ...args); } tList(key, ...args) { this.see(key); return this._.tList(key, ...args); } } // ============================================================================ // TranslationCore // ============================================================================ const REPLACE = String.prototype.replace; /*, SPLIT = String.prototype.split; const DEFAULT_FORMATTERS = { en_plural: n => n !== 1 ? 's' : '', number: (n, locale) => n.toLocaleString(locale) } export default class TranslationCore { constructor(options) { options = options || {}; this.warn = options.warn; this.phrases = new Map; this.extend(options.phrases); this.locale = options.locale || 'en'; this.defaultLocale = options.defaultLocale || this.locale; this.transformation = null; const allowMissing = options.allowMissing ? transformPhrase : null; this.onMissingKey = typeof options.onMissingKey === 'function' ? options.onMissingKey : allowMissing; this.transformPhrase = typeof options.transformPhrase === 'function' ? options.transformPhrase : transformPhrase; this.transformList = typeof options.transformList === 'function' ? options.transformList : transformList; this.delimiter = options.delimiter || /\s*\|\|\|\|\s/; this.tokenRegex = options.tokenRegex || /%\{(.*?)(?:\|(.*?))?\}/g; this.formatters = Object.assign({}, DEFAULT_FORMATTERS, options.formatters || {}); } formatNumber(value) { return value.toLocaleString(this.locale); } extend(phrases, prefix) { const added = []; for(const key in phrases) if ( has(phrases, key) ) { let phrase = phrases[key]; const pref_key = prefix ? key === '_' ? prefix : `${prefix}.${key}` : key; if ( typeof phrase === 'object' ) added.push(...this.extend(phrase, pref_key)); else { if ( typeof phrase === 'string' && phrase.indexOf(this.delimiter) !== -1 ) phrase = SPLIT.call(phrase, this.delimiter); this.phrases.set(pref_key, phrase); added.push(pref_key); } } return added; } unset(phrases, prefix) { if ( typeof phrases === 'string' ) phrases = [phrases]; const keys = Array.isArray(phrases) ? phrases : Object.keys(phrases); for(const key of keys) { const pref_key = prefix ? `${prefix}.${key}` : key; const phrase = phrases[key]; if ( typeof phrase === 'object' ) this.unset(phrase, pref_key); else this.phrases.delete(pref_key); } } has(key) { return this.phrases.has(key); } set(key, phrase) { if ( typeof phrase === 'string' && phrase.indexOf(this.delimiter) !== -1 ) phrase = SPLIT.call(phrase, this.delimiter); this.phrases.set(key, phrase); } clear() { this.phrases.clear(); } replace(phrases) { this.clear(); this.extend(phrases); } preT(key, phrase, options, use_default) { const opts = options == null ? {} : options; let p, locale; if ( use_default ) { p = phrase; locale = this.defaultLocale; } else if ( key === undefined && phrase ) { p = phrase; locale = this.defaultLocale; if ( this.warn ) this.warn(`Translation key not generated with phrase "${phrase}"`); } else if ( this.phrases.has(key) ) { p = this.phrases.get(key); locale = this.locale; } else if ( phrase ) { if ( this.warn && this.locale !== this.defaultLocale ) this.warn(`Missing translation for key "${key}" in locale "${this.locale}"`); p = phrase; locale = this.defaultLocale; } else if ( this.onMissingKey ) return this.onMissingKey(key, opts, this.locale, this.tokenRegex, this.formatters); else { if ( this.warn ) this.warn(`Missing translation for key "${key}" in locale "${this.locale}"`); return key; } if ( this.transformation ) p = this.transformation(key, p, opts, locale, this.tokenRegex); return [p, opts, locale]; } t(key, phrase, options, use_default) { const [p, opts, locale] = this.preT(key, phrase, options, use_default); return this.transformPhrase(p, opts, locale, this.tokenRegex, this.formatters); } tList(key, phrase, options, use_default) { const [p, opts, locale] = this.preT(key, phrase, options, use_default); return this.transformList(p, opts, locale, this.tokenRegex, this.formatters); } }*/ // ============================================================================ // Transformations // ============================================================================ const DOLLAR_REGEX = /\$/g; export function transformList(phrase, substitutions, locale, token_regex, formatters) { const is_array = Array.isArray(phrase); if ( substitutions == null ) return is_array ? phrase[0] : phrase; let p = phrase; const options = typeof substitutions === 'number' ? {count: substitutions} : substitutions; if ( is_array ) p = p[0]; const result = []; token_regex.lastIndex = 0; let idx = 0, match; while((match = token_regex.exec(p))) { const nix = match.index, arg = match[1], fmt = match[2]; if ( nix !== idx ) result.push(p.slice(idx, nix)); let val = get(arg, options); if ( val != null ) { const formatter = formatters[fmt]; if ( typeof formatter === 'function' ) val = formatter(val, locale, options); else if ( typeof val === 'string' ) val = REPLACE.call(val, DOLLAR_REGEX, '$$'); result.push(val); } idx = nix + match[0].length; } if ( idx < p.length ) result.push(p.slice(idx)); return result; } export function transformPhrase(phrase, substitutions, locale, token_regex, formatters) { const is_array = Array.isArray(phrase); if ( substitutions == null ) return is_array ? phrase[0] : phrase; let result = phrase; const options = typeof substitutions === 'number' ? {count: substitutions} : substitutions; if ( is_array ) result = result[0]; if ( typeof result === 'string' ) result = REPLACE.call(result, token_regex, (expr, arg, fmt) => { let val = get(arg, options); if ( val == null ) return ''; const formatter = formatters[fmt]; if ( typeof formatter === 'function' ) val = formatter(val, locale, options); else if ( typeof val === 'string' ) val = REPLACE.call(val, DOLLAR_REGEX, '$$'); return val; }); return result; }