This commit is contained in:
Vanessa 2023-07-04 20:39:43 +08:00
parent 4d9807c8bb
commit 0955dd5e1b
10 changed files with 65 additions and 25 deletions

View File

@ -176,6 +176,8 @@
margin: 3px 0;
color: var(--b3-theme-on-surface);
max-width: 70%;
border: 0;
background-color: transparent;
&.b3-tooltips svg {
margin-right: 0;

View File

@ -39,7 +39,6 @@ export const reloadSync = (app: App, data: { upsertRootIDs: string[], removeRoot
hideElements(["dialog"]);
} else {
reloadProtyle(window.siyuan.mobile.popEditor.protyle, false);
window.siyuan.mobile.popEditor.protyle.breadcrumb.render(window.siyuan.mobile.popEditor.protyle, true);
}
}
if (window.siyuan.mobile.editor) {

View File

@ -596,11 +596,6 @@ export const zoomOut = (options: {
pushBack();
}
}
/// #if !MOBILE
if (options.protyle.breadcrumb) {
options.protyle.breadcrumb.toggleExit(options.id === options.protyle.block.rootID);
}
/// #endif
fetchPost("/api/filetree/getDoc", {
id: options.id,
size: options.id === options.protyle.block.rootID ? window.siyuan.config.editor.dynamicLoadBlocks : Constants.SIZE_GET_MAX,

View File

@ -56,7 +56,7 @@ export const openMobileFileById = (app: App, id: string, action = [Constants.CB_
mode: action.includes(Constants.CB_GET_CONTEXT) ? 3 : 0,
}, getResponse => {
onGet({data: getResponse, protyle: window.siyuan.mobile.editor.protyle, action});
window.siyuan.mobile.editor.protyle.breadcrumb?.render(window.siyuan.mobile.editor.protyle);
window.siyuan.mobile.editor.protyle.breadcrumb?.genMobileIcon(window.siyuan.mobile.editor.protyle.block.rootID);
});
window.siyuan.mobile.editor.protyle.undo.clear();
} else {
@ -77,6 +77,7 @@ export const openMobileFileById = (app: App, id: string, action = [Constants.CB_
if (window.siyuan.config.readonly || window.siyuan.config.editor.readOnly) {
disabledProtyle(editor.protyle);
}
editor.protyle.breadcrumb?.genMobileIcon(editor.protyle.block.rootID);
}
});
}

View File

@ -97,7 +97,7 @@ const focusStack = (backStack: IBackStack) => {
}
}
protyle.contentElement.scrollTop = backStack.scrollTop;
protyle.breadcrumb?.render(protyle);
protyle.breadcrumb?.genMobileIcon(protyle.block.rootID);
});
};

View File

