also fix paths in worker.js

[github/bastienwirtz/homer.git] / app.js

diff --git a/app.js b/app.js
index a404314df8f8911597fb9dd72c1d7e1056f04fd7..40830da1a457f3053b4ff230b54e0814c0add6a2 100644 (file)
--- a/app.js
+++ b/app.js
@@ -5,11 +5,18 @@ const app = new Vue({
         offline: false,
         filter: '',
         vlayout: true,
-        overrideDark: null
+        isDark: null
     },
     created: function () {
         let that = this;
 
+        this.isDark = 'overrideDark' in localStorage ?
+            JSON.parse(localStorage.overrideDark) : matchMedia("(prefers-color-scheme: dark)").matches;
+
+        if ('vlayout' in localStorage) {
+            this.vlayout = JSON.parse(localStorage.vlayout)
+        }
+
         this.checkOffline();
         that.getConfig().then(function (config) {
             that.config = config;
@@ -23,13 +30,6 @@ const app = new Vue({
             }
         }, false);
     },
-    computed: {
-        isDark: function() {
-            return this.overrideDark !== null
-                ? this.overrideDark
-                : matchMedia("(prefers-color-scheme: dark)").matches;
-        }
-      },
     methods: {
         checkOffline: function () {
             let that = this;
@@ -53,8 +53,13 @@ const app = new Vue({
             });
         },
         toggleTheme: function() {
-            this.overrideDark = !this.isDark;
-        }
+            this.isDark = !this.isDark;
+            localStorage.overrideDark = this.isDark; 
+        }, 
+        toggleLayout: function() {
+            this.vlayout = !this.vlayout;
+            localStorage.vlayout = this.vlayout;
+        },
     }
 });
 
@@ -80,7 +85,9 @@ Vue.component('service', {
                         <p class="subtitle is-6">{{ item.subtitle }}</p>
                     </div>
                 </div>
-                <strong class="tag" v-if="item.tag">#{{ item.tag }}</strong>
+                <div class="tag" :class="item.tagstyle" v-if="item.tag">
+                    <strong class="tag-text">#{{ item.tag }}</strong>
+                </div>
             </div>
         </a>
     </div></div>`
@@ -88,6 +95,6 @@ Vue.component('service', {
 
 if ('serviceWorker' in navigator) {
     window.addEventListener('load', function () {
-        navigator.serviceWorker.register('/worker.js');
+        navigator.serviceWorker.register('worker.js');
     });
 }