From 28e8675a2133310c0bb152dbd6b8aae5e2f5b7bf Mon Sep 17 00:00:00 2001 From: Vanessa Date: Sun, 28 Jan 2024 20:37:35 +0800 Subject: [PATCH] :art: fix https://github.com/siyuan-note/siyuan/issues/8178 --- app/src/config/appearance.ts | 32 +++----------- app/src/config/bazaar.ts | 83 ++++++++++++++++++++++-------------- app/src/types/index.d.ts | 2 + app/src/util/assets.ts | 57 ++++++------------------- 4 files changed, 73 insertions(+), 101 deletions(-) diff --git a/app/src/config/appearance.ts b/app/src/config/appearance.ts index 01ee18d69..f33f4510c 100644 --- a/app/src/config/appearance.ts +++ b/app/src/config/appearance.ts @@ -161,32 +161,12 @@ export const appearance = { lang: (appearance.element.querySelector("#lang") as HTMLSelectElement).value, closeButtonBehavior: (appearance.element.querySelector("#closeButtonBehavior") as HTMLInputElement).checked ? 1 : 0, hideStatusBar: (appearance.element.querySelector("#hideStatusBar") as HTMLInputElement).checked, - }, response => { - if (window.siyuan.config.appearance.themeJS) { - if (!response.data.modeOS && ( - response.data.mode !== window.siyuan.config.appearance.mode || - window.siyuan.config.appearance.themeLight !== response.data.themeLight || - window.siyuan.config.appearance.themeDark !== response.data.themeDark - )) { - exportLayout({ - errorExit: false, - cb() { - window.location.reload(); - }, - }); - return; - } - const OSTheme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"; - if (response.data.modeOS && ( - (response.data.mode === 1 && OSTheme === "light") || (response.data.mode === 0 && OSTheme === "dark") - )) { - exportLayout({ - cb() { - window.location.reload(); - }, - errorExit: false, - }); - return; + }, async response => { + if (window.siyuan.config.appearance.themeJS && window.destroyTheme) { + try { + await window.destroyTheme(); + } catch (e) { + console.error("destroyTheme error: " + e); } } appearance.onSetappearance(response.data); diff --git a/app/src/config/bazaar.ts b/app/src/config/bazaar.ts index 5d519bb5d..c44c4e20d 100644 --- a/app/src/config/bazaar.ts +++ b/app/src/config/bazaar.ts @@ -17,6 +17,8 @@ import {App} from "../index"; import {escapeAttr} from "../util/escape"; import {uninstall} from "../plugin/uninstall"; import {afterLoadPlugin, loadPlugin, loadPlugins} from "../plugin/loader"; +import {loadAssets} from "../util/assets"; +import {addScript} from "../protyle/util/addScript"; export const bazaar = { element: undefined as Element, @@ -623,15 +625,22 @@ export const bazaar = { repoHash: dataObj.repoHash, mode: dataObj.themeMode === "dark" ? 1 : 0, frontend: getFrontend() - }, response => { + }, async response => { if (window.siyuan.config.appearance.themeJS && bazaarType === "themes") { - exportLayout({ - cb() { - window.location.reload(); - }, - errorExit: false, - }); - return; + if (window.destroyTheme) { + try { + await window.destroyTheme(); + } catch (e) { + console.error("destroyTheme error: " + e); + } + } + window.siyuan.config.appearance.mode = dataObj.themeMode === "dark" ? 1 : 0; + if (dataObj.themeMode === "dark") { + window.siyuan.config.appearance.themeDark = dataObj.name; + } else { + window.siyuan.config.appearance.themeLight = dataObj.name; + } + loadAssets(window.siyuan.config.appearance); } bazaar._onBazaar(response, bazaarType, ["themes", "icons"].includes(bazaarType)); bazaar._genMyHTML(bazaarType, app); @@ -676,7 +685,7 @@ export const bazaar = { mode: dataObj.themeMode === "dark" ? 1 : 0, update: true, frontend: getFrontend() - }, response => { + }, async response => { // 更新主题后不需要对该主题进行切换 https://github.com/siyuan-note/siyuan/issues/4966 this._genMyHTML(bazaarType, app); bazaar._onBazaar(response, bazaarType, ["icons"].includes(bazaarType)); @@ -686,16 +695,19 @@ export const bazaar = { (window.siyuan.config.appearance.mode === 1 && window.siyuan.config.appearance.themeDark === dataObj.name) )) { if (window.siyuan.config.appearance.themeJS) { - exportLayout({ - cb() { - window.location.reload(); - }, - errorExit: false, - }); - } else { - const linkElement = (document.getElementById("themeDefaultStyle") as HTMLLinkElement); - linkElement.href = linkElement.href + "1"; + if (window.destroyTheme) { + try { + await window.destroyTheme(); + } catch (e) { + console.error("destroyTheme error: " + e); + } + } + const themeScriptElement = document.getElementById("themeScript") as HTMLScriptElement; + themeScriptElement.remove(); + addScript(themeScriptElement.src + "1", "themeScript"); } + const linkElement = (document.getElementById("themeDefaultStyle") as HTMLLinkElement); + linkElement.href = linkElement.href + "1"; } }); }); @@ -759,25 +771,32 @@ export const bazaar = { modeOS: false, themeDark: mode === 1 ? packageName : window.siyuan.config.appearance.themeDark, themeLight: mode === 0 ? packageName : window.siyuan.config.appearance.themeLight, - }), (appearanceResponse) => { + }), async (appearanceResponse) => { if ((mode !== window.siyuan.config.appearance.mode || (mode === 1 && window.siyuan.config.appearance.themeDark !== packageName) || (mode === 0 && window.siyuan.config.appearance.themeLight !== packageName)) && window.siyuan.config.appearance.themeJS) { - exportLayout({ - cb() { - window.location.reload(); - }, - errorExit: false, - }); - } else { - this._genMyHTML("themes", app); - fetchPost("/api/bazaar/getBazaarTheme", {}, response => { - response.data.appearance = appearanceResponse.data; - bazaar._onBazaar(response, "themes", true); - bazaar._data.themes = response.data.packages; - }); + if (window.destroyTheme) { + try { + await window.destroyTheme(); + } catch (e) { + console.error("destroyTheme error: " + e); + } + } + window.siyuan.config.appearance.mode = mode; + if (mode === 1) { + window.siyuan.config.appearance.themeDark = dataObj.name; + } else { + window.siyuan.config.appearance.themeLight = dataObj.name; + } + loadAssets(window.siyuan.config.appearance); } + this._genMyHTML("themes", app); + fetchPost("/api/bazaar/getBazaarTheme", {}, response => { + response.data.appearance = appearanceResponse.data; + bazaar._onBazaar(response, "themes", true); + bazaar._data.themes = response.data.packages; + }); }); } event.preventDefault(); diff --git a/app/src/types/index.d.ts b/app/src/types/index.d.ts index 3105c2b6f..172f1bd3b 100644 --- a/app/src/types/index.d.ts +++ b/app/src/types/index.d.ts @@ -183,6 +183,8 @@ interface Window { hideKeyboardToolbar(): void openFileByURL(URL: string): boolean + + destroyTheme(): Promise } interface IPosition { diff --git a/app/src/util/assets.ts b/app/src/util/assets.ts index a250ddeea..30c7a55ef 100644 --- a/app/src/util/assets.ts +++ b/app/src/util/assets.ts @@ -37,10 +37,7 @@ export const loadAssets = (data: IAppearance) => { } const defaultStyleElement = document.getElementById("themeDefaultStyle"); - let defaultThemeAddress = `/appearance/themes/${data.mode === 1 ? "midnight" : "daylight"}/theme.css?v=${Constants.SIYUAN_VERSION}`; - if ((data.mode === 1 && data.themeDark !== "midnight") || (data.mode === 0 && data.themeLight !== "daylight")) { - defaultThemeAddress = `/appearance/themes/${data.mode === 1 ? "midnight" : "daylight"}/theme.css?v=${Constants.SIYUAN_VERSION}`; - } + const defaultThemeAddress = `/appearance/themes/${data.mode === 1 ? "midnight" : "daylight"}/theme.css?v=${Constants.SIYUAN_VERSION}`; if (defaultStyleElement) { if (!defaultStyleElement.getAttribute("href").startsWith(defaultThemeAddress)) { defaultStyleElement.remove(); @@ -135,19 +132,13 @@ export const initAssets = () => { } fetchPost("/api/system/setAppearanceMode", { mode: OSTheme === "light" ? 0 : 1 - }, response => { - if (window.siyuan.config.appearance.themeJS) { - /// #if !MOBILE - exportLayout({ - cb() { - window.location.reload(); - }, - errorExit: false, - }); - /// #else - window.location.reload(); - /// #endif - return; + }, async response => { + if (window.siyuan.config.appearance.themeJS && window.destroyTheme) { + try { + await window.destroyTheme(); + } catch (e) { + console.error("destroyTheme error: " + e); + } } window.siyuan.config.appearance = response.data.appearance; loadAssets(response.data.appearance); @@ -264,32 +255,12 @@ export const setMode = (modeElementValue: number) => { fetchPost("/api/setting/setAppearance", Object.assign({}, window.siyuan.config.appearance, { mode: modeElementValue === 2 ? window.siyuan.config.appearance.mode : modeElementValue, modeOS: modeElementValue === 2, - }), response => { - if (window.siyuan.config.appearance.themeJS) { - if (!response.data.modeOS && ( - response.data.mode !== window.siyuan.config.appearance.mode || - window.siyuan.config.appearance.themeLight !== response.data.themeLight || - window.siyuan.config.appearance.themeDark !== response.data.themeDark - )) { - exportLayout({ - cb() { - window.location.reload(); - }, - errorExit: false, - }); - return; - } - const OSTheme = window.matchMedia("(prefers-color-scheme: dark)").matches ? "dark" : "light"; - if (response.data.modeOS && ( - (response.data.mode === 1 && OSTheme === "light") || (response.data.mode === 0 && OSTheme === "dark") - )) { - exportLayout({ - cb() { - window.location.reload(); - }, - errorExit: false, - }); - return; + }), async response => { + if (window.siyuan.config.appearance.themeJS && window.destroyTheme) { + try { + await window.destroyTheme(); + } catch (e) { + console.error("destroyTheme error: " + e); } } appearance.onSetappearance(response.data);