From e298a17ab7418f900813e983564c6694d879bc0c Mon Sep 17 00:00:00 2001 From: Spythere Date: Tue, 1 Jul 2025 16:20:25 +0200 Subject: [PATCH] chore: added loading locale from browser data --- src/App.vue | 52 +++++++++++++++++++++++++++++---- src/managers/storageManager.ts | 53 ++++++++++++++++++++++++++++++++++ src/store/store.ts | 2 ++ 3 files changed, 101 insertions(+), 6 deletions(-) create mode 100644 src/managers/storageManager.ts diff --git a/src/App.vue b/src/App.vue index d5399c5..2405202 100644 --- a/src/App.vue +++ b/src/App.vue @@ -22,6 +22,7 @@ import { defineComponent } from 'vue'; import packageInfo from '../package.json'; import { useStore } from './store/store'; import orderStorageMixin from './mixins/orderStorageMixin'; +import StorageManager from './managers/storageManager'; export default defineComponent({ mixins: [orderStorageMixin], @@ -31,20 +32,59 @@ export default defineComponent({ return { offlineReady, needRefresh, updateServiceWorker }; }, + data() { return { appVersion: packageInfo.version, store: useStore() }; }, created() { - document.title = `GeneraTOR ${this.appVersion}`; - this.store.orderDarkMode = this.getOrderSetting('dark-mode') === 'true'; + this.init(); + }, - const query = new URLSearchParams(window.location.search); + methods: { + init() { + this.loadLang(); + this.loadSettings(); + this.handleQueries(); + }, - const id = query.get('sceneryId'); + loadSettings() { + document.title = `GeneraTOR ${this.appVersion}`; + this.store.orderDarkMode = this.getOrderSetting('dark-mode') === 'true'; + }, - if (id != null) { - this.store.orderMode = 'OrderTrainPicker'; + handleQueries() { + const query = new URLSearchParams(window.location.search); + + const id = query.get('sceneryId'); + + if (id != null) { + this.store.orderMode = 'OrderTrainPicker'; + } + }, + + changeLang(lang: string) { + this.$i18n.locale = lang; + this.store.currentAppLocale = lang; + + StorageManager.setStringValue('lang', lang); + }, + + loadLang() { + const storageLang = StorageManager.getStringValue('lang'); + + if (storageLang) { + this.changeLang(storageLang); + return; + } + + if (!window.navigator.language) return; + + const naviLanguage = window.navigator.language.toString(); + + if (!naviLanguage.startsWith('pl')) { + this.changeLang('en'); + } } } }); diff --git a/src/managers/storageManager.ts b/src/managers/storageManager.ts new file mode 100644 index 0000000..5675524 --- /dev/null +++ b/src/managers/storageManager.ts @@ -0,0 +1,53 @@ +export default class StorageManager { + static registerStorage(name: string) { + window.localStorage.setItem(name, '1'); + } + + static unregisterStorage(name: string) { + window.localStorage.removeItem(name); + } + + static isRegistered(name: string) { + return window.localStorage.getItem(name) ? true : false; + } + + static setBooleanValue(key: string, val: boolean) { + window.localStorage.setItem(key, val.toString()); + } + + static setNumericValue(key: string, val: number) { + window.localStorage.setItem(key, val.toString()); + } + + static setStringValue(key: string, val: string) { + window.localStorage.setItem(key, val); + } + + static setValue(key: string, val: any) { + if (typeof val == 'boolean') this.setBooleanValue(key, val); + else if (typeof val == 'number') this.setNumericValue(key, val); + else if (typeof val == 'string') this.setStringValue(key, val); + else this.setStringValue(key, val); + } + + static removeValue(key: string) { + window.localStorage.removeItem(key); + } + + static getValue(key: string) { + return window.localStorage.getItem(key); + } + + static getBooleanValue(key: string): boolean { + return window.localStorage.getItem(key) === 'true' ? true : false; + } + + static getStringValue(key: string): string { + return window.localStorage.getItem(key) || ''; + } + + static getNumericValue(key: string): number { + const itemValue = window.localStorage.getItem(key); + return itemValue ? parseInt(itemValue) : 0; + } +} diff --git a/src/store/store.ts b/src/store/store.ts index cdbf74c..cbe4cc2 100644 --- a/src/store/store.ts +++ b/src/store/store.ts @@ -9,6 +9,8 @@ import { export const useStore = defineStore('store', { state: () => { return { + currentAppLocale: 'pl', + helperModalOpen: false, orderDarkMode: false,