From 5f252cc4d6f4ab3ed4b5bba17d80e2c1218c0f59 Mon Sep 17 00:00:00 2001 From: Lost Paul <70213368+LostPaul@users.noreply.github.com> Date: Fri, 29 Dec 2023 13:19:03 +0100 Subject: [PATCH] Hover popup support for folder notes #61 --- src/Commands.ts | 4 +- src/folderOverview/FolderOverview.ts | 12 ++++-- src/main.ts | 58 +++++++++++++++++++++++++++- 3 files changed, 66 insertions(+), 8 deletions(-) diff --git a/src/Commands.ts b/src/Commands.ts index 3079bca..4b6631f 100644 --- a/src/Commands.ts +++ b/src/Commands.ts @@ -230,7 +230,7 @@ export class Commands { if (file instanceof TFile) { // @ts-ignore subMenu.addItem((item) => { - item.setTitle('Create folder note') + item.setTitle('Make folder note') .setIcon('edit') .onClick(async () => { if (!folder) return; @@ -255,7 +255,7 @@ export class Commands { if (this.plugin.getFolderPathFromString(file.path) === '') return; if (!(folder instanceof TFolder)) return; subMenu.addItem((item) => { - item.setTitle('Turn into folder note') + item.setTitle(`Turn into folder note for ${folder?.name}`) .setIcon('edit') .onClick(() => { if (!folder || !(folder instanceof TFolder)) return; diff --git a/src/folderOverview/FolderOverview.ts b/src/folderOverview/FolderOverview.ts index 865313c..526dc6c 100644 --- a/src/folderOverview/FolderOverview.ts +++ b/src/folderOverview/FolderOverview.ts @@ -175,10 +175,14 @@ export class FolderOverview { if (this.yaml.style === 'explorer') { const overview = el.childNodes[0]; if (!overview.childNodes[2]) { - return this.addEditButton(root); + if (this.plugin.app.workspace.layoutReady) { + return this.addEditButton(root); + } } } else { - return this.addEditButton(root); + if (this.plugin.app.workspace.layoutReady) { + return this.addEditButton(root); + } } } if (this.yaml.includeTypes.length > 1 && (!this.yaml.showEmptyFolders || this.yaml.onlyIncludeSubfolders) && this.yaml.style === 'list') { @@ -196,7 +200,7 @@ export class FolderOverview { new FolderOverviewSettings(this.plugin.app, this.plugin, this.yaml, this.ctx, this.el).open(); }, { capture: true }); } - + cloneFileExplorerView(plugin: FolderNotesPlugin, ctx: MarkdownPostProcessorContext, root: HTMLElement, yaml: yamlSettings, pathBlacklist: string[]) { const folder = plugin.getEL(this.yaml.folderPath) let folderElement = folder?.parentElement; @@ -294,7 +298,7 @@ export class FolderOverview { collapseIcon.onclick = () => { this.handleCollapseClick(collapseIcon, this.plugin, this.yaml, this.pathBlacklist, this.source, child); } - + folderTitle.createDiv({ cls: 'tree-item-inner nav-folder-title-content', text: child.name, diff --git a/src/main.ts b/src/main.ts index 54b2c00..3203d12 100644 --- a/src/main.ts +++ b/src/main.ts @@ -1,4 +1,4 @@ -import { Plugin, TFile, TFolder, TAbstractFile, MarkdownPostProcessorContext, parseYaml, Notice, Platform } from 'obsidian'; +import { Plugin, TFile, TFolder, TAbstractFile, MarkdownPostProcessorContext, parseYaml, Notice, Platform, Keymap } from 'obsidian'; import { DEFAULT_SETTINGS, FolderNotesSettings, SettingsTab } from './settings/SettingsTab'; import { Commands } from './Commands'; import { FileExplorerWorkspaceLeaf } from './globals'; @@ -17,6 +17,9 @@ export default class FolderNotesPlugin extends Plugin { activeFolderDom: HTMLElement | null; activeFileExplorer: FileExplorerWorkspaceLeaf; fmtpHandler: FrontMatterTitlePluginHandler | null = null; + hoveredElement: HTMLElement | null = null; + mouseEvent: MouseEvent | null = null; + hoverLinkTriggered = false; async onload() { console.log('loading folder notes plugin'); await this.loadSettings(); @@ -47,6 +50,33 @@ export default class FolderNotesPlugin extends Plugin { if (element.onclick) return; if (Platform.isMobile && this.settings.disableOpenFolderNoteOnClick) return; element.onclick = (event: MouseEvent) => handleFolderClick(event, this); + this.registerDomEvent(element, 'pointerover', (event: MouseEvent) => { + this.hoveredElement = element; + this.mouseEvent = event; + if (!Keymap.isModEvent(event)) return; + if (!(event.target instanceof HTMLElement)) return; + + const folderPath = event?.target?.parentElement?.getAttribute('data-path') || ''; + const folderNote = getFolderNote(this, folderPath); + if (!folderNote) return; + + this.app.workspace.trigger('hover-link', { + event: event, + source: 'preview', + hoverParent: { + file: folderNote, + }, + targetEl: event.target, + linktext: folderNote?.basename, + sourcePath: folderNote?.path, + }); + this.hoverLinkTriggered = true; + }); + this.registerDomEvent(element, 'pointerout', () => { + this.hoveredElement = null; + this.mouseEvent = null; + this.hoverLinkTriggered = false; + }); }); if (!this.settings.openFolderNoteOnClickInPath) { return; } (rec.target).querySelectorAll('span.view-header-breadcrumb') @@ -89,6 +119,30 @@ export default class FolderNotesPlugin extends Plugin { subtree: true, }); + this.registerDomEvent(window, 'keydown', (event: KeyboardEvent) => { + const hoveredElement = this.hoveredElement; + if (this.hoverLinkTriggered) return; + if (!hoveredElement) return; + if (!Keymap.isModEvent(event)) return; + + const folderPath = hoveredElement?.parentElement?.getAttribute('data-path') || ''; + const folderNote = getFolderNote(this, folderPath); + if (!folderNote) return; + + this.app.workspace.trigger('hover-link', { + event: this.mouseEvent, + source: 'preview', + hoverParent: { + file: folderNote, + }, + targetEl: hoveredElement, + linktext: folderNote?.basename, + sourcePath: folderNote?.path, + }); + this.hoverLinkTriggered = true; + }); + + this.registerEvent(this.app.workspace.on('layout-change', () => { this.loadFileClasses(); })); @@ -381,7 +435,7 @@ export default class FolderNotesPlugin extends Plugin { const data = await this.loadData(); this.settings = Object.assign({}, DEFAULT_SETTINGS, data); if (!data) { return; } - const overview = (data as any).defaultOverview; + const overview = (data as any).defaultOverview; if (!overview) { return; } this.settings.defaultOverview = Object.assign({}, DEFAULT_SETTINGS.defaultOverview, overview); }