🎨 Improve plugin loading

siyuan-note · Nov 21, 2023 · 7452801 · 7452801
1 parent 46f3cea
commit 7452801
Show file tree

Hide file tree

Showing 5 changed files with 34 additions and 40 deletions.
diff --git a/app/src/config/bazaar.ts b/app/src/config/bazaar.ts
@@ -16,7 +16,7 @@ import {Plugin} from "../plugin";
 import {App} from "../index";
 import {escapeAttr} from "../util/escape";
 import {uninstall} from "../plugin/uninstall";
-import {afterLoadPlugin, loadPlugin, loadPlugins} from "../plugin/loader";
+import {afterLoadPlugins, loadPetals, loadPlugin, loadPlugins} from "../plugin/loader";
 
 export const bazaar = {
     element: undefined as Element,
@@ -794,7 +794,7 @@ export const bazaar = {
                     if (!target.getAttribute("disabled")) {
                         target.setAttribute("disabled", "disabled");
                         window.siyuan.config.bazaar.petalDisabled = !(target as HTMLInputElement).checked;
-                        fetchPost("/api/setting/setBazaar", window.siyuan.config.bazaar, () => {
+                        fetchPost("/api/setting/setBazaar", window.siyuan.config.bazaar, async () => {
                             target.removeAttribute("disabled");
                             if (window.siyuan.config.bazaar.petalDisabled) {
                                 bazaar.element.querySelectorAll("#configBazaarDownloaded .b3-card").forEach(item => {
@@ -805,11 +805,9 @@ export const bazaar = {
                                 bazaar.element.querySelectorAll("#configBazaarDownloaded .b3-card").forEach(item => {
                                     item.classList.remove("b3-card--disabled");
                                 });
-                                loadPlugins(app).then(() => {
-                                    app.plugins.forEach(item => {
-                                        afterLoadPlugin(item);
-                                    });
-                                });
+                                const plugins = await loadPetals();
+                                await loadPlugins(app, plugins);
+                                await afterLoadPlugins(app.plugins);
                             }
                         });
                     }

diff --git a/app/src/layout/util.ts b/app/src/layout/util.ts
@@ -30,7 +30,7 @@ import {getIdZoomInByPath} from "../util/pathName";
 import {Custom} from "./dock/Custom";
 import {newCardModel} from "../card/newCardTab";
 import {App} from "../index";
-import {afterLoadPlugin} from "../plugin/loader";
+import {afterLoadPlugins} from "../plugin/loader";
 import {setTitle} from "../dialog/processSystem";
 import {newCenterEmptyTab, resizeTabs} from "./tabUtil";
 
@@ -387,9 +387,7 @@ export const JSONToLayout = (app: App, isStart: boolean) => {
             }
         });
     }
-    app.plugins.forEach(item => {
-        afterLoadPlugin(item);
-    });
+    afterLoadPlugins(app.plugins);
     // 移除没有插件的 tab
     document.querySelectorAll('li[data-type="tab-header"]').forEach((item: HTMLElement) => {
         const initData = item.getAttribute("data-initdata");

diff --git a/app/src/mobile/index.ts b/app/src/mobile/index.ts
@@ -21,7 +21,7 @@ import {getSearch} from "../util/functions";
 import {initRightMenu} from "./menu";
 import {openChangelog} from "../boot/openChangelog";
 import {registerServiceWorker} from "../util/serviceWorker";
-import {afterLoadPlugin, loadPetals, loadPlugins} from "../plugin/loader";
+import {loadPetals, loadPlugins, afterLoadPlugins} from "../plugin/loader";
 import {saveScroll} from "../protyle/scroll/saveScroll";
 import {removeBlock} from "../protyle/wysiwyg/remove";
 import {isNotEditBlock} from "../protyle/wysiwyg/getBlock";
@@ -116,29 +116,25 @@ class App {
             initFramework(this, confResponse.data.start);
             initRightMenu(this);
             openChangelog();
-            const unPinsMenu: IMenu[] = [];
-            this.plugins.forEach(item => {
-                const unPinMenu = afterLoadPlugin(item);
-                if (unPinMenu) {
-                    unPinMenu.forEach(unpinItem => {
-                        unPinsMenu.push(unpinItem);
+            afterLoadPlugins(this.plugins).then(menus => {
+                const unPinsMenu: IMenu[] = menus
+                    .filter(menu => Array.isArray(menu))
+                    .flat();
+                if (unPinsMenu.length > 0) {
+                    const pluginElement = document.createElement("div");
+                    pluginElement.classList.add("b3-menu__item");
+                    pluginElement.setAttribute("data-menu", "true");
+                    pluginElement.innerHTML = `<svg class="b3-menu__icon"><use xlink:href="#iconPlugin"></use></svg><span class="b3-menu__label">${window.siyuan.languages.plugin}</span>`;
+                    pluginElement.addEventListener("click", () => {
+                        const menu = new Menu();
+                        unPinsMenu.forEach(item => {
+                            menu.addItem(item);
+                        });
+                        menu.fullscreen();
                     });
+                    document.querySelector("#menuAbout").after(pluginElement);
                 }
             });
-            if (unPinsMenu.length > 0) {
-                const pluginElement = document.createElement("div");
-                pluginElement.classList.add("b3-menu__item");
-                pluginElement.setAttribute("data-menu", "true");
-                pluginElement.innerHTML = `<svg class="b3-menu__icon"><use xlink:href="#iconPlugin"></use></svg><span class="b3-menu__label">${window.siyuan.languages.plugin}</span>`;
-                pluginElement.addEventListener("click", () => {
-                    const menu = new Menu();
-                    unPinsMenu.forEach(item => {
-                        menu.addItem(item);
-                    });
-                    menu.fullscreen();
-                });
-                document.querySelector("#menuAbout").after(pluginElement);
-            }
             addGA();
 
             document.addEventListener("touchstart", handleTouchStart, false);

diff --git a/app/src/plugin/loader.ts b/app/src/plugin/loader.ts
@@ -47,7 +47,7 @@ export const loadPlugins = async (app: App, plugins: IPluginData[]) => {
         return loadPluginJS(app, plugin);
     }));
 
-    pluginsStyle.innerHTML = css.join("\n");
+    pluginsStyle.textContent = css.join("\n");
 };
 
 const loadPluginJS = async (app: App, item: IPluginData) => {
@@ -89,7 +89,7 @@ export const loadPlugin = async (app: App, item: IPluginData) => {
     const styleElement = document.createElement("style");
     styleElement.textContent = item.css;
     document.head.append(styleElement);
-    afterLoadPlugin(plugin);
+    await afterLoadPlugin(plugin);
     /// #if !MOBILE
     exportLayout({
         reload: false,
@@ -155,9 +155,13 @@ const mergePluginHotkey = (plugin: Plugin) => {
     }
 };
 
-export const afterLoadPlugin = (plugin: Plugin) => {
+export const afterLoadPlugins = async (plugins: Plugin[]) => {
+    return Promise.all(plugins.map(plugin => afterLoadPlugin(plugin)));
+}
+
+export const afterLoadPlugin = async (plugin: Plugin) => {
     try {
-        plugin.onLayoutReady();
+        await plugin.onLayoutReady();
     } catch (e) {
         console.error(`plugin ${plugin.name} onLayoutReady error:`, e);
     }

diff --git a/app/src/window/init.ts b/app/src/window/init.ts
@@ -10,7 +10,7 @@ import {renderSnippet} from "../config/util/snippets";
 import {getSearch} from "../util/functions";
 import {initWindow} from "../boot/onGetConfig";
 import {App} from "../index";
-import {afterLoadPlugin} from "../plugin/loader";
+import {afterLoadPlugins} from "../plugin/loader";
 import {Tab} from "../layout/Tab";
 import {initWindowEvent} from "../boot/globalEvent/event";
 
@@ -59,9 +59,7 @@ export const init = (app: App) => {
 };
 
 const afterLayout = (app: App) => {
-    app.plugins.forEach(item => {
-        afterLoadPlugin(item);
-    });
+    afterLoadPlugins(app.plugins);
     document.querySelectorAll('li[data-type="tab-header"][data-init-active="true"]').forEach((item: HTMLElement) => {
         item.removeAttribute("data-init-active");
         const tab = getInstanceById(item.getAttribute("data-id")) as Tab;