Hover popup support for folder notes #61

LostPaul · Dec 29, 2023 · 5f252cc · 5f252cc
1 parent 4ddd56c
commit 5f252cc
Show file tree

Hide file tree

Showing 3 changed files with 66 additions and 8 deletions.
diff --git 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
@@ -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
@@ -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; }
 					(<Element>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);
 	}