diff options
| -rw-r--r-- | src/App.vue | 49 | ||||
| -rw-r--r-- | src/components/SettingsModal.vue | 5 |
2 files changed, 28 insertions, 26 deletions
diff --git a/src/App.vue b/src/App.vue index fa8ddcd..ba36a69 100644 --- a/src/App.vue +++ b/src/App.vue @@ -720,32 +720,22 @@ export default defineComponent({ this.resetMode(); this.settingsOpen = true; }, - async onSettingChg(optionType: OptionType, option: string, save = true){ - // Save in localStorage - if (optionType == 'LYT'){ - if (save){ - localStorage.setItem(`${optionType} ${option}`, String(this.lytOpts[option as keyof LayoutOptions])); + async onSettingChg(optionType: OptionType, option: string, + {save = true, relayout = false, reinit = false} = {}){ + if (save){ + if (optionType == 'LYT'){ + localStorage.setItem(`${optionType} ${option}`, + String(this.lytOpts[option as keyof LayoutOptions])); + } else if (optionType == 'UI') { + localStorage.setItem(`${optionType} ${option}`, + String(this.uiOpts[option as keyof UiOptions])); } - this.relayoutWithCollapse(); - } else if (optionType == 'UI') { - if (save){ - localStorage.setItem(`${optionType} ${option}`, String(this.uiOpts[option as keyof UiOptions])); - } - if (option == 'useReducedTree'){ - this.onTreeChange(); - } - } else { - throw new Error(`Unexpected setting: ${optionType}, ${option}`); } - }, - async onTreeChange(){ - if (this.activeRoot != this.layoutTree){ - // Collapse tree to root - await this.onDetachedAncestorClick(this.layoutTree); + if (reinit){ + this.reInit(); + } else if (relayout){ + this.relayoutWithCollapse(); } - await this.onNonleafClick(this.layoutTree); - await timeout(this.uiOpts.transitionDuration); - await this.initTreeFromServer(); }, onResetSettings(): void { localStorage.clear(); @@ -753,7 +743,7 @@ export default defineComponent({ let defaultLytOpts = getDefaultLytOpts(); let defaultUiOpts = getDefaultUiOpts(defaultLytOpts); if (this.uiOpts.useReducedTree != defaultUiOpts.useReducedTree){ - this.onTreeChange(); + this.reInit(); } Object.assign(this.lytOpts, defaultLytOpts); Object.assign(this.uiOpts, defaultUiOpts); @@ -836,7 +826,7 @@ export default defineComponent({ await this.updateAreaDims(); this.relayoutWithCollapse(); } else { - this.onTreeChange(); + this.reInit(); } }; // @@ -911,6 +901,15 @@ export default defineComponent({ this.justInitialised = true; setTimeout(() => {this.justInitialised = false}, this.uiOpts.transitionDuration); }, + async reInit(){ + if (this.activeRoot != this.layoutTree){ + // Collapse tree to root + await this.onDetachedAncestorClick(this.layoutTree); + } + await this.onNonleafClick(this.layoutTree); + await timeout(this.uiOpts.transitionDuration); + await this.initTreeFromServer(); + }, getLytOpts(): LayoutOptions { let opts = getDefaultLytOpts(); for (let prop of Object.getOwnPropertyNames(opts) as (keyof LayoutOptions)[]){ diff --git a/src/components/SettingsModal.vue b/src/components/SettingsModal.vue index 58da129..b11c84c 100644 --- a/src/components/SettingsModal.vue +++ b/src/components/SettingsModal.vue @@ -135,12 +135,15 @@ export default defineComponent({ let maxInput = this.$refs.maxTileSzInput as HTMLInputElement; if (option == 'minTileSz' && Number(minInput.value) > Number(maxInput.value)){ this.lytOpts.maxTileSz = this.lytOpts.minTileSz; + this.$emit('setting-chg', 'LYT', 'maxTileSz', {save: false}); } else if (option == 'maxTileSz' && Number(maxInput.value) < Number(minInput.value)){ this.lytOpts.minTileSz = this.lytOpts.maxTileSz; + this.$emit('setting-chg', 'LYT', 'minTileSz', {save: false}); } } // - this.$emit('setting-chg', optionType, option, save); + this.$emit('setting-chg', optionType, option, + {save, relayout: optionType == 'LYT', reinit: optionType == 'UI' && option == 'useReducedTree'}); if (save){ // Make saved-indicator appear/animate if (!this.saved){ |