From 17928ee936b14821c893d52735bc1f81ceb866d3 Mon Sep 17 00:00:00 2001
From: Vanessa <lly219@gmail.com>
Date: Mon, 29 Aug 2022 10:32:54 +0800
Subject: [PATCH] =?UTF-8?q?:bug:=20windows=20=E4=B8=8B=20#=201=20=E5=90=8E?=
 =?UTF-8?q?=E5=88=B7=E6=96=B0=20loading=20=E4=B8=8D=E6=B6=88=E5=A4=B1?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 app/src/protyle/breadcrumb/action.ts |  2 +-
 app/src/protyle/ui/initUI.ts         |  9 ++++++++-
 app/src/protyle/util/onGet.ts        | 11 +++--------
 3 files changed, 12 insertions(+), 10 deletions(-)

diff --git a/app/src/protyle/breadcrumb/action.ts b/app/src/protyle/breadcrumb/action.ts
index 75749018a..b3660c26b 100644
--- a/app/src/protyle/breadcrumb/action.ts
+++ b/app/src/protyle/breadcrumb/action.ts
@@ -9,7 +9,7 @@ import {saveScroll} from "../scroll/saveScroll";
 import {hideElements} from "../ui/hideElements";
 
 export const netImg2LocalAssets = (protyle: IProtyle) => {
-    if (protyle.element.querySelector(".fn__loading")) {
+    if (protyle.element.querySelector(".wysiwygLoading")) {
         return;
     }
     addLoading(protyle);
diff --git a/app/src/protyle/ui/initUI.ts b/app/src/protyle/ui/initUI.ts
index 99481b2e6..27c6ec6fe 100644
--- a/app/src/protyle/ui/initUI.ts
+++ b/app/src/protyle/ui/initUI.ts
@@ -48,7 +48,14 @@ export const initUI = (protyle: IProtyle) => {
 };
 
 export const addLoading = (protyle: IProtyle) => {
-    protyle.element.insertAdjacentHTML("beforeend", "<div style=\"background-color: var(--b3-theme-background)\" class=\"fn__loading\"><img width=\"48px\" src=\"/stage/loading-pure.svg\"></div>");
+    protyle.element.insertAdjacentHTML("beforeend", '<div style="background-color: var(--b3-theme-background)" class="fn__loading wysiwygLoading"><img width="48px" src="/stage/loading-pure.svg"></div>');
+};
+
+export const removeLoading = (protyle: IProtyle) => {
+    const loadingElement = protyle.element.querySelector(".wysiwygLoading");
+    if (loadingElement) {
+        loadingElement.remove();
+    }
 };
 
 export const setPadding = (protyle: IProtyle) => {
diff --git a/app/src/protyle/util/onGet.ts b/app/src/protyle/util/onGet.ts
index 9c4118fa9..d3c59985c 100644
--- a/app/src/protyle/util/onGet.ts
+++ b/app/src/protyle/util/onGet.ts
@@ -15,6 +15,7 @@ import {focusBlock} from "./selection";
 import {hasClosestByAttribute, hasClosestByClassName} from "./hasClosest";
 import {preventScroll} from "../scroll/preventScroll";
 import {restoreScroll} from "../scroll/saveScroll";
+import {removeLoading} from "../ui/initUI";
 
 export const onGet = (data: IWebSocketData, protyle: IProtyle, action: string[] = [], scrollAttr?: IScrollAttr, renderTitle = false) => {
     protyle.wysiwyg.element.removeAttribute("data-top");
@@ -84,10 +85,7 @@ export const onGet = (data: IWebSocketData, protyle: IProtyle, action: string[]
             action,
             unScroll: false,
         }, protyle);
-        const loadingElement = protyle.element.querySelector(".fn__loading");
-        if (loadingElement) {
-            loadingElement.remove();
-        }
+        removeLoading(protyle);
         return;
     }
 
@@ -122,10 +120,7 @@ export const onGet = (data: IWebSocketData, protyle: IProtyle, action: string[]
         if (scrollObj && protyle.options.mode !== "preview") {
             restoreScroll(protyle, scrollObj);
         }
-        const loadingElement = protyle.element.querySelector(".fn__loading");
-        if (loadingElement) {
-            loadingElement.remove();
-        }
+        removeLoading(protyle)
     });
 };