From 81d7236a1e2270523bf4ecbe8910c226f479b926 Mon Sep 17 00:00:00 2001 From: Lost Paul <70213368+LostPaul@users.noreply.github.com> Date: Fri, 3 Jan 2025 22:25:25 +0100 Subject: [PATCH] Remove flashing of folder overview settings view --- src/folderOverview/settings.ts | 19 ++++-- src/folderOverview/view.ts | 103 +++++++++++++++++++++++---------- 2 files changed, 85 insertions(+), 37 deletions(-) diff --git a/src/folderOverview/settings.ts b/src/folderOverview/settings.ts index 061f20a..e2c2cee 100644 --- a/src/folderOverview/settings.ts +++ b/src/folderOverview/settings.ts @@ -18,7 +18,7 @@ export async function createOverviewSettings(contentEl: HTMLElement, yaml: yamlS .onChange(async (value) => { yaml.showTitle = value; updateSettings(contentEl, yaml, plugin, defaultSettings, el, ctx, file);; - display(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); + refresh(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); }) ); if (yaml.showTitle) { @@ -61,7 +61,7 @@ export async function createOverviewSettings(contentEl: HTMLElement, yaml: yamlS .onChange(async (value: 'list') => { yaml.style = value; updateSettings(contentEl, yaml, plugin, defaultSettings, el, ctx, file); - display(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); + refresh(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); }) ); @@ -85,7 +85,7 @@ export async function createOverviewSettings(contentEl: HTMLElement, yaml: yamlS list.on('update', (values) => { yaml.includeTypes = values; updateSettings(contentEl, yaml, plugin, defaultSettings, el, ctx, file); - display(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); + refresh(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); }); if ((yaml?.includeTypes?.length || 0) < 8 && !yaml.includeTypes?.includes('all')) { @@ -118,7 +118,7 @@ export async function createOverviewSettings(contentEl: HTMLElement, yaml: yamlS } await list.addValue(value.toLowerCase()); updateSettings(contentEl, yaml, plugin, defaultSettings, el, ctx, file); - display(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); + refresh(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); }); }); } @@ -212,7 +212,7 @@ export async function createOverviewSettings(contentEl: HTMLElement, yaml: yamlS yaml.showEmptyFolders = value; yaml.onlyIncludeSubfolders = false; updateSettings(contentEl, yaml, plugin, defaultSettings, el, ctx, file); - display(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); + refresh(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); }); }); @@ -259,7 +259,6 @@ export async function createOverviewSettings(contentEl: HTMLElement, yaml: yamlS async function updateSettings(contentEl: HTMLElement, yaml: yamlSettings, plugin: FolderNotesPlugin, defaultSettings: boolean, el?: HTMLElement, ctx?: MarkdownPostProcessorContext, file?: TFile | null) { if (defaultSettings) { - plugin.updateOverviewView(); return plugin.saveSettings(); } @@ -270,4 +269,12 @@ async function updateSettings(contentEl: HTMLElement, yaml: yamlSettings, plugin if (file) { await updateYamlById(plugin, yaml.id, file, yaml); } + plugin.updateOverviewView(); +} + +function refresh(contentEl: HTMLElement, yaml: yamlSettings, plugin: FolderNotesPlugin, defaultSettings: boolean, display: CallableFunction, el?: HTMLElement, ctx?: MarkdownPostProcessorContext, file?: TFile | null, settingsTab?: SettingsTab, modal?: FolderOverviewSettings) { + if (file) { + contentEl = contentEl.parentElement as HTMLElement; + } + display(contentEl, yaml, plugin, defaultSettings, display, el, ctx, file, settingsTab, modal); } \ No newline at end of file diff --git a/src/folderOverview/view.ts b/src/folderOverview/view.ts index 636e94d..88d6d09 100644 --- a/src/folderOverview/view.ts +++ b/src/folderOverview/view.ts @@ -17,6 +17,8 @@ export class FolderOverviewView extends ItemView { super(leaf); this.plugin = plugin; + this.display = this.display.bind(this); + this.registerEvent( this.plugin.app.workspace.on('file-open', (file) => { this.activeFile = file; @@ -41,52 +43,91 @@ export class FolderOverviewView extends ItemView { this.display(this.contentEl, this.yaml, this.plugin, this.defaultSettings, this.display, undefined, undefined, this.activeFile); } - async display(contentEl: HTMLElement, yaml: yamlSettings, plugin: FolderNotesPlugin, defaultSettings: boolean, display: CallableFunction, el?: HTMLElement, ctx?: MarkdownPostProcessorContext, file?: TFile | null) { - contentEl.empty(); - contentEl.createEl('h4', { text: 'Folder Overview settings' }); + async display( + contentEl: HTMLElement, + yaml: yamlSettings, + plugin: FolderNotesPlugin, + defaultSettings: boolean, + display: CallableFunction, + el?: HTMLElement, + ctx?: MarkdownPostProcessorContext, + file?: TFile | null + ) { + + this.contentEl = contentEl; + this.yaml = yaml; + this.defaultSettings = defaultSettings; + if (file) { this.activeFile = file; } + let header = contentEl.querySelector('.fn-folder-overview-header'); + if (!header) { + header = contentEl.createEl('h4', { + cls: 'fn-folder-overview-header', + text: 'Folder Overview settings' + }); + } const activeFile = plugin.app.workspace.getActiveFile(); - if (!activeFile) { - contentEl.createEl('p', { text: 'No active file found' }); + let msg = contentEl.querySelector('.fn-no-file-msg'); + if (!msg) { + msg = contentEl.createEl('p', { cls: 'fn-no-file-msg' }); + } + msg.textContent = 'No active file found'; return; + } else { + const msg = contentEl.querySelector('.fn-no-file-msg'); + if (msg) msg.remove(); } const overviews = await getOverviews(plugin, activeFile); - const overviewSetting = new Setting(contentEl); - overviewSetting.setName('Select overview'); - overviewSetting.setClass('fn-select-overview-setting'); - overviewSetting.addDropdown((cb) => { - const options = overviews.reduce((acc, overview) => { - acc[overview.id] = parseOverviewTitle(overview as any as yamlSettings, plugin, activeFile.parent); - return acc; - }, {} as Record); - cb.addOptions(options); - cb.addOption('default', 'Default'); - cb.setValue(yaml?.id ?? 'default'); + let settingsContainer = contentEl.querySelector('.fn-settings-container') as HTMLElement; + if (!settingsContainer) { + settingsContainer = contentEl.createDiv({ cls: 'fn-settings-container' }); + } else { + settingsContainer.empty(); + } - if (cb.getValue() === 'default' || defaultSettings) { - yaml = plugin.settings.defaultOverview; - defaultSettings = true; - cb.setValue('default'); - } else { - yaml = overviews.find((overview) => overview.id === yaml.id) as any as yamlSettings; - defaultSettings = false; - } + const overviewSetting = new Setting(settingsContainer); + overviewSetting + .setName('Select overview') + .setClass('fn-select-overview-setting') + .addDropdown((cb) => { + const options = overviews.reduce((acc, overview) => { + acc[overview.id] = parseOverviewTitle( + overview as any as yamlSettings, + plugin, + activeFile.parent + ); + return acc; + }, {} as Record); - cb.onChange(async (value) => { - if (value === 'default') { + cb.addOptions(options); + cb.addOption('default', 'Default'); + cb.setValue(yaml?.id ?? 'default'); + console.log(yaml); + + if (cb.getValue() === 'default' || defaultSettings) { yaml = plugin.settings.defaultOverview; defaultSettings = true; + cb.setValue('default'); } else { - yaml = overviews.find((overview) => overview.id === value) as any as yamlSettings; + yaml = overviews.find((overview) => overview.id === yaml.id) as any as yamlSettings; defaultSettings = false; } - display(contentEl, yaml, plugin, defaultSettings, display, undefined, undefined, activeFile); - }); - }); - createOverviewSettings(contentEl, yaml, plugin, defaultSettings, display, undefined, undefined, activeFile); + cb.onChange(async (value) => { + if (value === 'default') { + yaml = plugin.settings.defaultOverview; + defaultSettings = true; + } else { + yaml = overviews.find((overview) => overview.id === value) as any as yamlSettings; + defaultSettings = false; + } + display(contentEl, yaml, plugin, defaultSettings, display, undefined, undefined, activeFile); + }); + }); + + createOverviewSettings(settingsContainer, yaml, plugin, defaultSettings, display, undefined, undefined, activeFile); } }