diff --git a/app/src/protyle/util/editorCommonEvent.ts b/app/src/protyle/util/editorCommonEvent.ts index dd51e2d76..4dad47fdc 100644 --- a/app/src/protyle/util/editorCommonEvent.ts +++ b/app/src/protyle/util/editorCommonEvent.ts @@ -11,7 +11,7 @@ import {Constants} from "../../constants"; import {paste} from "./paste"; import {cancelSB, genEmptyElement, genSBElement, insertEmptyBlock} from "../../block/util"; import {transaction, turnsIntoOneTransaction} from "../wysiwyg/transaction"; -import {getTopAloneElement} from "../wysiwyg/getBlock"; +import {getParentBlock, getTopAloneElement} from "../wysiwyg/getBlock"; import {updateListOrder} from "../wysiwyg/list"; import {fetchPost, fetchSyncPost} from "../../util/fetch"; import {onGet} from "./onGet"; @@ -71,7 +71,7 @@ const moveTo = async (protyle: IProtyle, sourceElements: Element[], targetElemen data: newListElement.outerHTML, id: newListId, previousID: position === "afterbegin" ? null : (position === "afterend" ? targetId : tempTargetElement.previousElementSibling?.getAttribute("data-node-id")), - parentID: position === "afterbegin" ? targetId : (tempTargetElement.parentElement?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID), + parentID: position === "afterbegin" ? targetId : (getParentBlock(tempTargetElement)?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID), }); undoOperations.push({ action: "delete", @@ -132,7 +132,7 @@ const moveTo = async (protyle: IProtyle, sourceElements: Element[], targetElemen id: copyNewId, data: copyElement.outerHTML, previousID: position === "afterbegin" ? null : (position === "afterend" ? targetId : copyElement.previousElementSibling?.getAttribute("data-node-id")), // 不能使用常量，移动后会被修改 - parentID: position === "afterbegin" ? targetId : (copyElement.parentElement?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID), + parentID: position === "afterbegin" ? targetId : (getParentBlock(copyElement)?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID), }); newSourceElements.push(copyElement); } @@ -155,7 +155,7 @@ const moveTo = async (protyle: IProtyle, sourceElements: Element[], targetElemen action: "move", id, previousID: position === "afterbegin" ? null : (position === "afterend" ? targetId : item.previousElementSibling?.getAttribute("data-node-id")), // 不能使用常量，移动后会被修改 - parentID: position === "afterbegin" ? targetId : (item.parentElement?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID), + parentID: position === "afterbegin" ? targetId : (getParentBlock(item)?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID), }); newSourceElements.push(item); } @@ -171,7 +171,7 @@ const moveTo = async (protyle: IProtyle, sourceElements: Element[], targetElemen data: topSourceElement.outerHTML, id: topSourceElement.getAttribute("data-node-id"), previousID: topSourceElement.previousElementSibling?.getAttribute("data-node-id"), - parentID: topSourceElement.parentElement?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID + parentID: getParentBlock(topSourceElement)?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID }); const topSourceParentElement = topSourceElement.parentElement; topSourceElement.remove(); @@ -348,7 +348,7 @@ const dragSb = async (protyle: IProtyle, sourceElements: Element[], targetElemen action: "move", id: targetElement.getAttribute("data-node-id"), previousID: targetElement.previousElementSibling?.getAttribute("data-node-id"), - parentID: targetElement.parentElement?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID + parentID: getParentBlock(targetElement)?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID }; const sbElement = genSBElement(direct); targetElement.parentElement.replaceChild(sbElement, targetElement); @@ -358,7 +358,7 @@ const dragSb = async (protyle: IProtyle, sourceElements: Element[], targetElemen id: sbElement.getAttribute("data-node-id"), nextID: sbElement.nextElementSibling?.getAttribute("data-node-id"), previousID: sbElement.previousElementSibling?.getAttribute("data-node-id"), - parentID: sbElement.parentElement.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID + parentID: getParentBlock(sbElement)?.getAttribute("data-node-id") || protyle.block.parentID || protyle.block.rootID }]; // 临时插入，防止后面计算错误，最终再移动矫正 sbElement.lastElementChild.before(targetElement); diff --git a/app/src/protyle/util/insertHTML.ts b/app/src/protyle/util/insertHTML.ts index e54cfc374..490a43453 100644 --- a/app/src/protyle/util/insertHTML.ts +++ b/app/src/protyle/util/insertHTML.ts @@ -1,7 +1,7 @@ import {hasClosestBlock, hasClosestByAttribute, hasClosestByClassName, hasClosestByTag} from "./hasClosest"; import * as dayjs from "dayjs"; import {transaction, updateTransaction} from "../wysiwyg/transaction"; -import {getContenteditableElement} from "../wysiwyg/getBlock"; +import {getContenteditableElement, getParentBlock} from "../wysiwyg/getBlock"; import { fixTableRange, focusBlock, @@ -545,7 +545,7 @@ export const insertHTML = (html: string, protyle: IProtyle, isBlock = false, data: oldHTML, id, previousID: blockElement.previousElementSibling ? blockElement.previousElementSibling.getAttribute("data-node-id") : "", - parentID: blockElement.parentElement.getAttribute("data-node-id") || protyle.block.parentID + parentID: getParentBlock(blockElement).getAttribute("data-node-id") || protyle.block.parentID }); blockElement.remove(); } diff --git a/app/src/protyle/wysiwyg/getBlock.ts b/app/src/protyle/wysiwyg/getBlock.ts index 4976f1e1a..79a6a3a03 100644 --- a/app/src/protyle/wysiwyg/getBlock.ts +++ b/app/src/protyle/wysiwyg/getBlock.ts @@ -1,6 +1,13 @@ import {hasClosestBlock, hasClosestByAttribute, isInEmbedBlock} from "../util/hasClosest"; import {Constants} from "../../constants"; +export const getParentBlock = (element: Element) => { + if (element.parentElement.classList.contains("callout-content")) { + return element.parentElement.parentElement; + } + return element.parentElement; +}; + export const getCalloutInfo = (element: Element) => { const icon = element.querySelector(".callout-icon").textContent; return (icon ? icon + " " : "") + element.querySelector(".callout-title").textContent; diff --git a/app/src/protyle/wysiwyg/keydown.ts b/app/src/protyle/wysiwyg/keydown.ts index 068fee64d..e7380cb7e 100644 --- a/app/src/protyle/wysiwyg/keydown.ts +++ b/app/src/protyle/wysiwyg/keydown.ts @@ -25,7 +25,7 @@ import { getContenteditableElement, getFirstBlock, getLastBlock, - getNextBlock, + getNextBlock, getParentBlock, getPreviousBlock, getTopAloneElement, hasNextSibling, @@ -356,12 +356,9 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => { protyle.contentElement.scrollTop = protyle.contentElement.scrollTop + top; protyle.scroll.lastScrollTop = protyle.contentElement.scrollTop + 1; } - } else if (!selectElements[0].parentElement.classList.contains("protyle-wysiwyg")) { + } else if (!getParentBlock(selectElements[0]).classList.contains("protyle-wysiwyg")) { hideElements(["select"], protyle); - const parentBlockElement = hasClosestBlock(selectElements[0].parentElement); - if (parentBlockElement) { - parentBlockElement.classList.add("protyle-wysiwyg--select"); - } + getParentBlock(selectElements[0]).classList.add("protyle-wysiwyg--select"); } } }); @@ -385,12 +382,9 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => { protyle.contentElement.scrollTop = protyle.contentElement.scrollTop + bottom; protyle.scroll.lastScrollTop = protyle.contentElement.scrollTop - 1; } - } else if (!selectLastElement.parentElement.classList.contains("protyle-wysiwyg")) { + } else if (!getParentBlock(selectLastElement).classList.contains("protyle-wysiwyg")) { hideElements(["select"], protyle); - const parentBlockElement = hasClosestBlock(selectLastElement.parentElement); - if (parentBlockElement) { - parentBlockElement.classList.add("protyle-wysiwyg--select"); - } + getParentBlock(selectLastElement).classList.add("protyle-wysiwyg--select"); } } }); @@ -413,12 +407,9 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => { protyle.contentElement.scrollTop = protyle.contentElement.scrollTop + top; protyle.scroll.lastScrollTop = protyle.contentElement.scrollTop + 1; } - } else if (!startEndElement.endElement.parentElement.classList.contains("protyle-wysiwyg")) { + } else if (!getParentBlock(startEndElement.endElement).classList.contains("protyle-wysiwyg")) { hideElements(["select"], protyle); - const parentBlockElement = hasClosestBlock(startEndElement.endElement.parentElement); - if (parentBlockElement) { - parentBlockElement.classList.add("protyle-wysiwyg--select"); - } + getParentBlock(startEndElement.endElement).classList.add("protyle-wysiwyg--select"); } } else { startEndElement.endElement.classList.remove("protyle-wysiwyg--select"); @@ -452,10 +443,7 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => { if (nextElement.getBoundingClientRect().width === 0) { // https://github.com/siyuan-note/siyuan/issues/11194 hideElements(["select"], protyle); - const parentBlockElement = hasClosestBlock(startEndElement.endElement.parentElement); - if (parentBlockElement) { - parentBlockElement.classList.add("protyle-wysiwyg--select"); - } + getParentBlock(startEndElement.endElement).classList.add("protyle-wysiwyg--select"); } else { nextElement.classList.add("protyle-wysiwyg--select"); nextElement.setAttribute("select-end", "true"); @@ -466,12 +454,9 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => { protyle.scroll.lastScrollTop = protyle.contentElement.scrollTop - 1; } } - } else if (!startEndElement.endElement.parentElement.classList.contains("protyle-wysiwyg")) { + } else if (!getParentBlock(startEndElement.endElement).classList.contains("protyle-wysiwyg")) { hideElements(["select"], protyle); - const parentBlockElement = hasClosestBlock(startEndElement.endElement.parentElement); - if (parentBlockElement) { - parentBlockElement.classList.add("protyle-wysiwyg--select"); - } + getParentBlock(startEndElement.endElement).classList.add("protyle-wysiwyg--select"); } } else { startEndElement.endElement.classList.remove("protyle-wysiwyg--select"); diff --git a/app/src/protyle/wysiwyg/remove.ts b/app/src/protyle/wysiwyg/remove.ts index b9c18f480..958c61551 100644 --- a/app/src/protyle/wysiwyg/remove.ts +++ b/app/src/protyle/wysiwyg/remove.ts @@ -2,7 +2,7 @@ import {focusBlock, focusByRange, focusByWbr, getSelectionOffset, setLastNodeRan import { getContenteditableElement, getLastBlock, - getNextBlock, + getNextBlock, getParentBlock, getPreviousBlock, getTopAloneElement, getTopEmptyElement, @@ -126,13 +126,12 @@ export const removeBlock = async (protyle: IProtyle, blockElement: Element, rang } previousID = unfoldData[foldId].previousID; } - const parentElement = hasClosestBlock(topElement.parentElement); inserts.push({ action: "insert", data, id, previousID, - parentID: (parentElement ? parentElement.getAttribute("data-node-id") : null) || protyle.block.parentID + parentID: getParentBlock(topElement)?.getAttribute("data-node-id") || protyle.block.parentID }); if (topElement.getAttribute("data-subtype") === "o" && topElement.classList.contains("li")) { listElement = topElement.parentElement;