Scroll page previews with PgUp/Dn, Mod-Home/End

README.md

@@ -20,6 +20,7 @@ And an extensive set of keyboard operations is available as well:
 * Alt + Enter opens a context menu for the selected file or folder
 * F2 initiates a rename of the current file or folder, Shift+F2 begins a move
 * Tab toggles "quick preview" mode: when active, hovering or arrowing to an item will automatically display a hover preview for it, positioned so that it's always *outside* the menu (unless you're so deep in subfolders you've reached the edge of your screen).  This makes it really easy to browse the contents of a folder just by arrowing down through it.
+* If a page preview is active for the current file or folder, PageUp and PageDown scroll it up and down, with Ctrl-or-Cmd + Home or End jump to the beginning or end of the note.  Scrolling past the end or before the beginning (or using any of these keys without an active preview) advances the selection to the next or previous file/folder in the list.
 
 And speaking of previews, Quick Explorer's previews support **folder notes**!  When hover-previewing a folder (or after arrowing to it in quick preview mode), it's checked for a note whose name is the same as the folder, and then that note is shown without you needing to open the folder first.  It's a huge time saver if you have a lot of folder notes.  (Check out the Note Folder Autorename plugin if you'd like to automatically rename or move folders when the note is renamed, too.)
 

manifest.json

@@ -1,7 +1,7 @@
 {
   "id": "quick-explorer",
   "name": "Quick Explorer",
-  "version": "0.0.8",
+  "version": "0.0.9",
   "description": "Perform file explorer operations (and see your current file path) from the title bar",
   "minAppVersion": "0.12.12",
   "isDesktopOnly": true

src/FolderMenu.ts

@@ -61,6 +61,12 @@ export class FolderMenu extends PopupMenu {
         this.scope.register([],        "F2",    this.doRename.bind(this));
         this.scope.register(["Shift"], "F2",    this.doMove.bind(this));
 
+        // Scroll preview window up and down
+        this.scope.register([],       "PageUp", this.doScroll.bind(this, -1, false));
+        this.scope.register([],     "PageDown", this.doScroll.bind(this,  1, false));
+        this.scope.register(["Mod"],    "Home", this.doScroll.bind(this,  0, true));
+        this.scope.register(["Mod"],     "End", this.doScroll.bind(this,  1, true));
+
         const { dom } = this;
         dom.style.setProperty(
             // Allow popovers (hover preview) to overlay this menu
@@ -84,6 +90,26 @@ export class FolderMenu extends PopupMenu {
         return super.onArrowLeft() ?? this.openBreadcrumb(this.opener?.previousElementSibling);
     }
 
+    doScroll(direction: number, toEnd: boolean, event: KeyboardEvent) {
+        const preview = this.hoverPopover?.hoverEl.find(".markdown-preview-view");
+        if (preview) {
+            preview.style.scrollBehavior = toEnd ? "auto": "smooth";
+            const newTop = (toEnd ? 0 : preview.scrollTop) + direction * (toEnd ? preview.scrollHeight : preview.clientHeight);
+            preview.scrollTop = newTop;
+            if (!toEnd) {
+                // Paging past the beginning or end
+                if (newTop >= preview.scrollHeight) {
+                    this.onArrowDown(event);
+                } else if (newTop < 0) {
+                    this.onArrowUp(event);
+                }
+            }
+        } else {
+            // No preview, just go to next or previous item
+            if (direction > 0) this.onArrowDown(event); else this.onArrowUp(event);
+        }
+    }
+
     doRename() {
         const file = this.currentFile()
         if (file) this.app.fileManager.promptForFileRename(file);

src/menus.ts

@@ -44,8 +44,8 @@ export class PopupMenu extends Menu {
         this.scope.register(null, "Escape", this.hide.bind(this));
         this.scope.register([], "ArrowLeft", this.onArrowLeft.bind(this));
 
-        this.scope.register(null, "Home", this.onHome.bind(this));
-        this.scope.register(null, "End",  this.onEnd.bind(this));
+        this.scope.register([], "Home", this.onHome.bind(this));
+        this.scope.register([], "End",  this.onEnd.bind(this));
         this.scope.register([], "ArrowRight", this.onArrowRight.bind(this));
 
         // Make obsidian.Menu think mousedowns on our child menu(s) are happening

versions.json

@@ -1,5 +1,5 @@
 {
-    "0.0.8": "0.12.12",
+    "0.0.9": "0.12.12",
     "0.0.5": "0.12.10",
     "0.0.1": "0.12.3"
 }