diff --git a/app/src/protyle/export/util.ts b/app/src/protyle/export/util.ts index fe845d876..9f8e20bd9 100644 --- a/app/src/protyle/export/util.ts +++ b/app/src/protyle/export/util.ts @@ -12,6 +12,7 @@ import {highlightRender} from "../render/highlightRender"; import {processRender} from "../util/processCode"; import {openByMobile, setStorageVal} from "../util/compatibility"; import {showFileInFolder} from "../../util/pathName"; +import {needSubscribe} from "../../util/needSubscribe"; export const afterExport = (exportPath: string, msgId: string) => { /// #if !BROWSER @@ -32,6 +33,7 @@ export const exportImage = (id: string) => {
+
+
@@ -87,6 +94,41 @@ id="preview"> refreshPreview(response); }); }); + const watermarkElement = (exportDialog.element.querySelector("#watermark") as HTMLInputElement); + watermarkElement.addEventListener("change", () => { + window.siyuan.storage[Constants.LOCAL_EXPORTIMG].watermark = watermarkElement.checked; + if (watermarkElement.checked && needSubscribe("")) { + watermarkElement.checked = false; + showMessage(window.siyuan.languages._kernel[29]); + } + updateWatermark(); + }); + const updateWatermark = () => { + const watermarkPreviewElement = exportDialog.element.querySelector(".export-img__watermark") as HTMLElement; + if (watermarkElement.checked) { + window.siyuan.config.export.imageWatermarkDesc = "vvvvv"; + if (window.siyuan.config.export.imageWatermarkDesc) { + watermarkPreviewElement.setAttribute("style", window.siyuan.config.export.imageWatermarkDesc) + } else if (window.siyuan.config.export.imageWatermarkStr) { + const fontSize = 120; + const fontWeight = "normal"; + const canvas = document.createElement("canvas"); + canvas.width = window.siyuan.config.export.imageWatermarkDesc.length * fontSize; + canvas.height = 140; + const context = canvas.getContext("2d"); + context.fillStyle = 'transparent'; + context.fillRect(0, 0, canvas.width, canvas.height); + context.fillStyle = "#66CCFF"; + context.font = fontWeight + " " + fontSize + "px sans-serif"; + context.textAlign = "left"; + context.textBaseline = "top"; + context.fillText(window.siyuan.config.export.imageWatermarkDesc, 0, 0); + watermarkPreviewElement.setAttribute("style", `background-image: url(${canvas.toDataURL("image/png")});background-repeat: repeat;`) + } + } else { + watermarkPreviewElement.removeAttribute("style"); + } + } const refreshPreview = (response: IWebSocketData) => { previewElement.innerHTML = response.data.content; // https://github.com/siyuan-note/siyuan/issues/9685 @@ -144,6 +186,7 @@ id="preview"> }); } }); + updateWatermark(); btnsElement[0].removeAttribute("disabled"); btnsElement[1].removeAttribute("disabled"); exportDialog.element.querySelector(".fn__loading").remove(); diff --git a/app/src/protyle/util/compatibility.ts b/app/src/protyle/util/compatibility.ts index 0557819eb..7aea95db6 100644 --- a/app/src/protyle/util/compatibility.ts +++ b/app/src/protyle/util/compatibility.ts @@ -211,6 +211,7 @@ export const getLocalStorage = (cb: () => void) => { }; defaultStorage[Constants.LOCAL_EXPORTIMG] = { keepFold: false, + watermark: false }; defaultStorage[Constants.LOCAL_DOCINFO] = { id: "",