diff --git a/app/src/menus/protyle.ts b/app/src/menus/protyle.ts index 38078c55f..a64ef0e9b 100644 --- a/app/src/menus/protyle.ts +++ b/app/src/menus/protyle.ts @@ -598,12 +598,14 @@ export const zoomOut = (options: { data: getResponse, protyle: options.protyle, action: options.id === options.protyle.block.rootID ? [Constants.CB_GET_FOCUS, Constants.CB_GET_HTML] : [Constants.CB_GET_ALL, Constants.CB_GET_FOCUS, Constants.CB_GET_HTML], + afterCB: options.callback }); } else { onGet({ data: getResponse, protyle: options.protyle, action: options.id === options.protyle.block.rootID ? [Constants.CB_GET_FOCUS, Constants.CB_GET_HTML, Constants.CB_GET_UNUNDO] : [Constants.CB_GET_ALL, Constants.CB_GET_FOCUS, Constants.CB_GET_UNUNDO, Constants.CB_GET_HTML], + afterCB: options.callback }); } // https://github.com/siyuan-note/siyuan/issues/4874 @@ -643,9 +645,6 @@ export const zoomOut = (options: { updateBacklinkGraph(allModels, options.protyle); } /// #endif - if (options.callback) { - options.callback(); - } }); }; diff --git a/app/src/protyle/wysiwyg/transaction.ts b/app/src/protyle/wysiwyg/transaction.ts index 62719954c..1df7e4217 100644 --- a/app/src/protyle/wysiwyg/transaction.ts +++ b/app/src/protyle/wysiwyg/transaction.ts @@ -6,7 +6,7 @@ import {blockRender} from "../render/blockRender"; import {processRender} from "../util/processCode"; import {highlightRender} from "../render/highlightRender"; import {hasClosestBlock, hasClosestByAttribute} from "../util/hasClosest"; -import {setFold} from "../../menus/protyle"; +import {setFold, zoomOut} from "../../menus/protyle"; import {onGet} from "../util/onGet"; /// #if !MOBILE import {getAllModels} from "../../layout/getAll"; @@ -317,6 +317,54 @@ const updateEmbed = (protyle: IProtyle, operation: IOperation) => { } }; +const deleteBlock = (updateElements: Element[], id: string, protyle: IProtyle) => { + if (focus) { + focusSideBlock(updateElements[0]); + } + updateElements.forEach(item => { + item.remove(); + }); + // 更新 ws 嵌入块 + protyle.wysiwyg.element.querySelectorAll('[data-type="NodeBlockQueryEmbed"]').forEach((item) => { + if (item.querySelector(`[data-node-id="${id}"]`)) { + item.removeAttribute("data-render"); + blockRender(protyle, item); + } + }); +} + +const updateBlock = (updateElements: Element[], protyle: IProtyle, operation: IOperation) => { + updateElements.forEach(item => { + item.outerHTML = operation.data; + }); + Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${operation.id}"]`)).find(item => { + if (item.getAttribute("data-type") === "NodeBlockQueryEmbed" // 引用转换为块嵌入,undo、redo 后也需要更新 updateElement + || !hasClosestByAttribute(item, "data-type", "NodeBlockQueryEmbed")) { + updateElements[0] = item; + return true; + } + }); + const wbrElement = updateElements[0].querySelector("wbr"); + if (focus) { + const range = getEditorRange(updateElements[0]); + if (wbrElement) { + focusByWbr(updateElements[0], range); + } else { + focusBlock(updateElements[0]); + } + } else if (wbrElement) { + wbrElement.remove(); + } + processRender(updateElements.length === 1 ? updateElements[0] : protyle.wysiwyg.element); + highlightRender(updateElements.length === 1 ? updateElements[0] : protyle.wysiwyg.element); + avRender(updateElements.length === 1 ? updateElements[0] : protyle.wysiwyg.element); + blockRender(protyle, updateElements.length === 1 ? updateElements[0] : protyle.wysiwyg.element); + // 更新 ws 嵌入块 + updateEmbed(protyle, operation); + // 更新 ws 引用块 + updateRef(protyle, operation.id); +} + // 用于推送和撤销 export const onTransaction = (protyle: IProtyle, operation: IOperation, focus: boolean) => { const updateElements: Element[] = []; @@ -375,54 +423,44 @@ export const onTransaction = (protyle: IProtyle, operation: IOperation, focus: b } if (operation.action === "delete") { if (updateElements.length > 0) { - if (focus) { - focusSideBlock(updateElements[0]); - } - updateElements.forEach(item => { - item.remove(); + deleteBlock(updateElements, operation.id, protyle); + } else { + zoomOut({ + protyle, + id: protyle.block.rootID, + isPushBack: false, + focusId: operation.id, + callback() { + Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${operation.id}"]`)).forEach(item => { + if (!hasClosestByAttribute(item.parentElement, "data-type", "NodeBlockQueryEmbed")) { + updateElements.push(item); + } + }); + deleteBlock(updateElements, operation.id, protyle); + } }); } - // 更新 ws 嵌入块 - protyle.wysiwyg.element.querySelectorAll('[data-type="NodeBlockQueryEmbed"]').forEach((item) => { - if (item.querySelector(`[data-node-id="${operation.id}"]`)) { - item.removeAttribute("data-render"); - blockRender(protyle, item); - } - }); return; } if (operation.action === "update") { if (updateElements.length > 0) { - updateElements.forEach(item => { - item.outerHTML = operation.data; - }); - Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${operation.id}"]`)).find(item => { - if (item.getAttribute("data-type") === "NodeBlockQueryEmbed" // 引用转换为块嵌入,undo、redo 后也需要更新 updateElement - || !hasClosestByAttribute(item, "data-type", "NodeBlockQueryEmbed")) { - updateElements[0] = item; - return true; + updateBlock(updateElements, protyle, operation); + } else { + zoomOut({ + protyle, + id: protyle.block.rootID, + isPushBack: false, + focusId: operation.id, + callback() { + Array.from(protyle.wysiwyg.element.querySelectorAll(`[data-node-id="${operation.id}"]`)).forEach(item => { + if (!hasClosestByAttribute(item.parentElement, "data-type", "NodeBlockQueryEmbed")) { + updateElements.push(item); + } + }); + updateBlock(updateElements, protyle, operation); } }); - const wbrElement = updateElements[0].querySelector("wbr"); - if (focus) { - const range = getEditorRange(updateElements[0]); - if (wbrElement) { - focusByWbr(updateElements[0], range); - } else { - focusBlock(updateElements[0]); - } - } else if (wbrElement) { - wbrElement.remove(); - } - processRender(updateElements.length === 1 ? updateElements[0] : protyle.wysiwyg.element); - highlightRender(updateElements.length === 1 ? updateElements[0] : protyle.wysiwyg.element); - avRender(updateElements.length === 1 ? updateElements[0] : protyle.wysiwyg.element); - blockRender(protyle, updateElements.length === 1 ? updateElements[0] : protyle.wysiwyg.element); } - // 更新 ws 嵌入块 - updateEmbed(protyle, operation); - // 更新 ws 引用块 - updateRef(protyle, operation.id); return; } if (operation.action === "updateAttrs") { // 调用接口才推送