oxen-io/oxen-electron-gui-wallet
1
0
Fork 0
mirror of https://github.com/oxen-io/oxen-electron-gui-wallet.git synced 2023-12-14 06:13:02 +01:00
Code Issues Projects Releases Wiki Activity

Added language selection.

Browse source
This commit is contained in:
Mikunj 2019-04-11 16:30:24 +10:00
parent 6ee9827ae1
commit 8a3e8044d3
11 changed files with 134 additions and 16 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
package-lock.json generated
View file

@ -6866,6 +6866,11 @@
}
}
},
"flag-icon-css": {
"version": "3.3.0",
"resolved": "https://registry.npmjs.org/flag-icon-css/-/flag-icon-css-3.3.0.tgz",
"integrity": "sha512-u5lCGVExrJJRykNGd//ZrBU5Bkt0LTZJFSuG+Az/pwcHgzDeFwomwFbsgVtI1aJd6ysyHsx+5UGrA+nhSGd4yw=="
},
"flat-cache": {
"version": "2.0.1",
"resolved": "https://registry.npmjs.org/flat-cache/-/flat-cache-2.0.1.tgz",

1
package.json
View file

@ -18,6 +18,7 @@
"axios": "^0.18.0",
"electron-is-dev": "^1.0.1",
"electron-window-state": "^5.0.3",
"flag-icon-css": "^3.3.0",
"fs-extra": "^7.0.1",
"object-assign-deep": "^0.4.0",
"portscanner": "^2.2.0",

3
quasar.conf.js
View file

@ -11,7 +11,8 @@ module.exports = function (ctx) {
"timeago"
],
css: [
"app.styl"
"app.styl",
"~flag-icon-css/css/flag-icon.min.css"
],
extras: [
ctx.theme.mat ? "roboto-font" : null,

3
src-electron/main-process/modules/backend.js
View file

@ -181,6 +181,9 @@ export class Backend {
let params = data.data
switch (data.method) {
case "set_language":
this.send("set_language", { lang: params.lang })
break
case "quick_save_config":
// save only partial config settings
Object.keys(params).map(key => {

54
src/components/language_select.vue Normal file
View file

@ -0,0 +1,54 @@
<template>
<div class="language-select column items-center justify-center">
<h6 class="q-my-md" style="font-weight: 300">{{ $t("strings.selectLanguage") }}:</h6>
<div class="row justify-center">
<q-btn
class="row justify-center items-center"
v-for="option in options"
:key="option.value"
:color="lang === option.value ? 'primary' : 'secondary'"
@click="setLanguage(option.value)"
size="md"
>
<span :class="`flag-icon flag-icon-${option.flag}`" />
<span>{{ option.label }}</span>
</q-btn>
</div>
</div>
</template>
<script>
export default {
name: "LanguageSelect",
data () {
return {
options: [
{ label: "English", value: "en-us", flag: "us" },
]
}
},
computed: {
lang () {
return this.$i18n.locale
}
},
methods: {
setLanguage(lang) {
this.$gateway.send("core", "set_language", { lang })
this.$emit('select', lang)
}
},
}
</script>
<style lang="scss">
.language-select {
.q-btn {
margin: 2px;
}
.flag-icon {
margin-right: 4px;
}
}
</style>

12
src/components/settings.vue
View file

@ -53,6 +53,10 @@
</div>
<div v-if="page === 'language'">
<language-select />
</div>
</q-modal-layout>
</q-modal>
@ -61,6 +65,8 @@
<script>
import { mapState } from "vuex"
import SettingsGeneral from "components/settings_general"
import LanguageSelect from "components/language_select"
export default {
name: "SettingsModal",
computed: mapState({
@ -71,10 +77,11 @@ export default {
tabs: function(state) {
const { app, daemons } = state.gateway.app.config;
let tabs = [
{label: this.$t("titles.settings.tabs.general"), value: 'general', icon: 'settings'},
{ label: this.$t("titles.settings.tabs.general"), value: 'general', icon: 'settings' },
{ label: this.$t("titles.settings.tabs.language"), value: 'language', icon: 'language' },
]
if(daemons[app.net_type].type != 'remote') {
tabs.push({label: this.$t("titles.settings.tabs.peers"), value: 'peers', icon: 'cloud_queue'})
tabs.push({ label: this.$t("titles.settings.tabs.peers"), value: 'peers', icon: 'cloud_queue' })
}
return tabs
}
@ -139,6 +146,7 @@ export default {
}
},
components: {
LanguageSelect,
SettingsGeneral
}
}

22
src/gateway/gateway.js
View file

@ -2,7 +2,7 @@ import { ipcRenderer } from "electron"
import { Notify, Dialog, Loading, LocalStorage } from "quasar"
import { EventEmitter } from "events"
import { SCEE } from "./SCEE-Node"
import { i18n } from "src/plugins/i18n"
import { i18n, changeLanguage } from "src/plugins/i18n"
export class Gateway extends EventEmitter {
constructor (app, router) {
@ -12,6 +12,10 @@ export class Gateway extends EventEmitter {
this.token = null
this.scee = new SCEE()
// Set the initial language
let language = LocalStorage.has("language") ? LocalStorage.get.item("language") : "en-us"
this.setLanguage(language)
let theme = LocalStorage.has("theme") ? LocalStorage.get.item("theme") : "dark"
this.app.store.commit("gateway/set_app_data", {
config: {
@ -104,6 +108,10 @@ export class Gateway extends EventEmitter {
!decrypted_data.hasOwnProperty("data")) { return }
switch (decrypted_data.event) {
case "set_language":
const { lang } = decrypted_data.data
this.setLanguage(lang)
break
case "set_has_password":
this.emit("has_password", decrypted_data.data)
break
@ -184,4 +192,16 @@ export class Gateway extends EventEmitter {
break
}
}
setLanguage (lang) {
changeLanguage(lang).then(() => {
LocalStorage.set("language", lang)
}).catch(() => {
Notify.create({
type: "negative",
timeout: 2000,
message: i18n.t("notification.errors.failedToSetLanguage", { lang })
})
})
}
}

3
src/i18n/en-us.js
View file

@ -251,6 +251,7 @@ export default {
enterWalletName: "Enter a wallet name",
errorSavingItem: "Error saving {item}",
failedServiceNodeUnlock: "Failed to unlock service node",
failedToSetLanguage: "Failed to set language: {lang}",
failedWalletImport: "Failed to import wallet",
failedWalletOpen: "Failed to open wallet. Please try again.",
internalError: "Internal error",
@ -355,6 +356,7 @@ export default {
saveSeedWarning: "Please copy and save these in a secure location!",
saveToAddressBook: "Save to address book",
seedWords: "Seed words",
selectLanguage: "Select language",
serviceNodeRegistrationDescription: "Enter the {registerCommand} command produced by the daemon that is registering to become a Service Node using the \"{prepareCommand}\" command",
spendKey: "Spend key",
startingDaemon: "Starting daemon",
@ -407,6 +409,7 @@ export default {
title: "Settings",
tabs: {
general: "General",
language: "Language",
peers: "Peers"
}
},

2
src/i18n/index.js
View file

@ -1,3 +1,5 @@
// LOKI: DO NOT MODIFY THIS FILE
// LANGUAGE FILES CAN BE DYNAMICALLY LOADED
import enUS from "./en-us"
export default {

20
src/pages/init/welcome.vue
View file

@ -10,17 +10,10 @@
<div>Wallet Version: v{{version}}</div>
<div>Deamon Version: v{{daemonVersion}}</div>
<h6 class="q-mb-md" style="font-weight: 300">Select language:</h6>
<q-btn
color="primary"
size="md"
icon="language"
label="English"
@click="clickNext()"
<language-select
class="q-mt-lg"
v-on:select="onLanguageSelected"
/>
<p class="q-mt-md">More languages coming soon</p>
</div>
</q-step>
@ -56,7 +49,9 @@
<script>
import { version, daemonVersion } from "../../../package.json"
import { mapState } from "vuex"
import LanguageSelect from "components/language_select"
import SettingsGeneral from "components/settings_general"
export default {
computed: mapState({
theme: state => state.gateway.app.config.appearance.theme,
@ -68,7 +63,6 @@ export default {
data() {
return {
is_first_page: true,
choose_lang: "EN",
version: "",
daemonVersion: ""
}
@ -100,8 +94,12 @@ export default {
clickPrev () {
this.$refs.stepper.previous();
},
onLanguageSelected (lang) {
this.clickNext()
}
},
components: {
LanguageSelect,
SettingsGeneral
}
}

25
src/plugins/i18n.js
View file

@ -1,5 +1,6 @@
import VueI18n from "vue-i18n"
import messages from "src/i18n"
import { Quasar } from "quasar"
let i18n
@ -19,4 +20,26 @@ export default ({
i18n = app.i18n
}
export { i18n }
const changeLanguage = (lang) => {
const quasarLang = Quasar.i18n.lang
return new Promise((resolve, reject) => {
import(`src/i18n/${lang}`).then(({ default: messages }) => {
i18n.locale = lang
i18n.setLocaleMessage(lang, messages)
// Setting the quasar language is optional
// There may be cases where they don't have the language
import(`quasar-framework/i18n/${lang}`).then(lang => {
quasarLang.set(lang.default)
}).catch(() => {
console.warn(`Failed to set quasar language: ${lang}`)
}).finally(() => {
resolve(lang)
})
}).catch(() => {
reject(new Error("Language not found"))
})
})
}
export { i18n, changeLanguage }