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

✨ https://github.com/siyuan-note/siyuan/issues/597

Browse source
This commit is contained in:
Vanessa 2022-12-30 17:31:28 +08:00
parent fc66472637
commit a4953fa945
14 changed files with 28 additions and 21 deletions
Download patch file Download diff file Expand all files Collapse all files

4
app/src/assets/scss/_wysiwyg.scss
View file

@ -19,7 +19,7 @@
box-shadow: 3px 0px 0px -1px var(--b3-protyle-inline-mark-background); box-shadow: 3px 0px 0px -1px var(--b3-protyle-inline-mark-background);
} }
[spellcheck="false"] { [spellcheck] {
word-break: break-word; word-break: break-word;
white-space: pre-wrap; white-space: pre-wrap;
@ -239,7 +239,7 @@
padding: 0; padding: 0;
} }
&.table > [spellcheck="false"] { &.table > [spellcheck] {
overflow: auto; overflow: auto;
& > table.select { & > table.select {

4
app/src/block/util.ts
View file

@ -147,7 +147,7 @@ export const genEmptyBlock = (zwsp = true, wbr = true, string?: string) => {
if (string) { if (string) {
html += string; html += string;
} }
return `<div data-node-id="${Lute.NewNodeID()}" data-type="NodeParagraph" class="p"><div contenteditable="true" spellcheck="false">${html}</div><div contenteditable="false" class="protyle-attr">${Constants.ZWSP}</div></div>`; return `<div data-node-id="${Lute.NewNodeID()}" data-type="NodeParagraph" class="p"><div contenteditable="true" spellcheck="${window.siyuan.config.editor.spellcheck}">${html}</div><div contenteditable="false" class="protyle-attr">${Constants.ZWSP}</div></div>`;
}; };
export const genEmptyElement = (zwsp = true, wbr = true, id?: string) => { export const genEmptyElement = (zwsp = true, wbr = true, id?: string) => {
@ -155,6 +155,6 @@ export const genEmptyElement = (zwsp = true, wbr = true, id?: string) => {
element.setAttribute("data-node-id", id || Lute.NewNodeID()); element.setAttribute("data-node-id", id || Lute.NewNodeID());
element.setAttribute("data-type", "NodeParagraph"); element.setAttribute("data-type", "NodeParagraph");
element.classList.add("p"); element.classList.add("p");
element.innerHTML = `<div contenteditable="true" spellcheck="false">${zwsp ? Constants.ZWSP : ""}${wbr ? "<wbr>" : ""}</div><div class="protyle-attr" contenteditable="false">${Constants.ZWSP}</div>`; element.innerHTML = `<div contenteditable="true" spellcheck="${window.siyuan.config.editor.spellcheck}">${zwsp ? Constants.ZWSP : ""}${wbr ? "<wbr>" : ""}</div><div class="protyle-attr" contenteditable="false">${Constants.ZWSP}</div>`;
return element; return element;
}; };

3
app/src/config/search.ts
View file

@ -16,7 +16,8 @@ export const initConfigSearch = (element: HTMLElement) => {
"md39", "md40", "fontSizeTip", "fontSize", "font", "font1", "generateHistory", "generateHistoryInterval", "md39", "md40", "fontSizeTip", "fontSize", "font", "font1", "generateHistory", "generateHistoryInterval",
"historyRetentionDays", "historyRetentionDaysTip", "clearHistory", "katexMacros", "katexMacrosTip", "historyRetentionDays", "historyRetentionDaysTip", "clearHistory", "katexMacros", "katexMacrosTip",
"editReadonly", "editReadonlyTip", "embedBlockBreadcrumb", "embedBlockBreadcrumbTip", "outdentTip", "editReadonly", "editReadonlyTip", "embedBlockBreadcrumb", "embedBlockBreadcrumbTip", "outdentTip",
"outdent", "floatWindowMode", "floatWindowModeTip", "justify", "justifyTip", "rtl", "rtlTip" "outdent", "floatWindowMode", "floatWindowModeTip", "justify", "justifyTip", "rtl", "rtlTip", "spellcheck",
"spellcheckTip"
]), ]),
// 文档树 // 文档树

2
app/src/layout/dock/Outline.ts
View file

@ -193,7 +193,7 @@ export class Outline extends Model {
let needReload = false; let needReload = false;
data.data[0].doOperations.forEach((item: IOperation) => { data.data[0].doOperations.forEach((item: IOperation) => {
if ((item.action === "update" || item.action === "insert") && if ((item.action === "update" || item.action === "insert") &&
(item.data.indexOf('data-type="NodeHeading"') > -1 || item.data.indexOf('<div contenteditable="true" spellcheck="false"><wbr></div>') > -1)) { (item.data.indexOf('data-type="NodeHeading"') > -1 || item.data.indexOf(`<div contenteditable="true" spellcheck="${window.siyuan.config.editor.spellcheck}"><wbr></div>`) > -1)) {
needReload = true; needReload = true;
} else if (item.action === "delete" || item.action === "move") { } else if (item.action === "delete" || item.action === "move") {
needReload = true; needReload = true;

4
app/src/protyle/gutter/index.ts
View file

@ -591,7 +591,7 @@ export class Gutter {
click() { click() {
let html = ""; let html = "";
selectsElement.forEach(item => { selectsElement.forEach(item => {
item.querySelectorAll('[spellcheck="false"]').forEach(editItem => { item.querySelectorAll('[spellcheck]').forEach(editItem => {
const cloneNode = editItem.cloneNode(true) as HTMLElement; const cloneNode = editItem.cloneNode(true) as HTMLElement;
cloneNode.querySelectorAll('[data-type="backslash"]').forEach(slashItem => { cloneNode.querySelectorAll('[data-type="backslash"]').forEach(slashItem => {
slashItem.firstElementChild.remove(); slashItem.firstElementChild.remove();
@ -980,7 +980,7 @@ export class Gutter {
accelerator: window.siyuan.config.keymap.editor.general.copyPlainText.custom, accelerator: window.siyuan.config.keymap.editor.general.copyPlainText.custom,
click() { click() {
let text = ""; let text = "";
nodeElement.querySelectorAll('[spellcheck="false"]').forEach(item => { nodeElement.querySelectorAll('[spellcheck]').forEach(item => {
const cloneNode = item.cloneNode(true) as HTMLElement; const cloneNode = item.cloneNode(true) as HTMLElement;
cloneNode.querySelectorAll('[data-type="backslash"]').forEach(slashItem => { cloneNode.querySelectorAll('[data-type="backslash"]').forEach(slashItem => {
slashItem.firstElementChild.remove(); slashItem.firstElementChild.remove();

2
app/src/protyle/header/Title.ts
View file

@ -45,7 +45,7 @@ export class Title {
this.element.classList.add("protyle-wysiwyg--attr"); this.element.classList.add("protyle-wysiwyg--attr");
} }
this.element.innerHTML = `<span aria-label="${window.siyuan.languages.gutterTip2}" class="protyle-title__icon" data-type="a" data-position="right"><svg><use xlink:href="#iconFile"></use></svg></span> this.element.innerHTML = `<span aria-label="${window.siyuan.languages.gutterTip2}" class="protyle-title__icon" data-type="a" data-position="right"><svg><use xlink:href="#iconFile"></use></svg></span>
<div contenteditable="true" data-position="center" spellcheck="false" class="protyle-title__input" data-tip="${window.siyuan.languages._kernel[16]}"></div><div class="protyle-attr"></div>`; <div contenteditable="true" data-position="center" spellcheck="${window.siyuan.config.editor.spellcheck}" class="protyle-title__input" data-tip="${window.siyuan.languages._kernel[16]}"></div><div class="protyle-attr"></div>`;
this.editElement = this.element.querySelector(".protyle-title__input"); this.editElement = this.element.querySelector(".protyle-title__input");
this.editElement.addEventListener("paste", (event: ClipboardEvent) => { this.editElement.addEventListener("paste", (event: ClipboardEvent) => {
event.stopPropagation(); event.stopPropagation();

4
app/src/protyle/markdown/highlightRender.ts
View file

@ -9,7 +9,7 @@ export const highlightRender = (element: Element, cdn = Constants.PROTYLE_CDN) =
let isPreview = false; let isPreview = false;
if (element.classList.contains("code-block")) { if (element.classList.contains("code-block")) {
// 编辑器内代码块编辑渲染 // 编辑器内代码块编辑渲染
codeElements = element.querySelectorAll('[spellcheck="false"]'); codeElements = element.querySelectorAll('[spellcheck]');
} else { } else {
if (element.classList.contains("item__readme")) { if (element.classList.contains("item__readme")) {
// bazaar reademe // bazaar reademe
@ -22,7 +22,7 @@ export const highlightRender = (element: Element, cdn = Constants.PROTYLE_CDN) =
codeElements = element.querySelectorAll(".code-block code"); codeElements = element.querySelectorAll(".code-block code");
isPreview = true; isPreview = true;
} else { } else {
codeElements = element.querySelectorAll('.code-block [spellcheck="false"]'); codeElements = element.querySelectorAll('.code-block [spellcheck]');
} }
} }
if (codeElements.length === 0) { if (codeElements.length === 0) {

4
app/src/protyle/util/onGet.ts
View file

@ -336,7 +336,7 @@ export const disabledProtyle = (protyle: IProtyle) => {
}); });
protyle.wysiwyg.element.style.userSelect = "text"; protyle.wysiwyg.element.style.userSelect = "text";
protyle.wysiwyg.element.setAttribute("contenteditable", "false"); protyle.wysiwyg.element.setAttribute("contenteditable", "false");
protyle.wysiwyg.element.querySelectorAll('[contenteditable="true"][spellcheck="false"]').forEach(item => { protyle.wysiwyg.element.querySelectorAll('[contenteditable="true"][spellcheck]').forEach(item => {
item.setAttribute("contenteditable", "false"); item.setAttribute("contenteditable", "false");
}); });
}; };
@ -361,7 +361,7 @@ export const enableProtyle = (protyle: IProtyle) => {
if (protyle.background) { if (protyle.background) {
protyle.background.element.classList.add("protyle-background--enable"); protyle.background.element.classList.add("protyle-background--enable");
} }
protyle.wysiwyg.element.querySelectorAll('[contenteditable="false"][spellcheck="false"]').forEach(item => { protyle.wysiwyg.element.querySelectorAll('[contenteditable="false"][spellcheck]').forEach(item => {
if (!hasClosestByClassName(item, "protyle-wysiwyg__embed")) { if (!hasClosestByClassName(item, "protyle-wysiwyg__embed")) {
item.setAttribute("contenteditable", "true"); item.setAttribute("contenteditable", "true");
} }

2
app/src/protyle/util/paste.ts
View file

@ -237,7 +237,7 @@ export const paste = async (protyle: IProtyle, event: (ClipboardEvent | DragEven
isBlock = false; isBlock = false;
} }
// 从历史中复制后粘贴 // 从历史中复制后粘贴
tempElement.querySelectorAll('[spellcheck="false"][contenteditable="false"]').forEach((e) => { tempElement.querySelectorAll('[contenteditable="false"][spellcheck]').forEach((e) => {
e.setAttribute("contenteditable", "true"); e.setAttribute("contenteditable", "true");
}); });
const tempInnerHTML = tempElement.innerHTML; const tempInnerHTML = tempElement.innerHTML;

2
app/src/protyle/util/processCode.ts
View file

@ -36,7 +36,7 @@ export const processPasteCode = (html: string, text: string) => {
if (isCode) { if (isCode) {
const code = text || html; const code = text || html;
if (/\n/.test(code) || pres.length === 1) { if (/\n/.test(code) || pres.length === 1) {
return `<div data-type="NodeCodeBlock" class="code-block" data-node-id="${Lute.NewNodeID()}"><div class="protyle-action"><span class="protyle-action--first protyle-action__language" contenteditable="false">${localStorage.getItem(Constants.LOCAL_CODELANG) || ""}</span><span class="fn__flex-1"></span><span class="protyle-icon protyle-icon--first protyle-action__copy"><svg><use xlink:href="#iconCopy"></use></svg></span><span class="protyle-icon protyle-icon--last protyle-action__menu"><svg><use xlink:href="#iconMore"></use></svg></span></div><div contenteditable="true" spellcheck="false">${code.replace(/&/g, "&amp;").replace(/</g, "&lt;")}<wbr></div><div class="protyle-attr" contenteditable="false">${Constants.ZWSP}</div></div>`; return `<div data-type="NodeCodeBlock" class="code-block" data-node-id="${Lute.NewNodeID()}"><div class="protyle-action"><span class="protyle-action--first protyle-action__language" contenteditable="false">${localStorage.getItem(Constants.LOCAL_CODELANG) || ""}</span><span class="fn__flex-1"></span><span class="protyle-icon protyle-icon--first protyle-action__copy"><svg><use xlink:href="#iconCopy"></use></svg></span><span class="protyle-icon protyle-icon--last protyle-action__menu"><svg><use xlink:href="#iconMore"></use></svg></span></div><div contenteditable="true" spellcheck="${window.siyuan.config.editor.spellcheck}">${code.replace(/&/g, "&amp;").replace(/</g, "&lt;")}<wbr></div><div class="protyle-attr" contenteditable="false">${Constants.ZWSP}</div></div>`;
} else { } else {
return code; return code;
} }

10
app/src/protyle/util/reload.ts
View file

@ -9,10 +9,16 @@ import {hasClosestByClassName} from "./hasClosest";
export const reloadProtyle = (protyle: IProtyle) => { export const reloadProtyle = (protyle: IProtyle) => {
if (window.siyuan.config.editor.displayBookmarkIcon) { if (window.siyuan.config.editor.displayBookmarkIcon) {
protyle.wysiwyg.element.classList.add("protyle-wysiwyg--attr"); protyle.wysiwyg.element.classList.add("protyle-wysiwyg--attr");
protyle.title?.element.classList.add("protyle-wysiwyg--attr");
} else { } else {
protyle.wysiwyg.element.classList.remove("protyle-wysiwyg--attr"); protyle.wysiwyg.element.classList.remove("protyle-wysiwyg--attr");
protyle.title?.element.classList.remove("protyle-wysiwyg--attr"); }
if (protyle.title) {
protyle.title.element.setAttribute("spellcheck", window.siyuan.config.editor.spellcheck.toString());
if (window.siyuan.config.editor.displayBookmarkIcon) {
protyle.title.element.classList.add("protyle-wysiwyg--attr");
} else {
protyle.title.element.classList.remove("protyle-wysiwyg--attr");
}
} }
protyle.lute.SetProtyleMarkNetImg(window.siyuan.config.editor.displayNetImgMark); protyle.lute.SetProtyleMarkNetImg(window.siyuan.config.editor.displayNetImgMark);
addLoading(protyle); addLoading(protyle);

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

@ -102,13 +102,13 @@ export const input = async (protyle: IProtyle, blockElement: HTMLElement, range:
// 仅有一项的列表才可转换 // 仅有一项的列表才可转换
if (!blockElement.parentElement.parentElement.classList.contains("protyle-wysiwyg") && // https://ld246.com/article/1659315815506 if (!blockElement.parentElement.parentElement.classList.contains("protyle-wysiwyg") && // https://ld246.com/article/1659315815506
blockElement.parentElement.parentElement.childElementCount === 2) { blockElement.parentElement.parentElement.childElementCount === 2) {
html = `<div data-subtype="t" data-node-id="${blockElement.parentElement.parentElement.getAttribute("data-node-id")}" data-type="NodeList" class="list"><div data-marker="*" data-subtype="t" data-node-id="${blockElement.parentElement.getAttribute("data-node-id")}" data-type="NodeListItem" class="li${isDone ? " protyle-task--done" : ""}"><div class="protyle-action protyle-action--task" draggable="true"><svg><use xlink:href="#icon${isDone ? "C" : "Unc"}heck"></use></svg></div><div data-node-id="${id}" data-type="NodeParagraph" class="p"><div contenteditable="true" spellcheck="false"><wbr></div><div class="protyle-attr" contenteditable="false"></div></div><div class="protyle-attr" contenteditable="false"></div></div><div class="protyle-attr" contenteditable="false"></div></div>`; html = `<div data-subtype="t" data-node-id="${blockElement.parentElement.parentElement.getAttribute("data-node-id")}" data-type="NodeList" class="list"><div data-marker="*" data-subtype="t" data-node-id="${blockElement.parentElement.getAttribute("data-node-id")}" data-type="NodeListItem" class="li${isDone ? " protyle-task--done" : ""}"><div class="protyle-action protyle-action--task" draggable="true"><svg><use xlink:href="#icon${isDone ? "C" : "Unc"}heck"></use></svg></div><div data-node-id="${id}" data-type="NodeParagraph" class="p"><div contenteditable="true" spellcheck="${window.siyuan.config.editor.spellcheck}"><wbr></div><div class="protyle-attr" contenteditable="false"></div></div><div class="protyle-attr" contenteditable="false"></div></div><div class="protyle-attr" contenteditable="false"></div></div>`;
id = blockElement.parentElement.parentElement.getAttribute("data-node-id"); id = blockElement.parentElement.parentElement.getAttribute("data-node-id");
blockElement = blockElement.parentElement.parentElement; blockElement = blockElement.parentElement.parentElement;
todoOldHTML = blockElement.outerHTML; todoOldHTML = blockElement.outerHTML;
} }
} else { } else {
html = `<div data-subtype="t" data-node-id="${id}" data-type="NodeList" class="list"><div data-marker="*" data-subtype="t" data-node-id="${Lute.NewNodeID()}" data-type="NodeListItem" class="li${isDone ? " protyle-task--done" : ""}"><div class="protyle-action protyle-action--task" draggable="true"><svg><use xlink:href="#icon${isDone ? "C" : "Unc"}heck"></use></svg></div><div data-node-id="${Lute.NewNodeID()}" data-type="NodeParagraph" class="p"><div contenteditable="true" spellcheck="false"><wbr></div><div class="protyle-attr" contenteditable="false"></div></div><div class="protyle-attr" contenteditable="false"></div></div><div class="protyle-attr" contenteditable="false"></div></div>`; html = `<div data-subtype="t" data-node-id="${id}" data-type="NodeList" class="list"><div data-marker="*" data-subtype="t" data-node-id="${Lute.NewNodeID()}" data-type="NodeListItem" class="li${isDone ? " protyle-task--done" : ""}"><div class="protyle-action protyle-action--task" draggable="true"><svg><use xlink:href="#icon${isDone ? "C" : "Unc"}heck"></use></svg></div><div data-node-id="${Lute.NewNodeID()}" data-type="NodeParagraph" class="p"><div contenteditable="true" spellcheck="${window.siyuan.config.editor.spellcheck}"><wbr></div><div class="protyle-attr" contenteditable="false"></div></div><div class="protyle-attr" contenteditable="false"></div></div><div class="protyle-attr" contenteditable="false"></div></div>`;
todoOldHTML = blockElement.outerHTML; todoOldHTML = blockElement.outerHTML;
} }
} else { } else {

2
app/src/protyle/wysiwyg/removeEmbed.ts
View file

@ -17,7 +17,7 @@ export const removeEmbed = (element: Element, type: "outerHTML" | "innerHTML" =
export const getEnableHTML = (html: string) => { export const getEnableHTML = (html: string) => {
const tempElement = document.createElement("template"); const tempElement = document.createElement("template");
tempElement.innerHTML = html; tempElement.innerHTML = html;
tempElement.content.querySelectorAll('[contenteditable="false"][spellcheck="false"]').forEach(item => { tempElement.content.querySelectorAll('[contenteditable="false"][spellcheck]').forEach(item => {
if (!hasClosestByClassName(item, "protyle-wysiwyg__embed")) { if (!hasClosestByClassName(item, "protyle-wysiwyg__embed")) {
item.setAttribute("contenteditable", "true"); item.setAttribute("contenteditable", "true");
} }

2
app/src/util/assets.ts
View file

@ -174,7 +174,7 @@ export const setInlineStyle = (set = true) => {
.protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h1, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h2, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h3, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h4, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h5, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h6 {line-height:${height + 8}px;} .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h1, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h2, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h3, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h4, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h5, .protyle-wysiwyg [data-node-id].li > .protyle-action ~ .h6 {line-height:${height + 8}px;}
.protyle-wysiwyg [data-node-id].li > .protyle-action:after {height: ${window.siyuan.config.editor.fontSize}px;width: ${window.siyuan.config.editor.fontSize}px;margin:-${window.siyuan.config.editor.fontSize / 2}px 0 0 -${window.siyuan.config.editor.fontSize / 2}px} .protyle-wysiwyg [data-node-id].li > .protyle-action:after {height: ${window.siyuan.config.editor.fontSize}px;width: ${window.siyuan.config.editor.fontSize}px;margin:-${window.siyuan.config.editor.fontSize / 2}px 0 0 -${window.siyuan.config.editor.fontSize / 2}px}
.protyle-wysiwyg [data-node-id].li > .protyle-action svg {height: ${Math.max(14, window.siyuan.config.editor.fontSize - 8)}px} .protyle-wysiwyg [data-node-id].li > .protyle-action svg {height: ${Math.max(14, window.siyuan.config.editor.fontSize - 8)}px}
.protyle-wysiwyg [data-node-id] [spellcheck="false"] {min-height:${height}px;} .protyle-wysiwyg [data-node-id] [spellcheck] {min-height:${height}px;}
.protyle-wysiwyg [data-node-id] {${window.siyuan.config.editor.rtl ? " direction: rtl;" : ""}${window.siyuan.config.editor.justify ? " text-align: justify;" : ""}} .protyle-wysiwyg [data-node-id] {${window.siyuan.config.editor.rtl ? " direction: rtl;" : ""}${window.siyuan.config.editor.justify ? " text-align: justify;" : ""}}
.protyle-wysiwyg .li {min-height:${height + 8}px} .protyle-wysiwyg .li {min-height:${height + 8}px}
.protyle-gutters button svg {height:${height}px} .protyle-gutters button svg {height:${height}px}