🎨 https://github.com/siyuan-note/siyuan/issues/1359 点击菜单应选中对应的文档
This commit is contained in:
parent
9b29174faa
commit
8c4d00ed12
6 changed files with 48 additions and 35 deletions
|
@ -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">
|
||||
|
|
|
@ -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,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;
|
||||
};
|
||||
|
||||
|
|
|
@ -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">
|
||||
|
|
|
@ -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;
|
||||
|
|
|
@ -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 {
|
||||
|
|
Loading…
Add table
Reference in a new issue