@ -25,12 +25,6 @@ const popSide = (render = true) => {
export const handleTouchEnd = (event: TouchEvent) => {
const editor = getCurrentEditor();
if (editor) {
document.querySelectorAll(".protyle-breadcrumb__bar--hide").forEach(item => {
item.classList.remove("protyle-breadcrumb__bar--hide");
});
window.siyuan.hideBreadcrumb = false;
}
const target = event.target as HTMLElement;
if (editor && typeof yDiff === "undefined" && new Date().getTime() - time > 900 &&
target.tagName === "SPAN" && window.webkit?.messageHandlers &&

View File

@ -26,6 +26,8 @@ import {hideElements} from "../ui/hideElements";
import {confirmDialog} from "../../dialog/confirmDialog";
import {reloadProtyle} from "../util/reload";
import {deleteFile} from "../../editor/deleteFile";
import {Menu} from "../../plugin/Menu";
import {getNoContainerElement} from "../wysiwyg/getBlock";
export class Breadcrumb {
public element: HTMLElement;
@ -36,7 +38,7 @@ export class Breadcrumb {
constructor(protyle: IProtyle) {
const element = document.createElement("div");
element.className = "protyle-breadcrumb";
const isFocus = protyle.options.action.includes(Constants.CB_GET_ALL) && !isMobile();
const isFocus = protyle.options.action.includes(Constants.CB_GET_ALL);
element.innerHTML = `<div class="protyle-breadcrumb__bar"></div>
<span class="protyle-breadcrumb__space"></span>
<button class="block__icon block__icon--show ft__smaller fn__flex-center${isFocus ? "" : " fn__none"}" style="line-height: 14px" data-type="exit-focus">${window.siyuan.languages.exitFocus}</button>
@ -53,17 +55,19 @@ export class Breadcrumb {
while (target && !target.isEqualNode(element)) {
const id = target.getAttribute("data-node-id");
if (id) {
/// #if MOBILE
this.genMobileMenu(protyle);
/// #else
if (protyle.options.render.breadcrumbDocName && window.siyuan.ctrlIsPressed) {
/// #if !MOBILE
openFileById({
app:protyle.app,
app: protyle.app,
id,
action: id === protyle.block.rootID ? [Constants.CB_GET_FOCUS] : [Constants.CB_GET_FOCUS, Constants.CB_GET_ALL]
});
/// #endif
} else {
zoomOut({protyle, id});
zoomOut({protyle, id, focusId: protyle.block.id});
}
/// #endif
event.preventDefault();
break;
} else if (target.getAttribute("data-menu") === "true") {
@ -89,7 +93,6 @@ export class Breadcrumb {
size: window.siyuan.config.editor.dynamicLoadBlocks,
}, getResponse => {
onGet({data: getResponse, protyle, action: [Constants.CB_GET_HL]});
this.toggleExit(true);
});
target.classList.add("block__icon--active");
}
@ -152,6 +155,48 @@ export class Breadcrumb {
this.mediaRecorder.startRecordingNewWavFile();
}
private genMobileMenu(protyle: IProtyle) {
const menu = new Menu("breadcrumb-mobile-path");
let blockElement: Element;
if (getSelection().rangeCount > 0) {
const range = getSelection().getRangeAt(0);
if (!protyle.wysiwyg.element.isEqualNode(range.startContainer) && !protyle.wysiwyg.element.contains(range.startContainer)) {
blockElement = getNoContainerElement(protyle.wysiwyg.element.firstElementChild) || protyle.wysiwyg.element.firstElementChild;
} else {
blockElement = hasClosestBlock(range.startContainer) as Element;
}
}
if (!blockElement) {
blockElement = getNoContainerElement(protyle.wysiwyg.element.firstElementChild) || protyle.wysiwyg.element.firstElementChild;
}
const id = blockElement.getAttribute("data-node-id")
fetchPost("/api/block/getBlockBreadcrumb", {id, excludeTypes: []}, (response) => {
response.data.forEach((item: IBreadcrumb) => {
let isCurrent = false;
if (!protyle.block.showAll && item.id === protyle.block.parentID) {
isCurrent = true;
} else if (protyle.block.showAll && item.id === protyle.block.id) {
isCurrent = true;
}
menu.addItem({
current: isCurrent,
icon: getIconByType(item.type, item.subType),
label: item.name,
click() {
zoomOut({protyle, id: item.id, focusId: id});
}
})
});
menu.fullscreen();
});
}
public genMobileIcon(rootId: string) {
this.element.innerHTML = `<button class="protyle-breadcrumb__item" data-node-id="${rootId}">
<svg class="popover__block" data-id="${rootId}"><use xlink:href="#iconFile"></use></svg>
</button>`;
}
public toggleExit(hide: boolean) {
const exitFocusElement = this.element.parentElement.querySelector('[data-type="exit-focus"]');
if (hide) {
@ -373,18 +418,21 @@ export class Breadcrumb {
}
public render(protyle: IProtyle, update = false) {
if (isMobile()) {
return;
}
let range: Range;
let blockElement: Element;
if (getSelection().rangeCount > 0) {
range = getSelection().getRangeAt(0);
if (!protyle.wysiwyg.element.isEqualNode(range.startContainer) && !protyle.wysiwyg.element.contains(range.startContainer)) {
blockElement = protyle.wysiwyg.element.firstElementChild;
blockElement = getNoContainerElement(protyle.wysiwyg.element.firstElementChild) || protyle.wysiwyg.element.firstElementChild;
} else {
blockElement = hasClosestBlock(range.startContainer) as Element;
}
}
if (!blockElement) {
blockElement = protyle.wysiwyg.element.firstElementChild;
blockElement = getNoContainerElement(protyle.wysiwyg.element.firstElementChild) || protyle.wysiwyg.element.firstElementChild;
}
const id = blockElement.getAttribute("data-node-id");
if (id === this.id && !update) {
@ -454,6 +502,9 @@ export class Breadcrumb {
}
public hide() {
if (isMobile()) {
return;
}
this.element.classList.add("protyle-breadcrumb__bar--hide");
window.siyuan.hideBreadcrumb = true;
}

View File

@ -67,7 +67,6 @@ export const getDocByScroll = (options: {
size: Constants.SIZE_GET_MAX,
}, response => {
actions.push(Constants.CB_GET_ALL);
options.protyle.breadcrumb?.toggleExit(false);
onGet({
data: response,
protyle: options.protyle,
@ -85,7 +84,6 @@ export const getDocByScroll = (options: {
startID: options.scrollAttr.startId,
endID: options.scrollAttr.endId,
}, response => {
options.protyle.breadcrumb?.toggleExit(true);
onGet({
data: response,
protyle: options.protyle,

View File

@ -267,6 +267,7 @@ const setHTML = (options: {
return;
}
if (protyle.options.render.breadcrumb) {
protyle.breadcrumb.toggleExit(!options.action.includes(Constants.CB_GET_ALL));
protyle.breadcrumb.render(protyle);
}
protyle.app.plugins.forEach(item => {

View File

@ -972,7 +972,6 @@ const getArticle = (options: {
const contentRect = options.edit.protyle.contentElement.getBoundingClientRect();
options.edit.protyle.contentElement.scrollTop = options.edit.protyle.contentElement.scrollTop + matchElement.getBoundingClientRect().top - contentRect.top - contentRect.height / 2;
}
options.edit.protyle.breadcrumb.toggleExit(!foldResponse.data);
});
});
};