This commit is contained in:
Vanessa 2023-01-22 12:21:20 +08:00
parent 7e753908b8
commit bfcdf3c352
5 changed files with 85 additions and 44 deletions

View file

@ -146,4 +146,9 @@
} }
} }
} }
&__exportimg.protyle-wysiwyg [data-node-id].li[fold="1"] > .protyle-action:after {
background-color: transparent;
border: 1px solid var(--b3-list-hover);
}
} }

View file

@ -71,6 +71,7 @@ export abstract class Constants {
public static readonly LOCAL_FONTSTYLES = "local-fontstyles"; public static readonly LOCAL_FONTSTYLES = "local-fontstyles";
public static readonly LOCAL_EXPORTPDF = "local-exportpdf"; public static readonly LOCAL_EXPORTPDF = "local-exportpdf";
public static readonly LOCAL_EXPORTWORD = "local-exportword"; public static readonly LOCAL_EXPORTWORD = "local-exportword";
public static readonly LOCAL_EXPORTIMG = "local-exportimg";
public static readonly LOCAL_BAZAAR = "local-bazaar"; public static readonly LOCAL_BAZAAR = "local-bazaar";
public static readonly LOCAL_PDFTHEME = "local-pdftheme"; public static readonly LOCAL_PDFTHEME = "local-pdftheme";

View file

@ -137,11 +137,13 @@ export const initFramework = () => {
syncGuide(); syncGuide();
}); });
if (getOpenNotebookCount() > 0) { if (getOpenNotebookCount() > 0) {
const openURL = window.JSAndroid.getBlockURL(); if (window.JSAndroid) {
if (openURL && !/^siyuan:\/\/blocks\/\d{14}-\w{7}/.test(openURL)) { const openURL = window.JSAndroid.getBlockURL();
openMobileFileById(openURL.substr(16, 22), if (openURL && !/^siyuan:\/\/blocks\/\d{14}-\w{7}/.test(openURL)) {
getSearch("focus", openURL) === "1" ? [Constants.CB_GET_ALL, Constants.CB_GET_FOCUS] : [Constants.CB_GET_FOCUS, Constants.CB_GET_CONTEXT]); openMobileFileById(openURL.substr(16, 22),
return; getSearch("focus", openURL) === "1" ? [Constants.CB_GET_ALL, Constants.CB_GET_FOCUS] : [Constants.CB_GET_FOCUS, Constants.CB_GET_CONTEXT]);
return;
}
} }
const openId = getSearch("id"); const openId = getSearch("id");
if (openId) { if (openId) {

View file

@ -11,7 +11,7 @@ import {isMobile} from "../../util/functions";
import {Constants} from "../../constants"; import {Constants} from "../../constants";
import {highlightRender} from "../markdown/highlightRender"; import {highlightRender} from "../markdown/highlightRender";
import {processRender} from "../util/processCode"; import {processRender} from "../util/processCode";
import {openByMobile} from "../util/compatibility"; import {openByMobile, setStorageVal} from "../util/compatibility";
export const afterExport = (exportPath: string, msgId: string) => { export const afterExport = (exportPath: string, msgId: string) => {
/// #if !BROWSER /// #if !BROWSER
@ -27,27 +27,70 @@ export const afterExport = (exportPath: string, msgId: string) => {
export const exportImage = (id: string) => { export const exportImage = (id: string) => {
const exportDialog = new Dialog({ const exportDialog = new Dialog({
title: window.siyuan.languages.exportAsImage, title: `<div class="fn__flex">
${window.siyuan.languages.exportAsImage}
<div class="fn__flex-1"></div>
<label class="fn__flex">
${window.siyuan.languages.exportPDF5}
<span class="fn__space"></span>
<input id="keepFold" class="b3-switch fn__flex-center" type="checkbox" ${window.siyuan.storage[Constants.LOCAL_EXPORTIMG].keepFold ? "checked" : ""}>
</label>
</div>
`,
content: `<div class="b3-dialog__content" style="max-height: 70vh;overflow: auto;${isMobile() ? "padding:8px;" : ""};background-color: var(--b3-theme-background)"> content: `<div class="b3-dialog__content" style="max-height: 70vh;overflow: auto;${isMobile() ? "padding:8px;" : ""};background-color: var(--b3-theme-background)">
<div style="${isMobile() ? "padding: 16px;margin: 16px 0" : "padding: 48px;margin: 8px 0 24px"};border: 1px solid var(--b3-border-color);border-radius: 10px;" class="protyle-wysiwyg${window.siyuan.config.editor.displayBookmarkIcon ? " protyle-wysiwyg--attr" : ""}" id="preview"> <div style="${isMobile() ? "padding: 16px;margin: 16px 0" : "padding: 48px;margin: 8px 0 24px"};border: 1px solid var(--b3-border-color);border-radius: 10px;" class="b3-dialog__exportimg protyle-wysiwyg${window.siyuan.config.editor.displayBookmarkIcon ? " protyle-wysiwyg--attr" : ""}" id="preview"></div>
<div class="fn__loading" style="left:0"><img height="128px" width="128px" src="stage/loading-pure.svg"></div>
</div>
<div class="ft__smaller ft__on-surface fn__flex"><img style="height: 18px;margin: 0 8px" src="stage/icon.png">${window.siyuan.languages.exportBySiYuan}</div> <div class="ft__smaller ft__on-surface fn__flex"><img style="height: 18px;margin: 0 8px" src="stage/icon.png">${window.siyuan.languages.exportBySiYuan}</div>
<div class="fn__hr--b"></div> <div class="fn__hr--b"></div>
<div class="fn__hr--b"></div> <div class="fn__hr--b"></div>
</div> </div>
<div class="b3-dialog__action"> <div class="b3-dialog__action">
<button class="b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button><div class="fn__space"></div> <button disabled class="b3-button b3-button--cancel">${window.siyuan.languages.cancel}</button><div class="fn__space"></div>
<button class="b3-button b3-button--text">${window.siyuan.languages.confirm}</button> <button disabled class="b3-button b3-button--text">${window.siyuan.languages.confirm}</button>
</div>`, </div>
<div class="fn__loading"><img height="128px" width="128px" src="stage/loading-pure.svg"></div>`,
width: isMobile() ? "90vw" : "990px", width: isMobile() ? "90vw" : "990px",
}); });
fetchPost("/api/export/exportPreviewHTML", { const btnsElement = exportDialog.element.querySelectorAll(".b3-button");
id, btnsElement[0].addEventListener("click", () => {
keepFold: false, exportDialog.destroy();
image: true, });
}, (response) => { btnsElement[1].addEventListener("click", () => {
const previewElement = exportDialog.element.querySelector("#preview"); const msgId = showMessage(window.siyuan.languages.exporting, 0);
previewElement.parentElement.style.maxHeight = "none";
setStorageVal(Constants.LOCAL_EXPORTIMG, window.siyuan.storage[Constants.LOCAL_EXPORTIMG]);
setTimeout(() => {
addScript("stage/protyle/js/html2canvas.min.js?v=1.4.1", "protyleHtml2canvas").then(() => {
window.html2canvas(previewElement.parentElement).then((canvas) => {
canvas.toBlob((blob: Blob) => {
const formData = new FormData();
formData.append("file", blob, btnsElement[1].getAttribute("data-title"));
formData.append("type", "image/png");
fetchPost("/api/export/exportAsFile", formData, (response) => {
openByMobile(response.data.file);
});
hideMessage(msgId);
exportDialog.destroy();
});
});
});
}, Constants.TIMEOUT_TRANSITION);
});
const previewElement = exportDialog.element.querySelector("#preview") as HTMLElement;
const foldElement = (exportDialog.element.querySelector("#keepFold") as HTMLInputElement)
foldElement.addEventListener("change", () => {
btnsElement[0].setAttribute("disabled", "disabled");
btnsElement[1].setAttribute("disabled", "disabled");
btnsElement[1].parentElement.insertAdjacentHTML("afterend", `<div class="fn__loading"><img height="128px" width="128px" src="stage/loading-pure.svg"></div>`)
window.siyuan.storage[Constants.LOCAL_EXPORTIMG].keepFold = foldElement.checked;
fetchPost("/api/export/exportPreviewHTML", {
id,
keepFold: foldElement.checked,
image: true,
}, (response) => {
refreshPreview(response);
})
});
const refreshPreview = (response: IWebSocketData) => {
previewElement.innerHTML = response.data.content; previewElement.innerHTML = response.data.content;
processRender(previewElement); processRender(previewElement);
highlightRender(previewElement); highlightRender(previewElement);
@ -67,29 +110,16 @@ export const exportImage = (id: string) => {
item.setAttribute("viewBox", viewBox); item.setAttribute("viewBox", viewBox);
item.innerHTML = symbolElements[symbolElements.length - 1].innerHTML; item.innerHTML = symbolElements[symbolElements.length - 1].innerHTML;
}); });
const btnsElement = exportDialog.element.querySelectorAll(".b3-button"); btnsElement[0].removeAttribute("disabled");
btnsElement[0].addEventListener("click", () => { btnsElement[1].removeAttribute("disabled");
exportDialog.destroy(); exportDialog.element.querySelector(".fn__loading").remove();
}); };
btnsElement[1].addEventListener("click", () => { fetchPost("/api/export/exportPreviewHTML", {
const msgId = showMessage(window.siyuan.languages.exporting, 0); id,
previewElement.parentElement.style.maxHeight = "none"; keepFold: foldElement.checked,
setTimeout(() => { image: true,
addScript("stage/protyle/js/html2canvas.min.js?v=1.4.1", "protyleHtml2canvas").then(() => { }, (response) => {
window.html2canvas(previewElement.parentElement).then((canvas) => { refreshPreview(response);
canvas.toBlob((blob: Blob) => { btnsElement[1].setAttribute("data-title", response.data.name + ".png");
const formData = new FormData();
formData.append("file", blob, response.data.name + ".png");
formData.append("type", "image/png");
fetchPost("/api/export/exportAsFile", formData, (response) => {
openByMobile(response.data.file);
});
hideMessage(msgId);
exportDialog.destroy();
});
});
});
}, Constants.TIMEOUT_TRANSITION);
});
}); });
}; };

View file

@ -171,6 +171,9 @@ export const getLocalStorage = (cb:()=>void) => {
keepFold: false, keepFold: false,
mergeSubdocs: false, mergeSubdocs: false,
}; };
defaultStorage[Constants.LOCAL_EXPORTIMG] = {
keepFold: false,
};
defaultStorage[Constants.LOCAL_DOCINFO] = { defaultStorage[Constants.LOCAL_DOCINFO] = {
id: "", id: "",
action: [] action: []
@ -202,7 +205,7 @@ export const getLocalStorage = (cb:()=>void) => {
}; };
defaultStorage[Constants.LOCAL_ZOOM] = 1; defaultStorage[Constants.LOCAL_ZOOM] = 1;
[Constants.LOCAL_SEARCHEKEYS, Constants.LOCAL_PDFTHEME, Constants.LOCAL_BAZAAR, Constants.LOCAL_EXPORTWORD, [Constants.LOCAL_EXPORTIMG, Constants.LOCAL_SEARCHEKEYS, Constants.LOCAL_PDFTHEME, Constants.LOCAL_BAZAAR, Constants.LOCAL_EXPORTWORD,
Constants.LOCAL_EXPORTPDF, Constants.LOCAL_DOCINFO, Constants.LOCAL_FONTSTYLES, Constants.LOCAL_SEARCHEDATA, Constants.LOCAL_EXPORTPDF, Constants.LOCAL_DOCINFO, Constants.LOCAL_FONTSTYLES, Constants.LOCAL_SEARCHEDATA,
Constants.LOCAL_ZOOM,].forEach((key) => { Constants.LOCAL_ZOOM,].forEach((key) => {
if (typeof response.data[key] === "string") { if (typeof response.data[key] === "string") {