From 1d64b7621176e25fedd98553c282c56242d38571 Mon Sep 17 00:00:00 2001
From: Roger Braun <roger@rogerbraun.net>
Date: Tue, 14 Feb 2017 22:21:23 +0100
Subject: [PATCH] Add basic configuration module, make it work for title and
 theme.

---
 src/App.js                                    |  3 +-
 src/App.vue                                   |  2 +-
 .../style_switcher/style_switcher.js          |  5 +---
 src/main.js                                   | 13 +++++---
 src/modules/config.js                         | 30 +++++++++++++++++++
 static/config.json                            |  4 +++
 6 files changed, 47 insertions(+), 10 deletions(-)
 create mode 100644 src/modules/config.js
 create mode 100644 static/config.json

diff --git a/src/App.js b/src/App.js
index 14a41af0..c326ddfc 100644
--- 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
index 5d5463fb..d2b07d2b 100644
--- 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
index 8a8cc2a0..954e2ff0 100644
--- 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
index c187ffd6..fb48a64d 100644
--- 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
new file mode 100644
index 00000000..4365d554
--- /dev/null
+++ 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
new file mode 100644
index 00000000..058c9875
--- /dev/null
+++ b/static/config.json
@@ -0,0 +1,4 @@
+{
+  "name": "Pleroma FE",
+  "theme": "base16-ashes.css"
+}