theme fetch fix, startup progress messages, hot rebuild timer, disabled multiline linting rule because annoying

NUXT/.eslintrc.js

@@ -15,7 +15,10 @@ module.exports = {
   ],
   plugins: ["vue"],
   rules: {
+    // "max-len": "off",
+    // "vue/max-attributes-per-line": "off",
     "vue/multi-word-component-names": 0,
+    "prettier/prettier": "off",
     "no-console": process.env.NODE_ENV === "production" ? "warn" : "off",
     "no-debugger": process.env.NODE_ENV === "production" ? "warn" : "off",
     // 'prettier/prettier': ['error', { semi: false }],

NUXT/pages/index.vue

@@ -9,6 +9,7 @@
     />
     <div style="height: 5rem" />
     <v-progress-linear rounded height="8" indeterminate color="primary" />
+    <div class="pt-2">{{ progressMsg }}...</div>
   </center>
 </template>
 
@@ -17,6 +18,7 @@ export default {
   layout: "empty",
 
   data: () => ({
+    progressMsg: "Theming",
     themeFetched: false,
   }),
 
@@ -31,35 +33,32 @@ export default {
     // Set timeout is required for $vuetify.theme... dont ask me why -Front
     const theming = new Promise((resolve) =>
       setTimeout(() => {
-        const dark = localStorage.getItem("darkTheme");
-        let bg = null;
-        let pr = null;
-        if (dark !== null) {
-          bg = dark
-            ? localStorage.getItem("backgroundDark")
-            : localStorage.getItem("backgroundLight");
-          pr = dark
-            ? localStorage.getItem("primaryDark")
-            : localStorage.getItem("primaryLight");
-          this.$vuetify.theme.dark = dark === "true";
-          if (pr !== null) this.$vuetify.theme.currentTheme.primary = pr;
-          if (bg !== null) this.$vuetify.theme.currentTheme.background = bg;
-        }
+        this.$vuetify.theme.dark = JSON.parse(localStorage.getItem("darkTheme")) === true;
+        if (localStorage.getItem("primaryDark") != null)
+          this.$vuetify.theme.themes.dark.primary = localStorage.getItem("primaryDark");
+        if (localStorage.getItem("primaryLight") != null)
+          this.$vuetify.theme.themes.light.primary = localStorage.getItem("primaryLight");
+        if (localStorage.getItem("backgroundDark") != null)
+          this.$vuetify.theme.themes.dark.background = localStorage.getItem("backgroundDark");
+        if (localStorage.getItem("backgroundLight") != null)
+          this.$vuetify.theme.themes.light.background = localStorage.getItem("backgroundLight");
         this.themeFetched = true;
         this.$vuetube.navigationBar.setTheme(
           this.$vuetify.theme.currentTheme.background,
-          !dark
+          !this.$vuetify.theme.dark
         );
         this.$vuetube.statusBar.setTheme(
           this.$vuetify.theme.currentTheme.background,
-          dark
+          this.$vuetify.theme.dark
         );
         resolve();
       }, 0)
     );
 
     await theming;
+    this.progressMsg = "Fetching the API";
     await this.$youtube.getAPI();
+    this.progressMsg = "Navigating Home";
     this.$router.push(`/${localStorage.getItem("startPage") || "home"}`);
   },
 };

NUXT/pages/mods/theme.vue

@@ -177,7 +177,6 @@ export default {
         this.$vuetify.theme.dark
           ? localStorage.setItem("primaryDark", value)
           : localStorage.setItem("primaryLight", value);
-        console.log(value);
         let tempD = this.experimentalDark;
         let tempL = this.experimentalLight;
         this.$nextTick(() => {

NUXT/plugins/vuetube.js

@@ -56,11 +56,11 @@ const module = {
     async setBackground(color) {
       return await StatusBar.setBackgroundColor({ color });
     },
-    setTheme(color, dark) {
-      StatusBar.setBackgroundColor({ color });
+    async setTheme(color, dark) {
       dark
         ? StatusBar.setStyle({ style: Style.Dark })
         : StatusBar.setStyle({ style: Style.Light });
+      StatusBar.setBackgroundColor({ color });
     },
   },
 

scripts/hot.sh

@@ -9,7 +9,7 @@ function hot {
     while true; do
       b=`ls -lahR $* | grep -v 'node_modules'`
       # to avoid confusing myself with nested-if - it is a "short form" of doing a=$b; eval $script if $a != $b.
-      [[ $a != $b ]] && a=$b && eval $script;
+      [[ $a != $b ]] && a=$b && eval time $script;
       sleep .5;
     done
   fi