From 3931d301816fc0447817d5ed195c2e88451d691f Mon Sep 17 00:00:00 2001
From: Evan Chen <evanchen@kumoly.io>
Date: Sat, 23 Oct 2021 00:24:46 +0800
Subject: [PATCH] update

---
 file.go                           |  2 ++
 src/main.scss                     |  5 ++++
 templates/base/script.tmpl        |  3 +-
 templates/components/toolbar.tmpl | 46 +++++++++++++++++--------------
 4 files changed, 34 insertions(+), 22 deletions(-)

diff --git a/file.go b/file.go
index 32b1f7d..6442b17 100644
--- a/file.go
+++ b/file.go
@@ -56,6 +56,8 @@ func (f *File) Do() (string, error) {
 	if f.Action == "" {
 		return "", nil
 	}
+	f.lock.RLock()
+	defer f.lock.RUnlock()
 	cmd := &exec.Cmd{}
 	if runtime.GOOS == "windows" {
 		cmd = exec.Command(WIN_SHELL, "/c", f.Action)
diff --git a/src/main.scss b/src/main.scss
index e238586..2e1e9b8 100644
--- a/src/main.scss
+++ b/src/main.scss
@@ -26,6 +26,11 @@ $modal-content-width: 90vw;
   display: inline-block;
 }
 
+.icn-loading {
+  animation: spin-animation 3s infinite;
+  display: inline-block;
+}
+
 @keyframes spin-animation {
   0% {
     transform: rotate(0deg);
diff --git a/templates/base/script.tmpl b/templates/base/script.tmpl
index 3486b16..2ee3685 100644
--- a/templates/base/script.tmpl
+++ b/templates/base/script.tmpl
@@ -59,8 +59,7 @@ async function FileApply(){
   else {
     const res = await fetch('/api/apply?name='+ Active, {
       method: 'POST',
-    }).catch(err=>{console.log(err);return;});
-    console.log("running")
+    });
     if(!res.ok){
       const result = await Catch(res)
       result_editor.session.setValue(result)
diff --git a/templates/components/toolbar.tmpl b/templates/components/toolbar.tmpl
index efa43c4..f4aebc3 100644
--- a/templates/components/toolbar.tmpl
+++ b/templates/components/toolbar.tmpl
@@ -15,7 +15,7 @@
         <button class="button is-small has-tooltip-arrow" id="toolFollow" 
           data-tooltip="Follow file change (1s)" onclick="toolFollow()">
           <span class="icon is-small"><span class="material-icons" id="toolFollowIcon">
-            pause
+            sync_disabled
           </span></span>
         </button>
       </p>
@@ -53,9 +53,9 @@
   <div class="level-right">
     <div class="field has-addons">
       <p class="control">
-        <button class="button is-small has-tooltip-arrow" id="toolRefresh"
+        <button class="button is-small has-tooltip-arrow"
           data-tooltip="Refresh" onclick="toolRefresh()">
-          <span class="icon is-small"><span class="material-icons">
+          <span class="icon is-small"><span class="material-icons" id="toolRefreshIco">
             refresh
           </span></span>
         </button>
@@ -63,16 +63,16 @@
       {{if not .File.RO}}
         <p class="control">
           {{if eq .File.Name .AppName}}
-            <button class="button is-small has-tooltip-arrow" id="toolSave" 
+            <button class="button is-small has-tooltip-arrow"
               data-tooltip="Apply" onclick="toolSave()">
-              <span class="icon is-small"><span class="material-icons">
+              <span class="icon is-small"><span class="material-icons" id="toolSaveIco">
                 play_arrow
               </span></span>  
             </button>
           {{else}}
-            <button class="button is-small has-tooltip-arrow" id="toolSave" 
+            <button class="button is-small has-tooltip-arrow"
               data-tooltip="Save" onclick="toolSave()">
-              <span class="icon is-small"><span class="material-icons">
+              <span class="icon is-small"><span class="material-icons" id="toolSaveIco">
                 save
               </span></span>
             </button>
@@ -83,8 +83,8 @@
       <p class="control">
         <button class="button is-small has-tooltip-arrow"
           data-tooltip="{{.File.Action}}"
-          id="toolApply" onclick="toolApply()">
-          <span class="icon is-small"><span class="material-icons">
+          onclick="toolApply()">
+          <span class="icon is-small"><span class="material-icons"id="toolApplyIco">
             play_arrow
           </span></span> 
         </button>
@@ -152,7 +152,7 @@ function toolFollow(){
     let icon = document.getElementById('toolFollowIcon');
     el.classList.remove('is-primary');
     icon.classList.remove('icn-spinner');
-    icon.innerText='pause';
+    icon.innerText='sync_disabled';
   } else {
     ToolIsFollow = true
     let el = document.getElementById('toolFollow');
@@ -165,24 +165,30 @@ function toolFollow(){
 }
 
 async function toolRefresh(){
-  let el = document.getElementById('toolRefresh');
-  el.classList.add("is-loading")
+  let el = document.getElementById('toolRefreshIco');
+  el.classList.toggle('icn-loading')
   await FileGet()
-  el.classList.remove("is-loading")
+  el.classList.toggle('icn-loading')
 }
 
 async function toolSave(){
-  let el = document.getElementById('toolSave');
-  el.classList.add("is-loading")
+  let el = document.getElementById('toolSaveIco');
+  let originText = el.innerText;
+  el.innerText='refreash';
+  el.classList.add("icn-loading")
   await FileSave()
-  el.classList.remove("is-loading")
+  el.innerText=originText;
+  el.classList.remove("icn-loading")
 }
 
 async function toolApply(){
-  let el = document.getElementById('toolApply');
-  el.classList.add("is-loading")
-  await FileApply()
-  el.classList.remove("is-loading")
+  let el = document.getElementById('toolApplyIco');
+  let originText = el.innerText;
+  el.innerText='refreash';
+  el.classList.add("icn-loading")
+  FileApply()
+  el.innerText=originText;
+  el.classList.remove("icn-loading")
   ResultViewTog()
 }
 </script>