diff --git a/src/App.vue b/src/App.vue index 63e9a66..d57b87c 100644 --- a/src/App.vue +++ b/src/App.vue @@ -11,13 +11,11 @@ import config from "./assets/config"; export default { name: "App", + beforeMount() { + // Set language + this.$i18n.locale = this.$store.state.language || "en"; + }, mounted() { - // Set RTL mode if flag given in config. TODO: this should be based on language, not a global setting. - // - if (config.rtl) { - this.$vuetify.rtl = true; - document.documentElement.setAttribute("dir", "rtl"); - } if ( window.location.protocol == "http" && !window.location.hostname.endsWith(".onion") @@ -63,6 +61,20 @@ export default { }, }, watch: { + "$i18n.locale": { + handler(val) { + // Locale changed, check file if RTL + var isRTL = this.$i18n.messages[val].language_is_rtl || false; + if (isRTL) { + this.$vuetify.rtl = true; + document.documentElement.setAttribute("dir", "rtl"); + } else { + this.$vuetify.rtl = false; + document.documentElement.removeAttribute("dir"); + } + }, + immediate: true, + }, title(title) { document.title = title; }, diff --git a/src/assets/translations/en.json b/src/assets/translations/en.json index 3142840..d8f6962 100644 --- a/src/assets/translations/en.json +++ b/src/assets/translations/en.json @@ -1,4 +1,5 @@ { + "language_display_name": "English", "Keanu Weblite": "Keanu Weblite", "menu": { "start_private_chat": "Private chat with this user", @@ -113,6 +114,7 @@ "set_password": "Set password", "change_name": "Change name", "change_password": "Change password", + "select_language": "Language", "password_old": "Old password", "password_new": "New password", "password_repeat": "Repeat new password", diff --git a/src/assets/translations/es.json b/src/assets/translations/es.json index 130d099..acf51ec 100644 --- a/src/assets/translations/es.json +++ b/src/assets/translations/es.json @@ -1,4 +1,5 @@ { + "language_display_name": "Español", "room_info": { "identity": "Has iniciado sesión como {displayName}.", "my_profile": "Mi perfil", @@ -183,4 +184,4 @@ "view_details": "Ver detalles", "this_room": "Este grupo" } -} +} \ No newline at end of file diff --git a/src/assets/translations/ug.json b/src/assets/translations/ug.json index 28745e2..4db410e 100644 --- a/src/assets/translations/ug.json +++ b/src/assets/translations/ug.json @@ -1,4 +1,5 @@ { + "language_is_rtl": true, "menu": { "ok": "تامام", "download": "چۈشۈرۈش", @@ -6,4 +7,4 @@ "edit": "تەھرىر" }, "Keanu Weblite": "Keanu Weblite" -} +} \ No newline at end of file diff --git a/src/components/Profile.vue b/src/components/Profile.vue index fa85bc4..3d7fe06 100644 --- a/src/components/Profile.vue +++ b/src/components/Profile.vue @@ -62,6 +62,11 @@ :icon="'edit'" :text="$t('profile.change_name')" /> + @@ -138,10 +143,16 @@ + + + + diff --git a/src/store/index.js b/src/store/index.js index 8bcc535..1c63471 100644 --- a/src/store/index.js +++ b/src/store/index.js @@ -37,6 +37,7 @@ const vuexPersistLocalStorage = new VuexPersist({ reducer: state => { if (state.useLocalStorage) { return { + language: state.language, currentRoomId: state.currentRoomId, }; } else { @@ -51,6 +52,7 @@ const vuexPersistSessionStorage = new VuexPersist({ reducer: state => { if (!state.useLocalStorage) { return { + language: state.language, currentRoomId: state.currentRoomId, }; } else { @@ -62,7 +64,7 @@ const vuexPersistSessionStorage = new VuexPersist({ const defaultUseSessionStorage = (sessionStorage.getItem('user') != null); export default new Vuex.Store({ - state: { currentRoomId: null, auth: null, tempuser: null, useLocalStorage: !defaultUseSessionStorage }, + state: { language: 'en', currentRoomId: null, auth: null, tempuser: null, useLocalStorage: !defaultUseSessionStorage }, mutations: { loginSuccess(state, user) { state.auth.status.loggedIn = true; @@ -76,6 +78,9 @@ export default new Vuex.Store({ state.auth.status.loggedIn = false; state.auth.user = null; }, + setLanguage(state, locale) { + state.language = locale; + }, setCurrentRoomId(state, roomId) { state.currentRoomId = roomId; },