添加清空按钮

Fancyflame · Sep 6, 2024 · 109cc3d · 109cc3d
1 parent 605835a
commit 109cc3d
Show file tree

Hide file tree

Showing 4 changed files with 21 additions and 3 deletions.
diff --git a/web/fg2-app/dist/index.css b/web/fg2-app/dist/index.css
@@ -54,6 +54,7 @@ body h1 {
   font-weight: bold;
   padding: 5px 10px;
   background: rgba(255,255,255,0.627);
+  user-select: none;
 }
 #dialog #btn-field {
   flex: 1 1 40px;

diff --git a/web/fg2-app/dist/src_index_js.bootstrap.js b/web/fg2-app/dist/src_index_js.bootstrap.js
diff --git a/web/fg2-app/index.styl b/web/fg2-app/index.styl
@@ -68,6 +68,7 @@ colorBtn(prim-color)
             font-weight bold
             padding 5px 10px
             background #ffffffa0
+            user-select none
 
     #btn-field
         flex 1 1 40px

diff --git a/web/fg2-app/src/index.js b/web/fg2-app/src/index.js
@@ -8,6 +8,17 @@ const [inputArea, outputArea, encBtn, decBtn, pasteBtn, copyBtn] = [
     "input", "output", "enc-btn", "dec-btn", "paste", "copy"
 ].map(id => document.getElementById(id));
 
+inputArea.oninput = setPasteBtnText;
+
+function setPasteBtnText() {
+    if (inputArea.value == "") {
+        pasteBtn.innerText = "粘贴"
+    } else {
+        pasteBtn.innerText = "清空"
+    }
+}
+setPasteBtnText();
+
 encBtn.onclick = () => {
     let out = GLOBAL_LIB.encode(inputArea.value);
     outputArea.style.color = "";
@@ -25,8 +36,13 @@ decBtn.onclick = () => {
 };
 
 pasteBtn.onclick = async function () {
-    let txt = await navigator.clipboard.readText();
-    inputArea.value = txt;
+    if (inputArea.value == "") {
+        let txt = await navigator.clipboard.readText();
+        inputArea.value = txt;
+    } else {
+        inputArea.value = "";
+    }
+    setPasteBtnText();
 }
 
 copyBtn.onclick = async function () {