diff --git a/app/src/protyle/export/util.ts b/app/src/protyle/export/util.ts index c826972e2..935bb92ef 100644 --- a/app/src/protyle/export/util.ts +++ b/app/src/protyle/export/util.ts @@ -13,7 +13,6 @@ import {highlightRender} from "../markdown/highlightRender"; import {processRender} from "../util/processCode"; import {openByMobile} from "../util/compatibility"; -declare const html2canvas: (element: Element) => Promise; export const afterExport = (exportPath: string, msgId: string) => { /// #if !BROWSER showMessage(`${window.siyuan.languages.exported}${escapeHtml(exportPath)} @@ -76,7 +75,7 @@ export const exportImage = (id: string) => { previewElement.parentElement.style.maxHeight = "none"; setTimeout(() => { addScript("stage/protyle/js/html2canvas.min.js?v=1.4.1", "protyleHtml2canvas").then(() => { - html2canvas(previewElement.parentElement).then((canvas) => { + window.html2canvas(previewElement.parentElement).then((canvas) => { canvas.toBlob((blob: Blob) => { const formData = new FormData(); formData.append("file", blob, response.data.name + ".png"); diff --git a/app/src/protyle/toolbar/index.ts b/app/src/protyle/toolbar/index.ts index 337bd64cd..0fd5744d3 100644 --- a/app/src/protyle/toolbar/index.ts +++ b/app/src/protyle/toolbar/index.ts @@ -15,7 +15,7 @@ import {Link} from "./Link"; import {setPosition} from "../../util/setPosition"; import {updateTransaction} from "../wysiwyg/transaction"; import {Constants} from "../../constants"; -import {getEventName} from "../util/compatibility"; +import {getEventName, openByMobile} from "../util/compatibility"; import {upDownHint} from "../../util/upDownHint"; import {highlightRender} from "../markdown/highlightRender"; import {getContenteditableElement, hasNextSibling, hasPreviousSibling} from "../wysiwyg/getBlock"; @@ -24,8 +24,6 @@ import {BlockRef} from "./BlockRef"; import {hintRenderAssets, hintRenderTemplate, hintRenderWidget} from "../hint/extend"; import {blockRender} from "../markdown/blockRender"; /// #if !BROWSER -import {clipboard, nativeImage, NativeImage} from "electron"; -import {getCurrentWindow} from "@electron/remote"; import {openBy} from "../../editor/util"; /// #endif import {fetchPost} from "../../util/fetch"; @@ -37,11 +35,12 @@ import {hideElements} from "../ui/hideElements"; import {renderAssetsPreview} from "../../asset/renderAssets"; import {electronUndo} from "../undo"; import {previewTemplate} from "./util"; -import {showMessage} from "../../dialog/message"; +import {hideMessage, showMessage} from "../../dialog/message"; import {InlineMath} from "./InlineMath"; import {InlineMemo} from "./InlineMemo"; import {mathRender} from "../markdown/mathRender"; import {linkMenu} from "../../menus/protyle"; +import {addScript} from "../util/addScript"; export class Toolbar { public element: HTMLElement; @@ -828,7 +827,7 @@ export class Toolbar { - + @@ -902,24 +901,29 @@ export class Toolbar { insertEmptyBlock(protyle, "afterend", id); hideElements(["util"], protyle); break; - case "copy": - /// #if !BROWSER - hideElements(["util"], protyle); - setTimeout(() => { - const rect = renderElement.getBoundingClientRect(); - getCurrentWindow().webContents.capturePage({ - x: Math.floor(rect.x), - y: Math.floor(rect.y) - 4, // 行内数学公式头部截不到 - width: Math.floor(rect.width), - height: Math.floor(rect.height) + 4 - }).then((image: NativeImage) => { - clipboard.writeImage(nativeImage.createFromBuffer(image.toPNG())); - }); - }, 100); - /// #endif + case "export": + exportImg(); break; } }); + const exportImg = () => { + const msgId = showMessage(window.siyuan.languages.exporting, 0); + setTimeout(() => { + addScript("stage/protyle/js/html2canvas.min.js?v=1.4.1", "protyleHtml2canvas").then(() => { + window.html2canvas(renderElement).then((canvas) => { + canvas.toBlob((blob: Blob) => { + const formData = new FormData(); + formData.append("file", blob); + formData.append("type", "image/png"); + fetchPost("/api/export/exportAsFile", formData, (response) => { + openByMobile(response.data.file); + hideMessage(msgId); + }); + }); + }); + }); + }, Constants.TIMEOUT_TRANSITION); + } headerElement.addEventListener("mousedown", (event: MouseEvent) => { if (hasClosestByClassName(event.target as HTMLElement, "block__icon")) { return; diff --git a/app/src/types/index.d.ts b/app/src/types/index.d.ts index a788c501d..2e18e881e 100644 --- a/app/src/types/index.d.ts +++ b/app/src/types/index.d.ts @@ -34,7 +34,7 @@ interface Window { dataLayer: any[] siyuan: ISiyuan webkit: any - + html2canvas: (element: Element) => Promise; JSAndroid: { returnDesktop(): void openExternal(url: string): void