aboutsummaryrefslogtreecommitdiff
path: root/src/components/SettingsPage.vue
diff options
context:
space:
mode:
Diffstat (limited to 'src/components/SettingsPage.vue')
-rw-r--r--src/components/SettingsPage.vue45
1 files changed, 43 insertions, 2 deletions
diff --git a/src/components/SettingsPage.vue b/src/components/SettingsPage.vue
index 8dc35b1..79a92fe 100644
--- a/src/components/SettingsPage.vue
+++ b/src/components/SettingsPage.vue
@@ -30,6 +30,23 @@
</v-card-text>
</v-window-item>
<v-window-item :value="2">
+ <v-card-text>
+ <v-text-field
+ label="Background Image URL"
+ prepend-icon="mdi-image"
+ variant="outlined"
+ shaped
+ v-model="backgroundImageURL"
+ ></v-text-field>
+ </v-card-text>
+ <v-card-actions class="d-flex justify-space-around">
+ <v-btn variant="outlined" @click="saveBackgroundImageURL">Save</v-btn>
+ <v-btn variant="outlined" @click="resetBackgroundImageURL"
+ >Reset</v-btn
+ >
+ </v-card-actions>
+ </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">
@@ -40,7 +57,7 @@
<v-btn variant="outlined" @click="debugLog = ''">Clear Output</v-btn>
</v-card-actions>
</v-window-item>
- <v-window-item :value="3">
+ <v-window-item :value="4">
<v-card-text>
<span class="text-h6"
>Otonashi is a simple, easy-to-use classboard app, built by 135e2
@@ -58,7 +75,7 @@
export default {
name: "SettingsPage",
props: ["realTitleSize", "realContentSize"],
- emits: ["updateTitleSize", "updateContentSize"],
+ emits: ["updateTitleSize", "updateContentSize", "updateBackgroundImageURL"],
computed: {
currentTitle() {
@@ -66,6 +83,8 @@ export default {
case 1:
return "MainPage Settings";
case 2:
+ return "Background Settings";
+ case 3:
return "Developer Settings";
default:
return "About Otonashi";
@@ -85,6 +104,7 @@ export default {
},
mounted() {
+ this.loadFromLS();
// Sync titleSize with realTitleSize
this.titleSize = this.realTitleSize;
// Same
@@ -92,6 +112,7 @@ export default {
},
data: () => ({
+ backgroundImageURL: "",
titleSize: 35,
contentSize: "text-h5",
debugLog: "",
@@ -100,6 +121,17 @@ export default {
methods: {
// LocalStorage
+ loadFromLS() {
+ this.backgroundImageURL =
+ JSON.parse(localStorage.getItem("backgroundImageURL")) ||
+ this.backgroundImageURL;
+ },
+ writeToLS() {
+ localStorage.setItem(
+ "backgroundImageURL",
+ JSON.stringify(this.backgroundImageURL)
+ );
+ },
clearLS() {
localStorage.clear();
this.debugLog += "LocalStorage cleared.\n";
@@ -107,6 +139,15 @@ export default {
showLSDebug() {
this.debugLog += `LS in JSON format: ${JSON.stringify(localStorage)}\n`;
},
+ saveBackgroundImageURL() {
+ this.$emit("updateBackgroundImageURL", this.backgroundImageURL);
+ this.writeToLS();
+ },
+ resetBackgroundImageURL() {
+ // Reset URL and emit event.
+ this.backgroundImageURL = "";
+ this.saveBackgroundImageURL();
+ },
},
};
</script>