ソースを参照

:art: https://github.com/siyuan-note/siyuan/issues/1359 点击菜单应选中对应的文档

Vanessa 2 年 前
コミット
8c4d00ed12

+ 1 - 1
app/src/layout/dock/Files.ts

@@ -80,7 +80,7 @@ export class Files extends Model {
     <span class="fn__space"></span>
     <span data-type="min" class="block__icon b3-tooltips b3-tooltips__sw" aria-label="${window.siyuan.languages.min} ${updateHotkeyTip(window.siyuan.config.keymap.general.closeTab.custom)}"><svg><use xlink:href='#iconMin'></use></svg></span>
 </div>
-<div class="fn__flex-1" data-type="navigation"></div>
+<div class="fn__flex-1"></div>
 <ul class="b3-list fn__flex-column" style="min-height: auto;transition: var(--b3-transition)">
     <li class="b3-list-item" data-type="toggle">
         <span class="b3-list-item__toggle">

+ 0 - 1
app/src/menus/Menu.ts

@@ -74,7 +74,6 @@ export class Menu {
         }
 
         this.element.innerHTML = "";
-        this.element.removeAttribute("data-filetreeid"); // 用于标记文档数右键所选文档 https://ld246.com/article/1667311960383
         this.element.classList.add("fn__none");
         this.element.classList.remove("b3-menu--list");
         this.element.removeAttribute("style");  // zIndex

+ 23 - 2
app/src/menus/navigation.ts

@@ -23,8 +23,20 @@ import {openFileById} from "../editor/util";
 import {confirmDialog} from "../dialog/confirmDialog";
 import {Constants} from "../constants";
 import {newFile} from "../util/newFile";
+import {hasClosestByClassName} from "../protyle/util/hasClosest";
 
 export const initNavigationMenu = (liElement: HTMLElement) => {
+    if (!liElement.classList.contains("b3-list-item--focus")) {
+        const fileElement = hasClosestByClassName(liElement, "sy__file")
+        if (fileElement) {
+            fileElement.querySelectorAll(".b3-list-item--focus").forEach(item => {
+                item.classList.remove("b3-list-item--focus");
+                item.removeAttribute("select-end")
+                item.removeAttribute("select-start")
+            })
+        }
+        liElement.classList.add("b3-list-item--focus");
+    }
     const notebookId = liElement.parentElement.getAttribute("data-url");
     const name = getNotebookName(notebookId);
     window.siyuan.menus.menu.remove();
@@ -132,11 +144,21 @@ export const initNavigationMenu = (liElement: HTMLElement) => {
             }
         }]
     }).element);
