diff --git a/app/src/config/exportConfig.ts b/app/src/config/exportConfig.ts index 0eacd4730..bad8637a3 100644 --- a/app/src/config/exportConfig.ts +++ b/app/src/config/exportConfig.ts @@ -197,7 +197,7 @@ export const exportConfig = { setexprt(); }); }); - exportConfig.element.querySelectorAll("input").forEach((item) => { + exportConfig.element.querySelectorAll("input, textarea").forEach((item) => { if (item.id == "importData") { item.addEventListener("change", (event: InputEvent & { target: HTMLInputElement }) => { const formData = new FormData(); diff --git a/app/src/protyle/export/util.ts b/app/src/protyle/export/util.ts index ad6234862..70cc16284 100644 --- a/app/src/protyle/export/util.ts +++ b/app/src/protyle/export/util.ts @@ -105,22 +105,27 @@ export const exportImage = (id: string) => { }); const updateWatermark = () => { const watermarkPreviewElement = exportDialog.element.querySelector(".export-img__watermark") as HTMLElement; + watermarkPreviewElement.innerHTML = ""; if (watermarkElement.checked) { if (window.siyuan.config.export.imageWatermarkDesc) { - watermarkPreviewElement.setAttribute("style", window.siyuan.config.export.imageWatermarkDesc) + watermarkPreviewElement.innerHTML = window.siyuan.config.export.imageWatermarkDesc; } else if (window.siyuan.config.export.imageWatermarkStr) { - addScript("/stage/protyle/js/html2canvas.min.js?v=1.4.1", "protyleHtml2canvas").then(() => { - const width = Math.max(exportDialog.element.querySelector('.export-img').clientWidth / 3, 150); - watermarkPreviewElement.setAttribute("style", `width: ${width}px;height: ${width}px;display: flex;justify-content: center;align-items: center;color: var(--b3-border-color);font-size: 14px;`) - watermarkPreviewElement.innerHTML = `
${window.siyuan.config.export.imageWatermarkStr}
`; - window.html2canvas(watermarkPreviewElement, { - useCORS: true, - scale: 1, - }).then((canvas) => { - watermarkPreviewElement.innerHTML = ""; - watermarkPreviewElement.setAttribute("style", `background-image: url(${canvas.toDataURL("image/png")});background-repeat: repeat;position: absolute;top: 0;left: 0;width: 100%;height: 100%;border-radius: var(--b3-border-radius-b);`) + if (window.siyuan.config.export.imageWatermarkStr.startsWith("http")) { + watermarkPreviewElement.setAttribute("style", `background-image: url(${window.siyuan.config.export.imageWatermarkStr});background-repeat: repeat;position: absolute;top: 0;left: 0;width: 100%;height: 100%;border-radius: var(--b3-border-radius-b);`) + } else { + addScript("/stage/protyle/js/html2canvas.min.js?v=1.4.1", "protyleHtml2canvas").then(() => { + const width = Math.max(exportDialog.element.querySelector('.export-img').clientWidth / 3, 150); + watermarkPreviewElement.setAttribute("style", `width: ${width}px;height: ${width}px;display: flex;justify-content: center;align-items: center;color: var(--b3-border-color);font-size: 14px;`) + watermarkPreviewElement.innerHTML = `
${window.siyuan.config.export.imageWatermarkStr}
`; + window.html2canvas(watermarkPreviewElement, { + useCORS: true, + scale: 1, + }).then((canvas) => { + watermarkPreviewElement.innerHTML = ""; + watermarkPreviewElement.setAttribute("style", `background-image: url(${canvas.toDataURL("image/png")});background-repeat: repeat;position: absolute;top: 0;left: 0;width: 100%;height: 100%;border-radius: var(--b3-border-radius-b);`) + }); }); - }); + } } } else { watermarkPreviewElement.removeAttribute("style");