commit: 1d64b7621176e25fedd98553c282c56242d38571
parent: 340b21475d94542e1ddb7c34f192749c229b58eb
Author: Roger Braun <roger@rogerbraun.net>
Date: Tue, 14 Feb 2017 22:21:23 +0100
Add basic configuration module, make it work for title and theme.
Diffstat:
6 files changed, 47 insertions(+), 10 deletions(-)
diff --git a/src/App.js b/src/App.js
@@ -16,7 +16,8 @@ export default {
}),
computed: {
currentUser () { return this.$store.state.users.currentUser },
- style () { return { 'background-image': `url(${this.currentUser.background_image})` } }
+ style () { return { 'background-image': `url(${this.currentUser.background_image})` } },
+ sitename () { return this.$store.state.config.name }
},
methods: {
activatePanel (panelName) {
diff --git a/src/App.vue b/src/App.vue
@@ -3,7 +3,7 @@
<nav class='container base01-background base04'>
<div class='inner-nav'>
<div class='item'>
- <a route-to='friends-timeline' href="#">Pleroma FE</a>
+ <a route-to='friends-timeline' href="#">{{sitename}}</a>
</div>
<style-switcher></style-switcher>
</div>
diff --git a/src/components/style_switcher/style_switcher.js b/src/components/style_switcher/style_switcher.js
@@ -1,5 +1,3 @@
-import StyleSetter from '../../services/style_setter/style_setter.js'
-
export default {
data: () => ({
availableStyles: [],
@@ -13,8 +11,7 @@ export default {
},
watch: {
selected () {
- const fullPath = `/static/css/${this.selected}`
- StyleSetter.setStyle(fullPath)
+ this.$store.dispatch('setOption', { name: 'theme', value: this.selected })
}
}
}
diff --git a/src/main.js b/src/main.js
@@ -12,11 +12,10 @@ import UserProfile from './components/user_profile/user_profile.vue'
import statusesModule from './modules/statuses.js'
import usersModule from './modules/users.js'
import apiModule from './modules/api.js'
+import configModule from './modules/config.js'
import VueTimeago from 'vue-timeago'
-import StyleSetter from './services/style_setter/style_setter.js'
-
Vue.use(Vuex)
Vue.use(VueRouter)
Vue.use(VueTimeago, {
@@ -30,7 +29,8 @@ const store = new Vuex.Store({
modules: {
statuses: statusesModule,
users: usersModule,
- api: apiModule
+ api: apiModule,
+ config: configModule
}
})
@@ -61,4 +61,9 @@ new Vue({
components: { App }
})
-StyleSetter.setStyle('/static/css/base16-solarized-light.css')
+window.fetch('/static/config.json')
+ .then((res) => res.json())
+ .then(({name, theme}) => {
+ store.dispatch('setOption', { name: 'name', value: name })
+ store.dispatch('setOption', { name: 'theme', value: theme })
+ })
diff --git a/src/modules/config.js b/src/modules/config.js
@@ -0,0 +1,30 @@
+import { set } from 'vue'
+import StyleSetter from '../services/style_setter/style_setter.js'
+
+const defaultState = {
+ name: 'Pleroma FE'
+}
+
+const config = {
+ state: defaultState,
+ mutations: {
+ setOption (state, { name, value }) {
+ set(state, name, value)
+ }
+ },
+ actions: {
+ setOption ({ commit }, { name, value }) {
+ commit('setOption', {name, value})
+ switch (name) {
+ case 'name':
+ document.title = value
+ break
+ case 'theme':
+ const fullPath = `/static/css/${value}`
+ StyleSetter.setStyle(fullPath)
+ }
+ }
+ }
+}
+
+export default config
diff --git a/static/config.json b/static/config.json
@@ -0,0 +1,4 @@
+{
+ "name": "Pleroma FE",
+ "theme": "base16-ashes.css"
+}