Add styleSwitcher.

2 files changed, 27 insertions, 0 deletions

diff --git a/src/components/style_switcher/style_switcher.js b/src/components/style_switcher/style_switcher.js
new file mode 100644
index 00000000..8a8cc2a0
--- /dev/null
+++ b/src/components/style_switcher/style_switcher.js
@@ -0,0 +1,20 @@
+import StyleSetter from '../../services/style_setter/style_setter.js'
+
+export default {
+  data: () => ({
+    availableStyles: [],
+    selected: false
+  }),
+  created () {
+    const self = this
+    window.fetch('/static/css/themes.json')
+      .then((data) => data.json())
+      .then((themes) => { self.availableStyles = themes })
+  },
+  watch: {
+    selected () {
+      const fullPath = `/static/css/${this.selected}`
+      StyleSetter.setStyle(fullPath)
+    }
+  }
+}
diff --git a/src/components/style_switcher/style_switcher.vue b/src/components/style_switcher/style_switcher.vue
new file mode 100644
index 00000000..8c32ed07
--- /dev/null
+++ b/src/components/style_switcher/style_switcher.vue
@@ -0,0 +1,7 @@
+<template>
+  <select v-model="selected">
+    <option v-for="style in availableStyles" >{{style}}</option>
+  </select>
+</template>
+
+<script src="./style_switcher.js"></script>