import {appearance} from "./appearance";
import {showMessage} from "../dialog/message";
import {fetchPost} from "../util/fetch";
import {confirmDialog} from "../dialog/confirmDialog";
import {highlightRender} from "../protyle/markdown/highlightRender";
import {exportLayout} from "../layout/util";
import {Constants} from "../constants";
/// #if !BROWSER
import {shell} from "electron";
import * as path from "path";
/// #endif
import {isBrowser} from "../util/functions";
import {setStorageVal} from "../protyle/util/compatibility";
import {hasClosestByAttribute, hasClosestByClassName} from "../protyle/util/hasClosest";
import {Plugin} from "../plugin";
import {App} from "../index";
import {escapeAttr} from "../util/escape";
export const bazaar = {
element: undefined as Element,
genHTML() {
const localSort = window.siyuan.storage[Constants.LOCAL_BAZAAR];
const loadingHTML = `
${window.siyuan.languages.downloaded}
${window.siyuan.languages.theme}
${window.siyuan.languages.icon}
${window.siyuan.languages.template}
${window.siyuan.languages.widget}
${window.siyuan.languages.plugin}
${loadingHTML}
${loadingHTML}
${loadingHTML}
${loadingHTML}
${loadingHTML}
${loadingHTML}
`;
},
_genCardHTML(item: IBazaarItem, bazaarType: TBazaarType) {
let hide = false;
let themeMode = "";
if (bazaarType === "themes") {
const themeValue = (bazaar.element.querySelector("#bazaarSelect") as HTMLSelectElement).value;
if ((themeValue === "0" && item.modes.includes("dark")) ||
themeValue === "1" && item.modes.includes("light")) {
hide = true;
}
themeMode = item.modes.toString();
}
let showSwitch = false;
if (["icons", "themes"].includes(bazaarType)) {
showSwitch = true;
}
const dataObj = {
bazaarType,
themeMode: themeMode,
updated: item.updated,
name: item.name,
repoURL: item.repoURL,
repoHash: item.repoHash,
downloads: item.downloads,
downloaded: false,
};
return `
${data.name}
${window.siyuan.languages.currentVer}
v${data.version}
${dataObj.downloaded ? window.siyuan.languages.installDate : window.siyuan.languages.releaseDate}
${dataObj.downloaded ? data.hInstallDate : data.hUpdated}
${dataObj.downloaded ? window.siyuan.languages.installSize : window.siyuan.languages.pkgSize}
${dataObj.downloaded ? data.hInstallSize : data.hSize}
${data.preferredDesc || ""}
`;
if (dataObj.downloaded) {
const mdElement = readmeElement.querySelector(".item__readme");
mdElement.innerHTML = data.preferredReadme;
highlightRender(mdElement);
} else {
fetchPost("/api/bazaar/getBazaarPackageREAME", {
repoURL: data.repoURL,
repoHash: data.repoHash,
packageType: bazaarType
}, response => {
const mdElement = readmeElement.querySelector(".item__readme");
mdElement.innerHTML = response.data.html;
highlightRender(mdElement);
});
}
readmeElement.classList.add("config-bazaar__readme--show");
},
bindEvent(app: App) {
this._genMyHTML("themes", app);
bazaar.element.firstElementChild.addEventListener("click", (event) => {
let target = event.target as HTMLElement;
const dataElement = hasClosestByAttribute(target, "data-obj", null);
let dataObj: IObject;
if (dataElement) {
dataObj = JSON.parse(dataElement.getAttribute("data-obj"));
}
while (target && !target.isEqualNode(bazaar.element)) {
const type = target.getAttribute("data-type");
if (target.tagName === "A") {
break;
} else if (type === "open" && dataObj) {
/// #if !BROWSER
const dirName = dataObj.bazaarType;
if (dirName === "icons" || dirName === "themes") {
shell.openPath(path.join(window.siyuan.config.system.confDir, "appearance", dirName, dataObj.name));
} else {
shell.openPath(path.join(window.siyuan.config.system.dataDir, dirName, dataObj.name));
}
/// #endif
event.preventDefault();
event.stopPropagation();
break;
} else if (["myTheme", "myTemplate", "myIcon", "myWidget", "myPlugin"].includes(type)) {
if (target.classList.contains("b3-button--outline")) {
target.parentElement.childNodes.forEach((item: HTMLElement) => {
if (item.nodeType !== 3 && item.classList.contains("b3-button")) {
item.classList.add("b3-button--outline");
}
});
target.classList.remove("b3-button--outline");
this._genMyHTML(type.replace("my", "").toLowerCase() + "s" as TBazaarType, app);
}
event.preventDefault();
event.stopPropagation();
break;
} else if (type === "goBack") {
bazaar.element.querySelector("#configBazaarReadme").classList.remove("config-bazaar__readme--show");
event.preventDefault();
event.stopPropagation();
break;
} else if (type === "install") {
if (!target.classList.contains("b3-button--progress")) {
const bazaarType = dataObj.bazaarType as TBazaarType;
let url = "/api/bazaar/installBazaarTemplate";
if (bazaarType === "themes") {
url = "/api/bazaar/installBazaarTheme";
} else if (bazaarType === "icons") {
url = "/api/bazaar/installBazaarIcon";
} else if (bazaarType === "widgets") {
url = "/api/bazaar/installBazaarWidget";
} else if (bazaarType === "plugins") {
url = "/api/bazaar/installBazaarPlugin";
}
fetchPost(url, {
repoURL: dataObj.repoURL,
packageName: dataObj.name,
repoHash: dataObj.repoHash,
mode: dataObj.themeMode === "dark" ? 1 : 0,
}, response => {
if (window.siyuan.config.appearance.themeJS && bazaarType === "themes") {
exportLayout({
reload: true,
onlyData: false,
errorExit: false,
});
return;
}
bazaar._genMyHTML(bazaarType, app);
bazaar._onBazaar(response, bazaarType, ["themes", "icons"].includes(bazaarType));
});
}
event.preventDefault();
event.stopPropagation();
break;
} else if (type === "install-t") {
if (!target.classList.contains("b3-button--progress")) {
confirmDialog(window.siyuan.languages.update, window.siyuan.languages.exportTplTip, () => {
const bazaarType = dataObj.bazaarType as TBazaarType;
let url = "/api/bazaar/installBazaarTemplate";
if (bazaarType === "themes") {
url = "/api/bazaar/installBazaarTheme";
} else if (bazaarType === "icons") {
url = "/api/bazaar/installBazaarIcon";
} else if (bazaarType === "widgets") {
url = "/api/bazaar/installBazaarWidget";
} else if (bazaarType === "plugins") {
url = "/api/bazaar/installBazaarPlugin";
}
if (!target.classList.contains("b3-button")) {
target.parentElement.insertAdjacentHTML("afterend", '