Use localstorage to track current commit.

3 files changed, 48 insertions, 16 deletions

diff --git a/gn2/wqflask/templates/gn_editor.html b/gn2/wqflask/templates/gn_editor.html
index dca6d161..d55662c3 100644
--- a/gn2/wqflask/templates/gn_editor.html
+++ b/gn2/wqflask/templates/gn_editor.html
@@ -94,8 +94,7 @@
           fixedWidthGutter: false, // boolean: true if the gutter should be fixed width
           theme: "ace/theme/dracula", // theme string from ace/theme or custom?
 	  scrollSpeed: 2, // number: the scroll speed index
-
-          dragDelay: 0, // number: the drag delay before drag starts. it's 150ms for mac by default
+          dragDelay: 0, 
           dragEnabled: true, // boolean: enable dragging
           focusTimout: 0, // number: the focus delay before focus starts.
           tooltipFollowsMouse: true, // boolean: true if the gutter tooltip should follow mouse
@@ -112,8 +111,13 @@
           foldStyle: 'markbegin', // enum: 'manual'/'markbegin'/'markbeginend'.
           mode: 'ace/mode/markdown'
 
-      }
-   
+    }
+    let hash = {{ hash|tojson }} 
+    let filePath = {{ file_path|tojson }}
+    localStorage.setItem("gn_editor_sha" ,hash)
+     document.querySelector("#output").addEventListener("commitEvent", function(event){    
+    htmx.ajax("POST", "/editor/commit", {target: "#output", swap:"innerHTML",values: {'msg':event.detail.payload, 'content': editor.getValue(), "hash": localStorage.getItem("gn_editor_sha"), "file_path": filePath}})
+          })
 
           document.querySelector("#output").addEventListener("updateEditor", function(event){
               editor.setOptions({
diff --git a/gn2/wqflask/templates/gn_editor_commit.html b/gn2/wqflask/templates/gn_editor_commit.html
index 7c419c0b..0ea20adb 100644
--- a/gn2/wqflask/templates/gn_editor_commit.html
+++ b/gn2/wqflask/templates/gn_editor_commit.html
@@ -1,5 +1,5 @@
 <section classs="row commit-content"  style="padding-top:25px">
-  <form  action="/editor/commit" method="POST" class="col-sm-10 col-sm-offset-1">
+  <div  class="col-sm-10 col-sm-offset-1">
     <div>
       <div>
         <h2> <i>Commit your Changes</i></h2>
@@ -13,7 +13,7 @@
       </div>
       <br>
       <div class="row">
-        <textarea rows="12" class="col-sm-12" name="message" required>
+        <textarea rows="12" class="col-sm-12" name="message" required id="commit-message">
         </textarea>
 
       </div>
@@ -21,14 +21,29 @@
     <br>
     <br>
     <div class="row">
-      <button  hx-post="/editor/commit"
-	       hx-target="#output"
-	       hx-swap= "innerHTML"
+      <button id="btn-commit"
 	       class="btn btn-primary col-sm-2 col-sm-offset-1">
         Commit
       </button>
     </div>
     <br>
 
-  </form>
+  </div>
 </section>
+{% block js %}
+
+ <script>
+  htmx.on("#btn-commit", "click", function(event){
+      let msg = htmx.find("#commit-message").value.trim()
+      if (msg != ""){
+	  //fire custom event here re
+	  htmx.find("#output").dispatchEvent(
+          new CustomEvent("commitEvent", {
+              bubbles: true,
+              detail: {action: 'didInitialize', payload: msg},
+          }),
+      );
+      }
+  })
+</script>
+{% endblock %}
diff --git a/gn2/wqflask/templates/gn_editor_results_page.html b/gn2/wqflask/templates/gn_editor_results_page.html
index 9453ba02..8cfa35dc 100644
--- a/gn2/wqflask/templates/gn_editor_results_page.html
+++ b/gn2/wqflask/templates/gn_editor_results_page.html
@@ -2,26 +2,39 @@
   <div  class="col-sm-10 col-sm-offset-1">
     <div>
       <div>
-        <h2> <i>Results status</i></h2>
+        <h2> <i>Results status - {{status}}</i></h2>
       </div>
     </div>
     <br>
     {% if error %}
-    <h1> error occurred *error message hereh </h1>
+    <h1> Error-type: <mark style="font-family: 'Linux Libertine','Georgia','Times','Source Serif Pro',serif;"><b><i>{{error}}</i></b></mark></h1>
+    <h3>Error-message:
+      <mark style="font-family: 'Linux Libertine','Georgia','Times','Source Serif Pro',serif;"><b><i>{{msg}}</i></b></mark></h3>
     {% else %}
       <div>
-	<h3>Commit Sha: <span class="lead">
-	    <mark style="font-family: 'Linux Libertine','Georgia','Times','Source Serif Pro',serif;"><b><i>commit hash</i></b></mark>
+	<h3>New Commit Sha: <span class="lead">
+	    <mark style="font-family: 'Linux Libertine','Georgia','Times','Source Serif Pro',serif;"><b><i>{{commit_sha}}</i></b></mark>
 	</span></h3>
          <br/>
 	<div class="lead"> <h3>Commit Message:
-	        <mark style="font-family: 'Linux Libertine','Georgia','Times','Source Serif Pro',serif;"><b><i>commit message</i></b></mark>
+	        <mark style="font-family: 'Linux Libertine','Georgia','Times','Source Serif Pro',serif;"><b><i>{{message}}</i></b></mark>
 	  </h3>
 	  
 	</div>
     </div>
     {% endif %}
-    <br> 
+      <br>
   </div>
 </section>
       
+{% block js %}
+
+<script>
+  var commitSha = "{{ commit_sha }}";
+  if (commitSha !="" && commitSha!= undefined){
+      localStorage.setItem("gn_editor_sha", commitSha)      
+  }
+ 
+</script>
+
+{% endblock %}