Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2025-12-20 08:30:12 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions

🎨 https://github.com/siyuan-note/siyuan/issues/10029

Browse source
This commit is contained in:
Vanessa 2024-01-01 11:43:49 +08:00
parent fcd77b05ad
commit 29315814bb
2 changed files with 52 additions and 34 deletions
Download patch file Download diff file Expand all files Collapse all files

59
app/src/menus/protyle.ts
View file

@ -248,10 +248,9 @@ export const fileAnnotationRefMenu = (protyle: IProtyle, refElement: HTMLElement
label: `${window.siyuan.languages.turnInto} <b>${window.siyuan.languages.text}</b>`, label: `${window.siyuan.languages.turnInto} <b>${window.siyuan.languages.text}</b>`,
icon: "iconRefresh", icon: "iconRefresh",
click() { click() {
refElement.outerHTML = `${refElement.innerHTML}<wbr>`;
nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss")); nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss"));
removeInlineType(refElement, "file-annotation-ref", protyle.toolbar.range);
updateTransaction(protyle, id, nodeElement.outerHTML, oldHTML); updateTransaction(protyle, id, nodeElement.outerHTML, oldHTML);
focusByWbr(nodeElement, protyle.toolbar.range);
oldHTML = nodeElement.outerHTML; oldHTML = nodeElement.outerHTML;
} }
}).element); }).element);
@ -477,10 +476,9 @@ export const refMenu = (protyle: IProtyle, element: HTMLElement) => {
submenu = submenu.concat([{ submenu = submenu.concat([{
label: window.siyuan.languages.text, label: window.siyuan.languages.text,
click() { click() {
element.outerHTML = `${element.innerHTML}<wbr>`;
nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss")); nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss"));
removeInlineType(element, "block-ref", protyle.toolbar.range);
updateTransaction(protyle, id, nodeElement.outerHTML, oldHTML); updateTransaction(protyle, id, nodeElement.outerHTML, oldHTML);
focusByWbr(nodeElement, protyle.toolbar.range);
oldHTML = nodeElement.outerHTML; oldHTML = nodeElement.outerHTML;
} }
}, { }, {
@ -1100,8 +1098,9 @@ export const linkMenu = (protyle: IProtyle, linkElement: HTMLElement, focusText
} }
hideElements(["util", "toolbar", "hint"], protyle); hideElements(["util", "toolbar", "hint"], protyle);
const id = nodeElement.getAttribute("data-node-id"); const id = nodeElement.getAttribute("data-node-id");
const html = nodeElement.outerHTML; let html = nodeElement.outerHTML;
const linkAddress = linkElement.getAttribute("data-href"); const linkAddress = linkElement.getAttribute("data-href");
let inputElements: NodeListOf<HTMLTextAreaElement>
window.siyuan.menus.menu.append(new MenuItem({ window.siyuan.menus.menu.append(new MenuItem({
iconHTML: "", iconHTML: "",
type: "readonly", type: "readonly",
@ -1115,7 +1114,7 @@ export const linkMenu = (protyle: IProtyle, linkElement: HTMLElement, focusText
<textarea style="width: ${isMobile() ? "200" : "360"}px;margin: 4px 0;" rows="1" class="b3-text-field"></textarea>`, <textarea style="width: ${isMobile() ? "200" : "360"}px;margin: 4px 0;" rows="1" class="b3-text-field"></textarea>`,
bind(element) { bind(element) {
element.style.maxWidth = "none"; element.style.maxWidth = "none";
const inputElements = element.querySelectorAll("textarea"); inputElements = element.querySelectorAll("textarea");
inputElements[0].value = Lute.UnEscapeHTMLStr(linkAddress) || ""; inputElements[0].value = Lute.UnEscapeHTMLStr(linkAddress) || "";
inputElements[0].addEventListener("keydown", (event) => { inputElements[0].addEventListener("keydown", (event) => {
if ((event.key === "Enter" || event.key === "Escape") && !event.isComposing) { if ((event.key === "Enter" || event.key === "Escape") && !event.isComposing) {
@ -1202,14 +1201,6 @@ export const linkMenu = (protyle: IProtyle, linkElement: HTMLElement, focusText
} }
}).element); }).element);
} }
window.siyuan.menus.menu.append(new MenuItem({
label: `${window.siyuan.languages.turnInto} <b>${window.siyuan.languages.text}</b>`,
icon: "iconRefresh",
click() {
removeInlineType(linkElement, protyle.toolbar.range);
updateTransaction(protyle, id, nodeElement.outerHTML, html);
}
}).element);
if (linkAddress?.startsWith("siyuan://blocks/")) { if (linkAddress?.startsWith("siyuan://blocks/")) {
window.siyuan.menus.menu.append(new MenuItem({ window.siyuan.menus.menu.append(new MenuItem({
label: `${window.siyuan.languages.turnInto} <b>${window.siyuan.languages.ref}</b>`, label: `${window.siyuan.languages.turnInto} <b>${window.siyuan.languages.ref}</b>`,
@ -1220,7 +1211,9 @@ export const linkMenu = (protyle: IProtyle, linkElement: HTMLElement, focusText
types.push("block-ref"); types.push("block-ref");
types.splice(types.indexOf("a"), 1); types.splice(types.indexOf("a"), 1);
linkElement.setAttribute("data-type", types.join(" ")); linkElement.setAttribute("data-type", types.join(" "));
linkElement.setAttribute("data-id", linkAddress?.replace("siyuan://blocks/", "")); linkElement.setAttribute("data-id", inputElements[0].value.replace("siyuan://blocks/", ""));
inputElements[0].value = "";
inputElements[2].value = "";
linkElement.removeAttribute("data-href"); linkElement.removeAttribute("data-href");
linkElement.removeAttribute("data-title"); linkElement.removeAttribute("data-title");
nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss")); nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss"));
@ -1228,19 +1221,32 @@ export const linkMenu = (protyle: IProtyle, linkElement: HTMLElement, focusText
protyle.toolbar.range.selectNode(linkElement); protyle.toolbar.range.selectNode(linkElement);
protyle.toolbar.range.collapse(false); protyle.toolbar.range.collapse(false);
focusByRange(protyle.toolbar.range); focusByRange(protyle.toolbar.range);
html = nodeElement.outerHTML;
} }
}).element); }).element);
} }
window.siyuan.menus.menu.append(new MenuItem({
label: `${window.siyuan.languages.turnInto} <b>${window.siyuan.languages.text}</b>`,
icon: "iconRefresh",
click() {
inputElements[0].value = "";
inputElements[2].value = "";
nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss"));
removeInlineType(linkElement, "a", protyle.toolbar.range);
updateTransaction(protyle, id, nodeElement.outerHTML, html);
html = nodeElement.outerHTML;
}
}).element);
window.siyuan.menus.menu.append(new MenuItem({ window.siyuan.menus.menu.append(new MenuItem({
icon: "iconTrashcan", icon: "iconTrashcan",
label: window.siyuan.languages.remove, label: window.siyuan.languages.remove,
click() { click() {
const oldHTML = nodeElement.outerHTML;
linkElement.insertAdjacentHTML("afterend", "<wbr>"); linkElement.insertAdjacentHTML("afterend", "<wbr>");
linkElement.remove(); linkElement.remove();
nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss")); nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss"));
updateTransaction(protyle, id, nodeElement.outerHTML, oldHTML); updateTransaction(protyle, id, nodeElement.outerHTML, html);
focusByWbr(nodeElement, protyle.toolbar.range); focusByWbr(nodeElement, protyle.toolbar.range);
html = nodeElement.outerHTML;
} }
}).element); }).element);
if (protyle?.app?.plugins) { if (protyle?.app?.plugins) {
@ -1261,29 +1267,34 @@ export const linkMenu = (protyle: IProtyle, linkElement: HTMLElement, focusText
h: 26 h: 26
}); });
window.siyuan.menus.menu.element.setAttribute("data-from", hasClosestByClassName(protyle.element, "block__edit") ? "popover" : "app"); window.siyuan.menus.menu.element.setAttribute("data-from", hasClosestByClassName(protyle.element, "block__edit") ? "popover" : "app");
const textElements = window.siyuan.menus.menu.element.querySelectorAll("textarea");
if (focusText || protyle.lute.IsValidLinkDest(linkAddress)) { if (focusText || protyle.lute.IsValidLinkDest(linkAddress)) {
textElements[1].select(); inputElements[1].select();
} else { } else {
textElements[0].select(); inputElements[0].select();
} }
window.siyuan.menus.menu.removeCB = () => { window.siyuan.menus.menu.removeCB = () => {
if (textElements[2].value) { if (inputElements[2].value) {
linkElement.setAttribute("data-title", Lute.EscapeHTMLStr(textElements[2].value.replace(/\n|\r\n|\r|\u2028|\u2029/g, ""))); linkElement.setAttribute("data-title", Lute.EscapeHTMLStr(inputElements[2].value.replace(/\n|\r\n|\r|\u2028|\u2029/g, "")));
} else { } else {
linkElement.removeAttribute("data-title"); linkElement.removeAttribute("data-title");
} }
linkElement.setAttribute("data-href", Lute.EscapeHTMLStr(textElements[0].value.replace(/\n|\r\n|\r|\u2028|\u2029/g, ""))); if (inputElements[0].value) {
linkElement.setAttribute("data-href", Lute.EscapeHTMLStr(inputElements[0].value.replace(/\n|\r\n|\r|\u2028|\u2029/g, "")));
} else if (linkElement.getAttribute("data-type").indexOf("a") === -1) {
linkElement.removeAttribute("data-href");
}
const currentRange = getSelection().rangeCount === 0 ? undefined : getSelection().getRangeAt(0); const currentRange = getSelection().rangeCount === 0 ? undefined : getSelection().getRangeAt(0);
if (linkElement.textContent === "" || linkElement.textContent === Constants.ZWSP) { if (linkElement.textContent === "" || linkElement.textContent === Constants.ZWSP) {
removeInlineType(linkElement, (currentRange && !protyle.element.contains(currentRange.startContainer)) ? protyle.toolbar.range : undefined); removeInlineType(linkElement, "a", (currentRange && !protyle.element.contains(currentRange.startContainer)) ? protyle.toolbar.range : undefined);
} else if (currentRange && !protyle.element.contains(currentRange.startContainer)) { } else if (currentRange && !protyle.element.contains(currentRange.startContainer)) {
protyle.toolbar.range.selectNodeContents(linkElement); protyle.toolbar.range.selectNodeContents(linkElement);
protyle.toolbar.range.collapse(false); protyle.toolbar.range.collapse(false);
focusByRange(protyle.toolbar.range); focusByRange(protyle.toolbar.range);
} }
if (html !== nodeElement.outerHTML) {
nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss")); nodeElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss"));
updateTransaction(protyle, id, nodeElement.outerHTML, html); updateTransaction(protyle, id, nodeElement.outerHTML, html);
}
}; };
}; };

23
app/src/protyle/toolbar/util.ts
View file

@ -64,25 +64,32 @@ export const removeSearchMark = (element: HTMLElement) => {
} }
}; };
export const removeInlineType = (linkElement: HTMLElement, range?: Range) => { export const removeInlineType = (inlineElement: HTMLElement, type: string, range?: Range) => {
const types = linkElement.getAttribute("data-type").split(" "); const types = inlineElement.getAttribute("data-type").split(" ");
if (types.length === 1) { if (types.length === 1) {
const linkParentElement = linkElement.parentElement; const linkParentElement = inlineElement.parentElement;
linkElement.outerHTML = linkElement.innerHTML.replace(Constants.ZWSP, "") + "<wbr>"; inlineElement.outerHTML = inlineElement.innerHTML.replace(Constants.ZWSP, "") + "<wbr>";
if (range) { if (range) {
focusByWbr(linkParentElement, range); focusByWbr(linkParentElement, range);
} }
} else { } else {
types.find((itemType, index) => { types.find((itemType, index) => {
if ("a" === itemType) { if (type === itemType) {
types.splice(index, 1); types.splice(index, 1);
return true; return true;
} }
}); });
linkElement.setAttribute("data-type", types.join(" ")); inlineElement.setAttribute("data-type", types.join(" "));
linkElement.removeAttribute("data-href"); if (type === "a") {
inlineElement.removeAttribute("data-href");
} else if (type === "file-annotation-ref") {
inlineElement.removeAttribute("data-id");
} else if (type === "block-ref") {
inlineElement.removeAttribute("data-id");
inlineElement.removeAttribute("data-subtype");
}
if (range) { if (range) {
range.selectNodeContents(linkElement); range.selectNodeContents(inlineElement);
range.collapse(false); range.collapse(false);
focusByRange(range); focusByRange(range);
} }