diff --git a/app/src/menus/protyle.ts b/app/src/menus/protyle.ts index bda1cc6f8..aacd6e21f 100644 --- a/app/src/menus/protyle.ts +++ b/app/src/menus/protyle.ts @@ -37,7 +37,7 @@ import {blockRender} from "../protyle/render/blockRender"; import {renameAsset} from "../editor/rename"; import {electronUndo} from "../protyle/undo"; import {pushBack} from "../mobile/util/MobileBackFoward"; -import {exportAsset} from "./util"; +import {copyPNG, exportAsset} from "./util"; import {removeLink} from "../protyle/toolbar/Link"; import {alignImgCenter, alignImgLeft} from "../protyle/wysiwyg/commonHotkey"; import {renameTag} from "../util/noRelyPCFunction"; @@ -593,29 +593,10 @@ export const imgMenu = (protyle: IProtyle, range: Range, assetElement: HTMLEleme }).element); window.siyuan.menus.menu.append(new MenuItem({ label: window.siyuan.languages.copy + " PNG", + accelerator: window.siyuan.config.keymap.editor.general.copyBlockRef.custom, icon: "iconImage", click() { - if ("android" === window.siyuan.config.system.container && window.JSAndroid) { - window.JSAndroid.writeImageClipboard(imgElement.getAttribute("src")); - return; - } else { - const canvas = document.createElement("canvas"); - const tempElement = document.createElement("img"); - tempElement.onload = (e: Event & { target: HTMLImageElement }) => { - canvas.width = e.target.width; - canvas.height = e.target.height; - canvas.getContext("2d").drawImage(e.target, 0, 0, e.target.width, e.target.height); - canvas.toBlob((blob) => { - navigator.clipboard.write([ - new ClipboardItem({ - // @ts-ignore - ["image/png"]: blob - }) - ]); - }, "image/png", 1); - }; - tempElement.src = imgElement.getAttribute("src"); - } + copyPNG(imgElement); } }).element); /// #if !BROWSER diff --git a/app/src/menus/util.ts b/app/src/menus/util.ts index f6a6fe531..e6c5c6a7b 100644 --- a/app/src/menus/util.ts +++ b/app/src/menus/util.ts @@ -103,3 +103,27 @@ export const openEditorTab = (app: App, id: string, notebookId?: string, pathStr }).element); /// #endif }; + +export const copyPNG = (imgElement: HTMLImageElement) => { + if ("android" === window.siyuan.config.system.container && window.JSAndroid) { + window.JSAndroid.writeImageClipboard(imgElement.getAttribute("src")); + return; + } else { + const canvas = document.createElement("canvas"); + const tempElement = document.createElement("img"); + tempElement.onload = (e: Event & { target: HTMLImageElement }) => { + canvas.width = e.target.width; + canvas.height = e.target.height; + canvas.getContext("2d").drawImage(e.target, 0, 0, e.target.width, e.target.height); + canvas.toBlob((blob) => { + navigator.clipboard.write([ + new ClipboardItem({ + // @ts-ignore + ["image/png"]: blob + }) + ]); + }, "image/png", 1); + }; + tempElement.src = imgElement.getAttribute("src"); + } +} diff --git a/app/src/protyle/wysiwyg/keydown.ts b/app/src/protyle/wysiwyg/keydown.ts index ccef63ae6..f10e27d4d 100644 --- a/app/src/protyle/wysiwyg/keydown.ts +++ b/app/src/protyle/wysiwyg/keydown.ts @@ -71,6 +71,7 @@ import {escapeHtml} from "../../util/escape"; import {insertHTML} from "../util/insertHTML"; import {quickMakeCard} from "../../card/makeCard"; import {removeSearchMark} from "../toolbar/util"; +import {copyPNG} from "../../menus/util"; export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => { editorElement.addEventListener("keydown", (event: KeyboardEvent & { target: HTMLElement }) => { @@ -964,11 +965,18 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => { return true; } if (matchHotKey(window.siyuan.config.keymap.editor.general.copyBlockRef.custom, event)) { + event.preventDefault(); + event.stopPropagation(); const selectElements = protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--select"); let actionElement; if (selectElements.length === 1) { actionElement = selectElements[0]; } else { + const selectImgElement = nodeElement.querySelector(".img--select"); + if (selectImgElement) { + copyPNG(selectImgElement.querySelector("img")); + return true; + } actionElement = nodeElement; } const actionElementId = actionElement.getAttribute("data-node-id"); @@ -979,8 +987,6 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => { writeText(`((${actionElementId} '${response.data}'))`); }); } - event.preventDefault(); - event.stopPropagation(); return true; } if (matchHotKey(window.siyuan.config.keymap.editor.general.copyBlockEmbed.custom, event)) { @@ -1290,7 +1296,7 @@ export const keydown = (protyle: IProtyle, editorElement: HTMLElement) => { if (matchHotKey(window.siyuan.config.keymap.editor.insert.lastUsed.custom, event)) { protyle.toolbar.range = range; let selectElements: Element[] = []; - if (selectText === "" && protyle.toolbar.getCurrentType(range).length === 0) { + if (selectText === "" && protyle.toolbar.getCurrentType(range).length === 0) { selectElements = Array.from(protyle.wysiwyg.element.querySelectorAll(".protyle-wysiwyg--select")); if (selectElements.length === 0) { selectElements = [nodeElement];