Merge pull request #139 from obgnail/dev

Dev
obgnail · Sep 3, 2023 · 3208045 · 3208045
2 parents 6587f67 + f4e14b8
commit 3208045
Show file tree

Hide file tree

Showing 4 changed files with 77 additions and 63 deletions.
diff --git a/plugin/custom/plugins/pluginUpdater.js b/plugin/custom/plugins/pluginUpdater.js
@@ -1,11 +1,10 @@
 class pluginUpdater extends BaseCustomPlugin {
-    selector = () => (this.updaterExist && this.commander) ? "" : this.utils.nonExistSelector
+    selector = () => (this.updaterExist && this.utils.getPlugin("commander")) ? "" : this.utils.nonExistSelector
 
     hint = () => "当你发现BUG，可以尝试更新，指不定就解决了"
 
     init = () => {
         this.dir = this.utils.joinPath("./plugin/updater");
-        this.commander = this.utils.getPlugin("commander");
         this.updater = this.utils.joinPath("./plugin/updater/updater.exe");
         this.updaterExist = this.utils.existPath(this.updater);
 
@@ -51,7 +50,7 @@ class pluginUpdater extends BaseCustomPlugin {
             this.modal(modal, components => {
                 const proxy = (components[1].submit || "").trim();
                 const cmd = `cd ${this.dir} && ${this.updater} --action=update --proxy=${proxy}`;
-                this.commander.alwaysExec(cmd, "cmd/bash");
+                this.utils.getPlugin("commander").alwaysExec(cmd, "cmd/bash");
             })
         })
     }

diff --git a/plugin/fence_enhance.js b/plugin/fence_enhance.js
@@ -25,12 +25,12 @@ class fenceEnhancePlugin extends global._basePlugin {
                 right: .5em;
                 z-index: 8;
                 font-size: 1.2em;
-            }
-            #write .fence-enhance .typora-copy-code, .typora-fold-code, .typora-indent-code {
                 opacity: 0.5;
+            }
+            #write .fence-enhance .enhance-button {
                 cursor: pointer;
             }
