0ct0pu5/siyuan
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

🎨 fix https://github.com/siyuan-note/siyuan/issues/5554

Browse source
This commit is contained in:
Vanessa 2022-08-01 11:59:22 +08:00
parent 125fd486cc
commit 5f73ce9a24
3 changed files with 72 additions and 47 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

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

@ -4,7 +4,13 @@ import {iframeMenu, setFold, tableMenu, videoMenu, zoomOut} from "../../menus/pr
import {MenuItem} from "../../menus/Menu";
import {copySubMenu, openAttr, openWechatNotify} from "../../menus/commonMenuItem";
import {updateHotkeyTip, writeText} from "../util/compatibility";
import {transaction, turnIntoTransaction, turnsIntoTransaction, updateTransaction} from "../wysiwyg/transaction";
import {
transaction,
turnIntoTransaction,
turnsIntoTransaction,
updateBatchTransaction,
updateTransaction
} from "../wysiwyg/transaction";
import {removeBlock} from "../wysiwyg/remove";
import {focusBlock, focusByRange, getEditorRange} from "../util/selection";
import {hideElements} from "../ui/hideElements";
@ -1157,24 +1163,7 @@ export class Gutter {
}
private genClick(nodeElements: Element[], protyle: IProtyle, cb: (e: HTMLElement) => void) {
const operations: IOperation[] = [];
const undoOperations: IOperation[] = [];
nodeElements.forEach((element) => {
const id = element.getAttribute("data-node-id");
element.classList.remove("protyle-wysiwyg--select");
undoOperations.push({
action: "update",
id,
data: element.outerHTML
});
cb(element as HTMLElement);
operations.push({
action: "update",
id,
data: element.outerHTML
});
});
transaction(protyle, operations, undoOperations);
updateBatchTransaction(nodeElements, protyle, cb);
focusBlock(nodeElements[0]);
}

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

@ -28,7 +28,13 @@ import {
import {matchHotKey} from "../util/hotKey";
import {enter} from "./enter";
import {fixTable} from "../util/table";
import {phTransaction, transaction, turnsIntoTransaction, updateTransaction} from "./transaction";
import {
phTransaction,
transaction,
turnsIntoTransaction,
updateBatchTransaction,
updateTransaction
} from "./transaction";
import {fontEvent} from "../toolbar/Font";
import {listIndent, listOutdent, updateListOrder} from "./list";
import {newFileBySelect, newFileContentBySelect, rename, replaceFileName} from "../../editor/rename";
@ -960,46 +966,55 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => {
return;
}
if (matchHotKey(window.siyuan.config.keymap.editor.general.alignLeft.custom, event)) {
let actionElement: HTMLElement = nodeElement;
const selectElements = protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--select");
if (selectElements.length > 0) {
actionElement = selectElements[0] as HTMLElement;
const imgSelectElements = nodeElement.querySelectorAll(".img--select");
if (imgSelectElements.length > 0) {
const oldHTML = nodeElement.outerHTML;
imgSelectElements.forEach((item: HTMLElement) => {
item.style.display = "";
});
updateTransaction(protyle, nodeElement.getAttribute("data-node-id"), nodeElement.outerHTML, oldHTML);
} else {
let selectElements:HTMLElement[] = Array.from(protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--select"));
if (selectElements.length === 0) {
selectElements = [nodeElement];
}
updateBatchTransaction(selectElements, protyle, (e: HTMLElement) => {
e.style.textAlign = "";
});
}
const oldHTML = actionElement.outerHTML;
actionElement.style.textAlign = "left";
actionElement.querySelectorAll(".img").forEach((item: HTMLElement) => {
item.style.display = "";
});
updateTransaction(protyle, actionElement.getAttribute("data-node-id"), actionElement.outerHTML, oldHTML);
event.stopPropagation();
event.preventDefault();
return;
}
if (matchHotKey(window.siyuan.config.keymap.editor.general.alignCenter.custom, event)) {
let actionElement: HTMLElement = nodeElement;
const selectElements = protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--select");
if (selectElements.length > 0) {
actionElement = selectElements[0] as HTMLElement;
const imgSelectElements = nodeElement.querySelectorAll(".img--select");
if (imgSelectElements.length > 0) {
const oldHTML = nodeElement.outerHTML;
imgSelectElements.forEach((item: HTMLElement) => {
item.style.display = "block";
});
updateTransaction(protyle, nodeElement.getAttribute("data-node-id"), nodeElement.outerHTML, oldHTML);
} else {
let selectElements:HTMLElement[] = Array.from(protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--select"));
if (selectElements.length === 0) {
selectElements = [nodeElement];
}
updateBatchTransaction(selectElements, protyle, (e: HTMLElement) => {
e.style.textAlign = "center";
});
}
const oldHTML = actionElement.outerHTML;
actionElement.style.textAlign = "center";
actionElement.querySelectorAll(".img").forEach((item: HTMLElement) => {
item.style.display = "block";
});
updateTransaction(protyle, actionElement.getAttribute("data-node-id"), actionElement.outerHTML, oldHTML);
event.stopPropagation();
event.preventDefault();
return;
}
if (matchHotKey(window.siyuan.config.keymap.editor.general.alignRight.custom, event)) {
let actionElement: HTMLElement = nodeElement;
const selectElements = protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--select");
if (selectElements.length > 0) {
actionElement = selectElements[0] as HTMLElement;
let selectElements:HTMLElement[] = Array.from(protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--select"));
if (selectElements.length === 0) {
selectElements = [nodeElement];
}
const oldHTML = actionElement.outerHTML;
actionElement.style.textAlign = "right";
updateTransaction(protyle, actionElement.getAttribute("data-node-id"), actionElement.outerHTML, oldHTML);
updateBatchTransaction(selectElements, protyle, (e: HTMLElement) => {
e.style.textAlign = "right";
});
event.stopPropagation();
event.preventDefault();
return;

21
app/src/protyle/wysiwyg/transaction.ts
View file

@ -733,3 +733,24 @@ export const updateTransaction = (protyle: IProtyle, id: string, newHTML: string
action: "update"
}]);
};
export const updateBatchTransaction = (nodeElements: Element[], protyle: IProtyle, cb: (e: HTMLElement) => void) => {
const operations: IOperation[] = [];
const undoOperations: IOperation[] = [];
nodeElements.forEach((element) => {
const id = element.getAttribute("data-node-id");
element.classList.remove("protyle-wysiwyg--select");
undoOperations.push({
action: "update",
id,
data: element.outerHTML
});
cb(element as HTMLElement);
operations.push({
action: "update",
id,
data: element.outerHTML
});
});
transaction(protyle, operations, undoOperations);
}