-    window.siyuan.menus.menu.element.setAttribute("data-filetreeid", notebookId);
     return window.siyuan.menus.menu;
 };
 
 export const initFileMenu = (notebookId: string, pathString: string, liElement: Element) => {
+    if (!liElement.classList.contains("b3-list-item--focus")) {
+        const fileElement = hasClosestByClassName(liElement, "sy__file")
+        if (fileElement) {
+            fileElement.querySelectorAll(".b3-list-item--focus").forEach(item => {
+                item.classList.remove("b3-list-item--focus");
+                item.removeAttribute("select-end")
+                item.removeAttribute("select-start")
+            })
+        }
+        liElement.classList.add("b3-list-item--focus");
+    }
     const id = liElement.getAttribute("data-node-id");
     let name = liElement.getAttribute("data-name");
     window.siyuan.menus.menu.remove();
@@ -284,7 +306,6 @@ export const initFileMenu = (notebookId: string, pathString: string, liElement:
     /// #endif
     genImportMenu(notebookId, pathString);
     window.siyuan.menus.menu.append(exportMd(id));
-    window.siyuan.menus.menu.element.setAttribute("data-filetreeid", id);
     return window.siyuan.menus.menu;
 };
 

+ 1 - 1
app/src/mobile/util/MobileFiles.ts

@@ -68,7 +68,7 @@ export class MobileFiles extends Model {
     <svg data-type="collapse" class="toolbar__icon"><use xlink:href="#iconContract"></use></svg>
     <svg data-type="sort" class="toolbar__icon${window.siyuan.config.readonly ? " fn__none" : ""}"><use xlink:href="#iconSort"></use></svg>
 </div>
-<div class="fn__flex-1" data-type="navigation"></div>
+<div class="fn__flex-1"></div>
 <ul class="b3-list b3-list--background fn__flex-column" style="min-height: auto;transition: var(--b3-transition)">
     <li class="b3-list-item" data-type="toggle">
         <span class="b3-list-item__toggle">

+ 2 - 1
app/src/protyle/wysiwyg/getBlock.ts

@@ -223,7 +223,8 @@ export const getPreviousFileLi = (current: Element) => {
         } else if (previousElement.previousElementSibling.tagName === "LI") {
             return previousElement.previousElementSibling;
         } else if (previousElement.previousElementSibling.tagName === "UL") {
-            return previousElement.previousElementSibling.lastElementChild;
+            const liElements = previousElement.previousElementSibling.querySelectorAll(".b3-list-item")
+            return liElements[liElements.length - 1];
         }
     }
     return false;

+ 21 - 29
app/src/util/globalShortcut.ts

@@ -867,20 +867,7 @@ const fileTreeKeydown = (event: KeyboardEvent) => {
     if (!files.element.parentElement.classList.contains("layout__tab--active")) {
         return false;
     }
-    let liElements: Element[] = []
-    const menuId = window.siyuan.menus.menu.element.getAttribute("data-filetreeid")
-    if (menuId) {
-        let liElement = files.element.querySelector(`li[data-node-id="${menuId}"]`)
-        if (!liElement) {
-            liElement = files.element.querySelector(`ul[data-url="${menuId}"] > li`)
-        }
-        if (!liElement) {
-            return;
-        }
-        liElements.push(liElement)
-    } else {
-        liElements = Array.from(files.element.querySelectorAll(".b3-list-item--focus"));
-    }
+    const liElements = Array.from(files.element.querySelectorAll(".b3-list-item--focus"))
     if (liElements.length === 0) {
         if (event.key.startsWith("Arrow")) {
             const liElement = files.element.querySelector(".b3-list-item");
@@ -958,49 +945,54 @@ const fileTreeKeydown = (event: KeyboardEvent) => {
     if (event.shiftKey) {
         if (event.key === "ArrowUp") {
             const startEndElement = getStartEndElement(liElements);
+            let previousElement: Element;
             if (startEndElement.startElement.getBoundingClientRect().top >= startEndElement.endElement.getBoundingClientRect().top) {
-                const previousElement = getPreviousFileLi(startEndElement.endElement)
+                previousElement = getPreviousFileLi(startEndElement.endElement) as Element;
                 if (previousElement) {
                     previousElement.classList.add("b3-list-item--focus");
                     previousElement.setAttribute("select-end", "true");
                     startEndElement.endElement.removeAttribute("select-end");
-
-                    const previousRect = previousElement.getBoundingClientRect();
-                    const fileRect = files.element.getBoundingClientRect();
-                    if (previousRect.top < fileRect.top || previousRect.bottom > fileRect.bottom) {
-                        previousElement.scrollIntoView(previousRect.top < fileRect.top);
-                    }
                 }
             } else {
                 startEndElement.endElement.classList.remove("b3-list-item--focus");
                 startEndElement.endElement.removeAttribute("select-end");
-                const previousElement = getPreviousFileLi(startEndElement.endElement);
+                previousElement = getPreviousFileLi(startEndElement.endElement) as Element;
                 if (previousElement) {
                     previousElement.setAttribute("select-end", "true");
                 }
             }
+            if (previousElement) {
+                const previousRect = previousElement.getBoundingClientRect();
+                const fileRect = files.element.getBoundingClientRect();
+                if (previousRect.top < fileRect.top || previousRect.bottom > fileRect.bottom) {
+                    previousElement.scrollIntoView(previousRect.top < fileRect.top);
+                }
+            }
         } else if (event.key === "ArrowDown") {
             const startEndElement = getStartEndElement(liElements);
+            let nextElement: Element;
             if (startEndElement.startElement.getBoundingClientRect().top <= startEndElement.endElement.getBoundingClientRect().top) {
-                const nextElement = getNextFileLi(startEndElement.endElement);
+                nextElement = getNextFileLi(startEndElement.endElement) as Element;
                 if (nextElement) {
                     nextElement.classList.add("b3-list-item--focus");
                     nextElement.setAttribute("select-end", "true");
                     startEndElement.endElement.removeAttribute("select-end");
-                    const nextRect = nextElement.getBoundingClientRect();
-                    const fileRect = files.element.getBoundingClientRect();
-                    if (nextRect.top < fileRect.top || nextRect.bottom > fileRect.bottom) {
-                        nextElement.scrollIntoView(nextRect.top < fileRect.top);
-                    }
                 }
             } else {
                 startEndElement.endElement.classList.remove("b3-list-item--focus");
                 startEndElement.endElement.removeAttribute("select-end");
-                const nextElement = getNextFileLi(startEndElement.endElement);
+                nextElement = getNextFileLi(startEndElement.endElement) as Element;
                 if (nextElement) {
                     nextElement.setAttribute("select-end", "true");
                 }
             }
+            if (nextElement) {
+                const nextRect = nextElement.getBoundingClientRect();
+                const fileRect = files.element.getBoundingClientRect();
+                if (nextRect.top < fileRect.top || nextRect.bottom > fileRect.bottom) {
+                    nextElement.scrollIntoView(nextRect.top < fileRect.top);
+                }
+            }
         }
         return;
     } else {