Andreas/siyuan
1
0
Fork 0
mirror of https://github.com/siyuan-note/siyuan.git synced 2026-01-20 15:26:09 +01:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

🐛 fix https://github.com/siyuan-note/siyuan/issues/9822

Browse source
This commit is contained in:
Vanessa 2023-12-06 12:30:38 +08:00
parent 16fa8a4548
commit fa1f786833
4 changed files with 79 additions and 76 deletions
Download patch file Download diff file Expand all files Collapse all files

8
app/src/mobile/util/keyboardToolbar.ts
View file

@ -11,7 +11,7 @@ import {focusByRange, getSelectionPosition} from "../../protyle/util/selection";
import {getCurrentEditor} from "../editor";
import {fontEvent, getFontNodeElements} from "../../protyle/toolbar/Font";
import {hideElements} from "../../protyle/ui/hideElements";
import {input} from "../../protyle/wysiwyg/input";
import {softEnter} from "../../protyle/wysiwyg/enter";
let renderKeyboardToolbarTimeout: number;
let showUtil = false;
@ -634,9 +634,9 @@ export const initKeyboardToolbar = () => {
focusByRange(range);
return;
} else if (type === "softLine") {
range.insertNode(document.createTextNode("\n"));
range.collapse(false);
input(protyle, nodeElement, range);
range.extractContents();
softEnter(range, nodeElement, protyle);
focusByRange(range);
return;
} else if (type === "add") {
if (buttonElement.classList.contains("protyle-toolbar__item--current")) {

70
app/src/protyle/wysiwyg/enter.ts
View file

@ -1,5 +1,5 @@
import {genEmptyElement, insertEmptyBlock} from "../../block/util";
import {getSelectionOffset, focusByWbr, setLastNodeRange, focusBlock} from "../util/selection";
import {getSelectionOffset, focusByWbr, setLastNodeRange, focusBlock, focusByRange} from "../util/selection";
import {
getContenteditableElement,
getTopEmptyElement,
@ -13,8 +13,9 @@ import {highlightRender} from "../render/highlightRender";
import {Constants} from "../../constants";
import {scrollCenter} from "../../util/highlightById";
import {hideElements} from "../ui/hideElements";
import {setStorageVal} from "../util/compatibility";
import {isIPad, setStorageVal} from "../util/compatibility";
import {mathRender} from "../render/mathRender";
import {isMobile} from "../../util/functions";
const listEnter = (protyle: IProtyle, blockElement: HTMLElement, range: Range) => {
const listItemElement = blockElement.parentElement;
@ -418,3 +419,68 @@ const removeEmptyNode = (newElement: Element) => {
}
}
};
export const softEnter = (range: Range, nodeElement: HTMLElement, protyle: IProtyle) => {
let startElement = range.startContainer as HTMLElement;
const nextSibling = hasNextSibling(startElement) as Element;
// 图片之前软换行
if (nextSibling && nextSibling.nodeType !== 3 && nextSibling.classList.contains("img")) {
nextSibling.insertAdjacentHTML("beforebegin", "<wbr>");
const oldHTML = nodeElement.outerHTML;
nextSibling.previousElementSibling.remove();
const newlineNode = document.createTextNode("\n");
startElement.after(document.createTextNode(Constants.ZWSP));
startElement.after(newlineNode);
range.selectNode(newlineNode);
range.collapse(false);
updateTransaction(protyle, nodeElement.getAttribute("data-node-id"), nodeElement.outerHTML, oldHTML);
return true;
}
// 行内元素末尾软换行 https://github.com/siyuan-note/insider/issues/886
if (startElement.nodeType === 3) {
startElement = startElement.parentElement;
}
if (startElement && protyle.toolbar.getCurrentType(range).length > 0 &&
getSelectionOffset(startElement, startElement, range).end === startElement.textContent.length) {
addNewLineToEnd(range, nodeElement, protyle, startElement);
return true;
}
if (isIPad() || isMobile()) {
// iPad shift+enter 无效
startElement = range.startContainer as HTMLElement;
const nextSibling = hasNextSibling(startElement);
if (nextSibling && nextSibling.textContent.trim() !== "") {
document.execCommand("insertHTML", false, "\n");
return true;
}
addNewLineToEnd(range, nodeElement, protyle, startElement);
return true;
}
return false
}
const addNewLineToEnd = (range: Range, nodeElement: HTMLElement, protyle: IProtyle, startElement: Element) => {
const wbrElement = document.createElement("wbr");
if (startElement.nodeType === 3) {
range.insertNode(wbrElement);
} else {
startElement.insertAdjacentElement("afterend", wbrElement);
}
const oldHTML = nodeElement.outerHTML;
wbrElement.remove();
let endNewlineNode
if (!hasNextSibling(startElement)) {
endNewlineNode = document.createTextNode("\n");
startElement.after(endNewlineNode);
}
const newlineNode = document.createTextNode("\n");
startElement.after(newlineNode);
if (endNewlineNode) {
range.setStart(endNewlineNode, 0);
} else {
range.setStart(newlineNode, 1);
}
range.collapse(true);
focusByRange(range);
updateTransaction(protyle, nodeElement.getAttribute("data-node-id"), nodeElement.outerHTML, oldHTML);
}

4
app/src/protyle/wysiwyg/input.ts
View file

@ -45,12 +45,13 @@ export const input = async (protyle: IProtyle, blockElement: HTMLElement, range:
focusByWbr(blockElement, range);
return;
}
blockElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss"));
const wbrElement = document.createElement("wbr");
range.insertNode(wbrElement);
const id = blockElement.getAttribute("data-node-id");
if (type !== "NodeCodeBlock" && (editElement.innerHTML.endsWith("\n<wbr>") || editElement.innerHTML.endsWith("\n<wbr>\n"))) {
// 软换行
updateTransaction(protyle, id, blockElement.outerHTML, blockElement.outerHTML.replace("\n<wbr>", "<wbr>"));
updateTransaction(protyle, id, blockElement.outerHTML, protyle.wysiwyg.lastHTMLs[id] || blockElement.outerHTML.replace("\n<wbr>", "<wbr>"));
wbrElement.remove();
return;
}
@ -69,7 +70,6 @@ export const input = async (protyle: IProtyle, blockElement: HTMLElement, range:
brElement.remove();
}
blockElement.setAttribute("updated", dayjs().format("YYYYMMDDHHmmss"));
if (editElement.innerHTML === "》<wbr>" || editElement.innerHTML.indexOf("\n》<wbr>") > -1) {
editElement.innerHTML = editElement.innerHTML.replace("》<wbr>", "><wbr>");
}

73
app/src/protyle/wysiwyg/keydown.ts
View file

@ -22,12 +22,11 @@ import {
getNextBlock,
getPreviousBlock,
getTopAloneElement,
hasNextSibling,
hasPreviousSibling,
isNotEditBlock,
} from "./getBlock";
import {matchHotKey} from "../util/hotKey";
import {enter} from "./enter";
import {enter, softEnter} from "./enter";
import {fixTable} from "../util/table";
import {
turnsIntoOneTransaction, turnsIntoTransaction,
@ -866,72 +865,10 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => {
}
// 软换行
if (matchHotKey("⇧↩", event) && selectText === "") {
let startElement = range.startContainer as HTMLElement;
const nextSibling = hasNextSibling(startElement) as Element;
// 图片之前软换行
if (nextSibling && nextSibling.nodeType !== 3 && nextSibling.classList.contains("img")) {
nextSibling.insertAdjacentHTML("beforebegin", "<wbr>");
const oldHTML = nodeElement.outerHTML;
nextSibling.previousElementSibling.remove();
const newlineNode = document.createTextNode("\n");
startElement.after(document.createTextNode(Constants.ZWSP));
startElement.after(newlineNode);
range.selectNode(newlineNode);
range.collapse(false);
updateTransaction(protyle, nodeElement.getAttribute("data-node-id"), nodeElement.outerHTML, oldHTML);
event.stopPropagation();
event.preventDefault();
return;
}
// 行内元素软换行 https://github.com/siyuan-note/insider/issues/886
if (startElement.nodeType === 3) {
startElement = startElement.parentElement;
}
if (startElement && protyle.toolbar.getCurrentType(range).length > 0 &&
getSelectionOffset(startElement, startElement, range).end === startElement.textContent.length) {
startElement.insertAdjacentHTML("afterend", "<wbr>");
const oldHTML = nodeElement.outerHTML;
startElement.nextElementSibling.remove();
if (!hasNextSibling(startElement)) {
startElement.after(document.createTextNode("\n"));
}
const newlineNode = document.createTextNode("\n");
startElement.after(newlineNode);
range.selectNode(newlineNode);
range.collapse(false);
updateTransaction(protyle, nodeElement.getAttribute("data-node-id"), nodeElement.outerHTML, oldHTML);
event.stopPropagation();
event.preventDefault();
return;
}
if (window.siyuan.config.system.container === "ios") {
// iPad shift+enter 无效
startElement = range.startContainer as HTMLElement;
const nextSibling = hasNextSibling(startElement);
if (nextSibling && nextSibling.textContent.trim() !== "") {
document.execCommand("insertHTML", false, "\n");
event.stopPropagation();
event.preventDefault();
return;
}
if (!nextSibling) {
startElement.after(document.createTextNode("\n"));
}
const newlineNode = document.createTextNode("\n");
startElement.after(newlineNode);
const newlineNextSibling = hasNextSibling(newlineNode);
if (newlineNextSibling && newlineNextSibling.textContent === "\n") {
range.setStart(newlineNextSibling, 0);
} else {
range.setStart(newlineNode, 0);
}
range.collapse(false);
focusByRange(range);
event.stopPropagation();
event.preventDefault();
return;
}
if (matchHotKey("⇧↩", event) && selectText === "" && softEnter(range, nodeElement, protyle)) {
event.stopPropagation();
event.preventDefault();
return;
}
// 回车