Verified Commit 8926d930 authored by Eliot Berriot's avatar Eliot Berriot
Browse files

See #161: can now persist language in local storage

parent 869b6c4f
...@@ -57,6 +57,18 @@ ...@@ -57,6 +57,18 @@
<translate>The funkwhale logo was kindly designed and provided by Francis Gading.</translate> <translate>The funkwhale logo was kindly designed and provided by Francis Gading.</translate>
</p> </p>
</div> </div>
<div class="three wide column">
<h4 v-translate class="ui header">Options</h4>
<div class="ui form">
<div class="ui field">
<label>{{ $gettext('Change language') }}</label>
<select class="ui dropdown" v-model="$language.current">
<option v-for="(language, key) in $language.available" :value="key">{{ language }}</option>
</select>
</div>
</div>
</div>
</div> </div>
</div> </div>
</div> </div>
...@@ -144,6 +156,9 @@ export default { ...@@ -144,6 +156,9 @@ export default {
'$store.state.instance.instanceUrl' () { '$store.state.instance.instanceUrl' () {
this.$store.dispatch('instance/fetchSettings') this.$store.dispatch('instance/fetchSettings')
this.fetchNodeInfo() this.fetchNodeInfo()
},
'$language.current' (newValue) {
this.$store.commit('ui/currentLanguage', newValue)
} }
} }
} }
......
...@@ -32,16 +32,20 @@ window.$ = window.jQuery = require('jquery') ...@@ -32,16 +32,20 @@ window.$ = window.jQuery = require('jquery')
// require('./semantic/semantic.css') // require('./semantic/semantic.css')
require('semantic-ui-css/semantic.js') require('semantic-ui-css/semantic.js')
require('masonry-layout') require('masonry-layout')
let availableLanguages = (function () {
let l = {}
locales.locales.forEach(c => {
l[c.code] = c.label
})
return l
})()
let defaultLanguage = 'en_US'
if (availableLanguages[store.state.ui.currentLanguage]) {
defaultLanguage = store.state.ui.currentLanguage
}
Vue.use(GetTextPlugin, { Vue.use(GetTextPlugin, {
availableLanguages: (function () { availableLanguages: availableLanguages,
let l = {} defaultLanguage: defaultLanguage,
locales.locales.forEach(c => {
l[c.code] = c.label
})
return l
})(),
defaultLanguage: 'en_US',
languageVmMixin: { languageVmMixin: {
computed: { computed: {
currentKebabCase: function () { currentKebabCase: function () {
......
...@@ -36,6 +36,10 @@ export default new Vuex.Store({ ...@@ -36,6 +36,10 @@ export default new Vuex.Store({
key: 'instance', key: 'instance',
paths: ['instance.events', 'instance.instanceUrl'] paths: ['instance.events', 'instance.instanceUrl']
}), }),
createPersistedState({
key: 'ui',
paths: ['ui.currentLanguage']
}),
createPersistedState({ createPersistedState({
key: 'radios', key: 'radios',
paths: ['radios'], paths: ['radios'],
......
...@@ -3,6 +3,7 @@ import axios from 'axios' ...@@ -3,6 +3,7 @@ import axios from 'axios'
export default { export default {
namespaced: true, namespaced: true,
state: { state: {
currentLanguage: 'en_US',
lastDate: new Date(), lastDate: new Date(),
maxMessages: 100, maxMessages: 100,
messageDisplayDuration: 10000, messageDisplayDuration: 10000,
...@@ -13,6 +14,9 @@ export default { ...@@ -13,6 +14,9 @@ export default {
} }
}, },
mutations: { mutations: {
currentLanguage: (state, value) => {
state.currentLanguage = value
},
computeLastDate: (state) => { computeLastDate: (state) => {
state.lastDate = new Date() state.lastDate = new Date()
}, },
......
Supports Markdown
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment