Add saveFailCounter

Fix bug with not clearing noteId
Refactor a class removal and additions
Add script.min.js

public/js/script.js

@@ -8,6 +8,7 @@ let saveTimeout = 15000;
 var to = null;
 let controller;
 var BOOKS = {};
+let saveFailCounter = 0;
 
 $(function () {
     setHeight();
@@ -160,6 +161,7 @@ function newNote() {
     document.querySelector('#template').value = 0;
     document.querySelector('#passage').value = '';
     document.querySelector('#recording').value = '';
+    document.querySelector('#noteId').value = '';
 
     document.querySelector('#ref-list').innerHTML = '';
     document.querySelector('#ref').innerHTML = '';
@@ -209,8 +211,7 @@ function saveNote(event) {
     })
         .done(function (data) {
             if (data.msg == 'saved' && !saved) {
-                saveCheck.classList.remove('saving');
+                saveCheck.classList.remove('saving', 'error', 'fa-times', 'fa-check');
-                saveCheck.classList.remove('error');
                 showSave();
                 if (noteText == document.querySelector('#notes').value) {
                     saved = true;
@@ -224,17 +225,22 @@ function saveNote(event) {
             }
         })
         .fail(function (xhr, status, error) {
-            saveCheck.classList.remove('saving');
+            saveFailCounter++;
-            saveCheck.classList.add('error');
+            saveCheck.classList.remove('saving', 'fa-check');
+            saveCheck.classList.add('fa-times', 'error');
             console.error(error);
         })
         .always(function (xhr, status) {
             if (status == 'timeout') {
-                saveCheck.classList.remove('saving');
+                saveCheck.classList.remove('saving', 'fa-check');
-                saveCheck.classList.add('error');
+                saveCheck.classList.add('error', 'fa-times');
             }
             clearTimeout(to);
-            to = setTimeout(saveNote, saveTimeout);
+            if (saveFailCounter < 5) {
+                to = setTimeout(saveNote, saveTimeout);
+            } else {
+                saveFailCounter = 0;
+            }
         });
 }
 
@@ -262,7 +268,8 @@ function isUuidValid(uuid) {
 }
 
 function startSave() {
-    document.querySelector('#save-check').classList.add('saving');
+    document.querySelector('#save-check').classList.remove('error', 'fa-times', 'fa-check');
+    document.querySelector('#save-check').classList.add('saving', 'fa-check');
     document.querySelector('#save-check').style.opacity = 1;
 }
 
@@ -276,6 +283,7 @@ function showSave() {
     if (saved) { return; }
 
     var checkmark = document.getElementById("save-check");
+    checkmark.classList.add('fa-check');
 
     // Schedule the animation to run every 1 second (which is equivalent to a 1-second delay between each iteration)
     var si = setInterval(function () {

public/js/script.min.js

@@ -0,0 +1 @@
+function setBooks(){fetch("/js/data.json").then(res=>{if(!res.ok)throw new Error("HTTP Error: Status: ${res.status}");return res.json()}).then(data=>{BOOKS=data}).catch(error=>{console.log(error)})}function setEventListeners(){document.addEventListener("keyup",function(event){"F3"==event.key&&openRef(!1)}),document.querySelector("#notes").addEventListener("keyup",function(event){let key=event.keyCode;(key>=48&&key<=90||key>=96&&key<=111||key>=186&&key<=222)&&(textDirty=!0,document.querySelector("#note-header-left h2").classList.add("dirty"))})}function setHeight(){md=new markdownit({html:!0,linkify:!0,breaks:!0}),body=document.querySelector("body"),body.style.height=window.innerHeight+"px",cont=document.querySelector("#main"),cont.style.height=window.innerHeight+"px",tabs=document.querySelector(".ref-tab"),tabs.style.height=window.innerHeight-13+"px",ref=document.querySelector(".ref"),ref.style.height=window.innerHeight-50+"px",noteList=document.querySelector("#note-list"),noteList.style.height=window.innerHeight-50+"px",notes=document.querySelector(".notes"),notes.style.height=window.innerHeight-50+"px",notePreview=document.querySelector("#notePreview"),notePreview.style.height=window.innerHeight-50+"px",$("#noteDate")&&$("#noteDate").datepicker(),$("#query")&&document.querySelector("#query").addEventListener("keyup",function(event){"Enter"==event.key&&search()}),to||(to=setTimeout(saveNote,saveTimeout))}function search(){query=document.querySelector("#query").value,fetch("/index.php/search",{method:"POST",headers:{"Content-Type":"application/json"},body:JSON.stringify({query:query})}).then(response=>response.json()).then(results=>{var oldNotes=document.querySelector("#old-notes");for(var n in oldNotes.innerHTML="",results){var link=document.createElement("a");link.href="#",link.setAttribute("onclick","retrieveNote('"+results[n].id+"');openNote();"),link.innerHTML=results[n].title;var p=document.createElement("p");p.innerHTML=results[n].passage;var article=document.createElement("article");article.appendChild(link),article.appendChild(p),oldNotes.append(article)}})}function newNote(){notes=document.querySelector("#notes"),notes.text="",notes.value="",references={},saved=!0,textDirty=!1,document.querySelector("#note-header-left h2").classList.remove("dirty"),dt=new Date,document.querySelector("#noteDate").value=dt.getFullYear()+"-"+(dt.getMonth()<9?"0"+(dt.getMonth()+1):dt.getMonth()+1)+"-"+(dt.getDate()<10?"0"+dt.getDate():dt.getDate()),document.querySelector("#noteTitle").value="",document.querySelector("#speaker").value=0,document.querySelector("#series").value=0,document.querySelector("#template").value=0,document.querySelector("#passage").value="",document.querySelector("#recording").value="",document.querySelector("#noteId").value="",document.querySelector("#ref-list").innerHTML="",document.querySelector("#ref").innerHTML="",document.querySelector(".toggle").click()}function saveNote(event){if(event&&event.preventDefault(),!textDirty||!validateNote())return clearTimeout(to),void(to=setTimeout(saveNote,saveTimeout));let saveCheck=document.querySelector("#save-check");var noteText=document.querySelector("#notes").value;startSave();var note={id:document.querySelector("#noteId").value,date:document.querySelector("#noteDate").value,title:document.querySelector("#noteTitle").value,speaker:document.querySelector("#speaker").value,series:document.querySelector("#series").value,passage:document.querySelector("#passage").value,note:document.querySelector("#notes").value,recording:document.querySelector("#recording").value,refs:references};$.ajax({url:"/index.php/save-note",method:"POST",contentType:"application/json",data:JSON.stringify(note),dataType:"json",timeout:5e3}).done(function(data){"saved"!=data.msg||saved||(saveCheck.classList.remove("saving","error","fa-times","fa-check"),showSave(),noteText==document.querySelector("#notes").value&&(saved=!0,textDirty=!1,document.querySelector("#note-header-left h2").classList.remove("dirty")),data.new&&(document.querySelector("#noteId").value=data.id))}).fail(function(xhr,status,error){saveFailCounter++,saveCheck.classList.remove("saving","fa-check"),saveCheck.classList.add("fa-times","error"),console.error(error)}).always(function(xhr,status){"timeout"==status&&(saveCheck.classList.remove("saving","fa-check"),saveCheck.classList.add("error","fa-times")),clearTimeout(to),saveFailCounter<5?to=setTimeout(saveNote,saveTimeout):saveFailCounter=0})}function validateNote(){const note=document.querySelector("#notes"),date=document.querySelector("#noteDate"),speaker=document.querySelector("#speaker"),series=document.querySelector("#series"),title=document.querySelector("#noteTitle"),psg=document.querySelector("#passage");return!!title.value.length&&(!!date.value&&(!!parseInt(speaker.value)&&(!!parseInt(series.value)&&(!!psg.value&&!!note.value.length))))}function isUuidValid(uuid){const regex=/^[a-f0-9]{8}-[a-f0-9]{4}-[a-f0-9]{4}-[8|9|a|b][a-f0-9]{3}-[a-f0-9]{12}$/i;returLine truncated