feat(SettingsPage): implement debug options

2 files changed, 21 insertions, 3 deletions

diff --git a/src/components/EditPage.vue b/src/components/EditPage.vue
index b4c351a..71d1e6b 100644
--- a/src/components/EditPage.vue
+++ b/src/components/EditPage.vue
@@ -169,9 +169,6 @@ export default {
     writeToLS() {
       localStorage.setItem("LSData", JSON.stringify(this.LSData));
     },
-    clearLS() {
-      localStorage.clear();
-    },
   },
 
   watch: {
diff --git a/src/components/SettingsPage.vue b/src/components/SettingsPage.vue
index b25a377..9bea340 100644
--- a/src/components/SettingsPage.vue
+++ b/src/components/SettingsPage.vue
@@ -41,6 +41,17 @@
         </v-card-text>
       </v-window-item>
       <v-window-item :value="3">
+        <v-textarea height="300" no-resize readonly :value="debugLog">
+        </v-textarea>
+        <v-card-actions class="d-flex justify-space-around">
+          <v-btn variant="outlined" @click="showLSDebug"
+            >Show LocalStorage Content</v-btn
+          >
+          <v-btn variant="outlined" @click="clearLS">Clear LocalStorage</v-btn>
+          <v-btn variant="outlined" @click="debugLog = ''">Clear Output</v-btn>
+        </v-card-actions>
+      </v-window-item>
+      <v-window-item :value="4">
         <v-card-text>
           <span class="text-h2">Card</span>
         </v-card-text>
@@ -62,6 +73,8 @@ export default {
           return "MainPage Settings";
         case 2:
           return "Background Settings";
+        case 3:
+          return "Developer Settings";
         default:
           return "About Otonashi";
       }
@@ -96,6 +109,7 @@ export default {
     backgroundImageURL: "",
     titleSize: 35,
     contentSize: "text-h5",
+    debugLog: "",
     location: 1,
   }),
 
@@ -112,6 +126,13 @@ export default {
         JSON.stringify(this.backgroundImageURL)
       );
     },
+    clearLS() {
+      localStorage.clear();
+      this.debugLog += "LocalStorage cleared.\n";
+    },
+    showLSDebug() {
+      this.debugLog += `LS in JSON format: ${JSON.stringify(localStorage)}\n`;
+    },
   },
 };
 </script>