🌐 Fixed language-detection

This commit is contained in:
Mawoka
2022-03-26 19:10:11 +01:00
parent 02c39edd45
commit 7f44911c6e
5 changed files with 109 additions and 91 deletions
+1
View File
@@ -33,6 +33,7 @@
"eslint-plugin-svelte3": "^3.2.1", "eslint-plugin-svelte3": "^3.2.1",
"felte": "^1.0.1", "felte": "^1.0.1",
"highlight.js": "^11.4.0", "highlight.js": "^11.4.0",
"i18next-browser-languagedetector": "^6.1.4",
"i18next-scanner": "^3.1.0", "i18next-scanner": "^3.1.0",
"ioredis": "^4.28.5", "ioredis": "^4.28.5",
"js-cookie": "^3.0.1", "js-cookie": "^3.0.1",
+11
View File
@@ -21,6 +21,7 @@ specifiers:
felte: ^1.0.1 felte: ^1.0.1
highlight.js: ^11.4.0 highlight.js: ^11.4.0
i18next: ^21.6.14 i18next: ^21.6.14
i18next-browser-languagedetector: ^6.1.4
i18next-scanner: ^3.1.0 i18next-scanner: ^3.1.0
ioredis: ^4.28.5 ioredis: ^4.28.5
js-cookie: ^3.0.1 js-cookie: ^3.0.1
@@ -64,6 +65,7 @@ devDependencies:
eslint-plugin-svelte3: 3.4.1_eslint@7.32.0+svelte@3.46.4 eslint-plugin-svelte3: 3.4.1_eslint@7.32.0+svelte@3.46.4
felte: 1.0.1_svelte@3.46.4 felte: 1.0.1_svelte@3.46.4
highlight.js: 11.4.0 highlight.js: 11.4.0
i18next-browser-languagedetector: 6.1.4
i18next-scanner: 3.1.0 i18next-scanner: 3.1.0
ioredis: 4.28.5 ioredis: 4.28.5
js-cookie: 3.0.1 js-cookie: 3.0.1
@@ -2279,6 +2281,15 @@ packages:
engines: { node: '>=12.0.0' } engines: { node: '>=12.0.0' }
dev: true dev: true
/i18next-browser-languagedetector/6.1.4:
resolution:
{
integrity: sha512-wukWnFeU7rKIWT66VU5i8I+3Zc4wReGcuDK2+kuFhtoxBRGWGdvYI9UQmqNL/yQH1KogWwh+xGEaIPH8V/i2Zg==
}
dependencies:
'@babel/runtime': 7.17.2
dev: true
/i18next-scanner/3.1.0: /i18next-scanner/3.1.0:
resolution: resolution:
{ {
+23 -7
View File
@@ -1,18 +1,19 @@
import i18next from 'i18next'; import i18next from 'i18next';
import translations from './translations'; import translations from './translations';
import en from './locales/en.json'; import en from './locales/en.json';
import de from './locales/de.json';
import LanguageDetector from 'i18next-browser-languagedetector';
import type { i18n, Resource } from 'i18next'; import type { i18n, Resource } from 'i18next';
const INITIAL_LANGUAGE = 'en';
export class I18nService { export class I18nService {
// expose i18next // expose i18next
i18n: i18n; i18n: i18n;
constructor() { constructor() {
this.i18n = i18next; this.i18n = i18next;
this.initialize(); this.initialize();
this.changeLanguage(INITIAL_LANGUAGE); // this.changeLanguage("de")
//this.changeLanguage(INITIAL_LANGUAGE);
} }
// Our translation function // Our translation function
@@ -22,8 +23,8 @@ export class I18nService {
// Initializing i18n // Initializing i18n
initialize() { initialize() {
this.i18n.init({ this.i18n.use(LanguageDetector).init({
lng: INITIAL_LANGUAGE, // lng: INITIAL_LANGUAGE,
fallbackLng: 'en', fallbackLng: 'en',
debug: false, debug: false,
defaultNS: 'translation', defaultNS: 'translation',
@@ -32,12 +33,27 @@ export class I18nService {
interpolation: { interpolation: {
escapeValue: false escapeValue: false
}, },
// detection: {
// order: ['browser', 'querystring', 'navigator', 'localStorage', 'htmlTag'],
// lookupQuerystring: 'lng'
// }
detection: { detection: {
order: ['browser', 'querystring', 'navigator', 'localStorage', 'htmlTag'], order: [
lookupQuerystring: 'lng' 'querystring',
'cookie',
'localStorage',
'sessionStorage',
'navigator',
'htmlTag',
'path',
'subdomain'
],
lookupQuerystring: 'lng',
lookupLocalStorage: 'language'
} }
}); });
this.i18n.addResourceBundle('en', 'translation', en); this.i18n.addResourceBundle('en', 'translation', en);
this.i18n.addResourceBundle('de', 'translation', de);
} }
changeLanguage(language: string) { changeLanguage(language: string) {
+73 -73
View File
@@ -1,75 +1,75 @@
{ {
"index_page": { "index_page": {
"meta": { "meta": {
"title": "Home", "title": "Home",
"description": "ClassQuiz ist eine Quiz-App wie KAHOOT! für Schüler*innen, welche open-source und kostenlos ist" "description": "ClassQuiz ist eine Quiz-App wie KAHOOT! für Schüler*innen, welche open-source und kostenlos ist"
}, },
"stats": "Statistiken", "stats": "Statistiken",
"features": "Features", "features": "Features",
"features_description": { "features_description": {
"1": "ClassQuiz ist eine Quiz-Platform, welche das erstellen und managen von Quizzes erlaubt.", "1": "ClassQuiz ist eine Quiz-Platform, welche das erstellen und managen von Quizzes erlaubt.",
"2": "Das Hauptfeature ist die KAHOOT!-Importfunktion, mit der man Quizzes von KAHOOT! importieren kann." "2": "Das Hauptfeature ist die KAHOOT!-Importfunktion, mit der man Quizzes von KAHOOT! importieren kann."
}, },
"slogan": "Die open-source Quiz-Platform!" "slogan": "Die open-source Quiz-Platform!"
}, },
"overview_page": { "overview_page": {
"create": "Erstellen", "create": "Erstellen",
"import": "Importieren", "import": "Importieren",
"logout": "Ausloggen", "logout": "Ausloggen",
"title": "Titel", "title": "Titel",
"created_at": "Erstellt am", "created_at": "Erstellt am",
"question_count": "Fragenanzahl", "question_count": "Fragenanzahl",
"play": "Spielen", "play": "Spielen",
"edit": "Bearbeiten", "edit": "Bearbeiten",
"delete": "Löschen", "delete": "Löschen",
"public": "Öffentlich", "public": "Öffentlich",
"start": "Starten" "start": "Starten"
}, },
"edit_page": { "edit_page": {
"save": "Speichern", "save": "Speichern",
"success_update_title": "Quiz erfolgreich aktualisiert!", "success_update_title": "Quiz erfolgreich aktualisiert!",
"success_update_body": "Das Quiz wurde erfolgreich aktualisiert!", "success_update_body": "Das Quiz wurde erfolgreich aktualisiert!",
"close": "Schließen" "close": "Schließen"
}, },
"create_page": { "create_page": {
"success": { "success": {
"title": "Quiz erfolgreich erstellt!", "title": "Quiz erfolgreich erstellt!",
"body": "Das Quiz wurde erfolgreich erstellt!" "body": "Das Quiz wurde erfolgreich erstellt!"
}, },
"close": "Schließen" "close": "Schließen"
}, },
"register_page": { "register_page": {
"greeting": "Schön, dich zu sehen!", "greeting": "Schön, dich zu sehen!",
"create_account": "Account erstellen", "create_account": "Account erstellen",
"email": "Email", "email": "Email",
"username": "Nutzername", "username": "Nutzername",
"password": "Passwort", "password": "Passwort",
"forgot_password?": "Passwort vergessen?", "forgot_password?": "Passwort vergessen?",
"register": "Registrieren", "register": "Registrieren",
"already_have_account?": "Hast du schon einen Account?", "already_have_account?": "Hast du schon einen Account?",
"login": "Login" "login": "Login"
}, },
"login_page": { "login_page": {
"welcome_back": "Willkommen zurück!", "welcome_back": "Willkommen zurück!",
"login_or_create_account": "Einloggen oder Account erstellen", "login_or_create_account": "Einloggen oder Account erstellen",
"already_have_account": "Noch kein Account?", "already_have_account": "Noch kein Account?",
"modal": { "modal": {
"success": { "success": {
"success_check_mail": "Login erfolgreich! Guck in deine Mailbox!", "success_check_mail": "Login erfolgreich! Guck in deine Mailbox!",
"success": "Login erfolgreich!", "success": "Login erfolgreich!",
"description": { "description": {
"success_check_mail": "Bitte überprüfe deine Mailbox, weil du eine Email mit einem Link, um dich einzuloggen, empfangen haben solltest.", "success_check_mail": "Bitte überprüfe deine Mailbox, weil du eine Email mit einem Link, um dich einzuloggen, empfangen haben solltest.",
"success": "Du hast dich erfolgreich angemeldet!" "success": "Du hast dich erfolgreich angemeldet!"
} }
}, },
"error": { "error": {
"wrong_creds": "Falsche Email oder falsches Passwort!", "wrong_creds": "Falsche Email oder falsches Passwort!",
"unexpected": "Unerwarteter Fehler!", "unexpected": "Unerwarteter Fehler!",
"description": { "description": {
"wrong_creds": "Bitte stelle sicher, dass dein Passwort und deine Email richtig sind!", "wrong_creds": "Bitte stelle sicher, dass dein Passwort und deine Email richtig sind!",
"unexpected": "Der gute alte unerwartete Fehler hat uns heimgesucht!" "unexpected": "Der gute alte unerwartete Fehler hat uns heimgesucht!"
} }
} }
} }
} }
} }
+1 -11
View File
@@ -4,20 +4,10 @@
import { navbarVisible } from '$lib/stores.ts'; import { navbarVisible } from '$lib/stores.ts';
import * as Sentry from '@sentry/browser'; import * as Sentry from '@sentry/browser';
import { BrowserTracing } from '@sentry/tracing'; import { BrowserTracing } from '@sentry/tracing';
import { initLocalizationContext, getLocalization } from '$lib/i18n'; import { initLocalizationContext } from '$lib/i18n';
import { browser } from '$app/env';
initLocalizationContext(); initLocalizationContext();
if (browser) {
if (localStorage.getItem('language') === null) {
localStorage.setItem('language', 'en');
} else {
const { currentLanguage } = getLocalization();
currentLanguage.set(localStorage.getItem('language'));
}
}
if (import.meta.env.VITE_SENTRY !== null) { if (import.meta.env.VITE_SENTRY !== null) {
Sentry.init({ Sentry.init({
dsn: import.meta.env.VITE_SENTRY, dsn: import.meta.env.VITE_SENTRY,