-            #write .fence-enhance .typora-copy-code, .typora-indent-code {
+            #write .fence-enhance .copy-code, .indent-code {
                 margin-left: .5em;
             }`;
         return {textID, text}
@@ -94,27 +94,27 @@ class fenceEnhancePlugin extends global._basePlugin {
             disable_or_enable_fold: () => {
                 this.config.ENABLE_FOLD = !this.config.ENABLE_FOLD;
                 if (!this.config.ENABLE_FOLD) {
-                    document.querySelectorAll(".typora-fold-code.folded").forEach(ele => ele.click());
+                    document.querySelectorAll(".fold-code.folded").forEach(ele => ele.click());
                 }
                 const display = (this.config.ENABLE_FOLD) ? "block" : "none";
-                document.querySelectorAll(".fence-enhance .typora-fold-code").forEach(ele => ele.style.display = display);
+                document.querySelectorAll(".fence-enhance .fold-code").forEach(ele => ele.style.display = display);
             },
             disable_or_enable_copy: () => {
                 this.config.ENABLE_COPY = !this.config.ENABLE_COPY;
                 const display = (this.config.ENABLE_COPY) ? "block" : "none";
-                document.querySelectorAll(".fence-enhance .typora-copy-code").forEach(ele => ele.style.display = display);
+                document.querySelectorAll(".fence-enhance .copy-code").forEach(ele => ele.style.display = display);
             },
             disable_or_enable_indent: () => {
                 this.enableIndent = !this.enableIndent;
                 const display = (this.enableIndent) ? "block" : "none";
-                document.querySelectorAll(".fence-enhance .typora-indent-code").forEach(ele => ele.style.display = display);
+                document.querySelectorAll(".fence-enhance .indent-code").forEach(ele => ele.style.display = display);
             },
             fold_all: () => {
-                document.querySelectorAll(".typora-fold-code:not(.folded)").forEach(ele => ele.click());
+                document.querySelectorAll(".fold-code:not(.folded)").forEach(ele => ele.click());
                 this.config.FOLD_DEFAULT = true;
             },
             expand_all: () => {
-                document.querySelectorAll(".typora-fold-code.folded").forEach(ele => ele.click());
+                document.querySelectorAll(".fold-code.folded").forEach(ele => ele.click());
                 this.config.FOLD_DEFAULT = false;
             },
             fold_current: () => this.foldFence(this.dynamicUtil.target),
@@ -140,21 +140,13 @@ class fenceEnhancePlugin extends global._basePlugin {
         })
 
         document.getElementById("write").addEventListener("click", ev => {
-            const copy = ev.target.closest(".typora-copy-code");
-            const fold = ev.target.closest(".typora-fold-code");
-            const indent = ev.target.closest(".typora-indent-code");
-            if (!copy && !fold && !indent) return;
-
-            ev.preventDefault();
-            ev.stopPropagation();
-            document.activeElement.blur();
-
-            if (copy) {
-                this.copyCode(ev, copy);
-            } else if (fold) {
-                this.foldCode(ev, fold);
-            } else {
-                this.indentCode(ev, indent);
+            const target = ev.target.closest(".fence-enhance .enhance-button");
+            if (target) {
+                ev.preventDefault();
+                ev.stopPropagation();
+                document.activeElement.blur();
+                const action = target.getAttribute("action");
+                this[action](ev, target);
             }
         })
 
@@ -164,15 +156,17 @@ class fenceEnhancePlugin extends global._basePlugin {
                 this.querySelector(".fence-enhance").style.visibility = "";
             }
         }).on("mouseleave", ".md-fences", function () {
-            if (config.AUTO_HIDE && !this.querySelector(".typora-fold-code.folded")) {
+            if (config.AUTO_HIDE && !this.querySelector(".fold-code.folded")) {
                 this.querySelector(".fence-enhance").style.visibility = "hidden";
             }
         })
     }
 
-    createButton = (className, hint, iconClassName) => {
+    createButton = (className, action, hint, iconClassName) => {
         const button = document.createElement("div");
+        button.classList.add("enhance-button");
         button.classList.add(className);
+        button.setAttribute("action", action);
         hint && button.setAttribute("ty-hint", hint);
         const span = document.createElement("span");
         span.className = iconClassName;
@@ -190,17 +184,17 @@ class fenceEnhancePlugin extends global._basePlugin {
                 enhance.style.visibility = "hidden";
             }
 
-            const foldButton = this.createButton("typora-fold-code", "折叠", "fa fa-minus");
+            const foldButton = this.createButton("fold-code", "foldCode", "折叠", "fa fa-minus");
             if (!this.config.ENABLE_FOLD) {
                 foldButton.style.display = "none";
             }
 
-            const indentButton = this.createButton("typora-indent-code", "调整缩进", "fa fa-indent");
+            const indentButton = this.createButton("indent-code", "indentCode", "调整缩进", "fa fa-indent");
             if (!this.enableIndent) {
                 indentButton.style.display = "none";
             }
 
-            const copyButton = this.createButton("typora-copy-code", "复制", "fa fa-clipboard");
+            const copyButton = this.createButton("copy-code", "copyCode", "复制", "fa fa-clipboard");
             if (!this.config.ENABLE_COPY) {
                 copyButton.style.display = "none";
             }
@@ -285,11 +279,11 @@ class fenceEnhancePlugin extends global._basePlugin {
         return arr
     }
 
-    copyFence = target => target.querySelector(".typora-copy-code").click();
-    indentFence = target => target.querySelector(".typora-indent-code").click();
-    foldFence = target => target.querySelector(".typora-fold-code").click();
+    copyFence = target => target.querySelector(".copy-code").click();
+    indentFence = target => target.querySelector(".indent-code").click();
+    foldFence = target => target.querySelector(".fold-code").click();
     expandFence = fence => {
-        const button = fence.querySelector(".fence-enhance .typora-fold-code.folded");
+        const button = fence.querySelector(".fence-enhance .fold-code.folded");
         button && button.click();
     }
 

diff --git a/plugin/global/settings/settings.default.toml b/plugin/global/settings/settings.default.toml
@@ -285,6 +285,8 @@ THRESHOLD = 50
 SCROLL_TIME = 600
 # 标签的颜色
 COLOR = "var(--active-file-border-color, black)"
+# hover时标签的颜色
+HOVER_COLOR = "var(--item-hover-bg-color, black)"
 # 标签id
 DIV_ID = "plugin-go-top"
 

diff --git a/plugin/go_top.js b/plugin/go_top.js
@@ -1,38 +1,57 @@
 class goTopPlugin extends global._basePlugin {
-    html = () => {
-        const goTop = document.createElement("div");
-        goTop.id = this.config.DIV_ID;
-        goTop.style.position = "fixed";
-        goTop.style.right = "50px";
-        goTop.style.bottom = "50px";
-        goTop.style.zIndex = "99999";
-        goTop.style.cursor = "pointer";
-        goTop.style.fontSize = "50px";
-        goTop.style.color = this.config.COLOR;
-        goTop.style.display = "none";
-        const i = document.createElement("i");
-        i.classList.add("ion-arrow-up-c");
-        goTop.appendChild(i);
-        this.utils.insertDiv(goTop);
+    style = () => {
+        const textID = "plugin-go-top-style";
+        const text = `
+            #${this.config.DIV_ID} {
+                position: fixed;
+                right: 50px;
+                bottom: 50px;
+                z-index: 99999;
+                font-size: 28px;
+                text-align: center;
+                color: ${this.config.COLOR};
+            }
+            
+            #${this.config.DIV_ID} .roll-item {
+                width: 35px;
+                height: 35px;
+                margin-top: 10px;
+                cursor: pointer;
+                box-shadow: rgba(0, 0, 0, 0.07) 0px 0px 10px;
+                border-radius: 4px;
+            }
+            
+            #${this.config.DIV_ID} .roll-item:hover {
+                background-color: ${this.config.HOVER_COLOR};
+            }
+            
+            #${this.config.DIV_ID} .roll-item .fa {
+                display: block;
+                line-height: 35px;
+            }
+        `
+        return {textID, text}
     }
 
-    init = () => {
-        this.goTop = document.getElementById(this.config.DIV_ID);
+    html = () => {
+        const wrap = document.createElement("div");
+        wrap.id = this.config.DIV_ID;
+        wrap.innerHTML = `
+            <div class="roll-item" action="go-top"><i class="fa fa-angle-up"></i></div>
+            <div class="roll-item" action="go-bottom"><i class="fa fa-angle-down"></i></div>`;
+        this.utils.insertDiv(wrap);
     }
 
     process = () => {
-        this.init();
-
         document.getElementById(this.config.DIV_ID).addEventListener("click", ev => {
-            this.call();
-            ev.preventDefault();
-            ev.stopPropagation();
+            const target = ev.target.closest(".roll-item");
+            if (target) {
+                const action = target.getAttribute("action");
+                this.call(action);
+                ev.preventDefault();
+                ev.stopPropagation();
+            }
         });
-
-        const content = document.querySelector("content");
-        content.addEventListener("scroll", () => {
-            this.goTop.style.display = (content.scrollTop > this.config.THRESHOLD) ? "" : "none";
-        })
     }
 
     call = direction => {