From bcc4f22cf52ed39317c01c128670d111548a5fe7 Mon Sep 17 00:00:00 2001
From: azivner <adam.zivner@gmail.com>
Date: Wed, 16 Aug 2017 20:41:41 -0400
Subject: [PATCH] better autosave - only once per 5 seconds with guaranteed
 save when changing notes

---
 static/js/note.js  | 22 ++++++++++++++++++++++
 static/js/tree.js  |  2 +-
 static/js/utils.js |  4 ++--
 static/style.css   |  4 ++--
 4 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/static/js/note.js b/static/js/note.js
index b3012ebbd..7bd80e855 100644
--- a/static/js/note.js
+++ b/static/js/note.js
@@ -11,11 +11,25 @@ let tags = {
 
 let noteChangeDisabled = false;
 
+let isNoteChanged = false;
+
 function noteChanged() {
     if (noteChangeDisabled) {
         return;
     }
 
+    isNoteChanged = true;
+}
+
+function saveNoteIfChanged(callback) {
+    if (!isNoteChanged) {
+        if (callback) {
+            callback();
+        }
+
+        return;
+    }
+
     let note = globalNote;
 
     let contents = $('#noteDetail').summernote('code');
@@ -36,7 +50,13 @@ function noteChanged() {
         data: JSON.stringify(note),
         contentType: "application/json",
         success: function(result) {
+            isNoteChanged = false;
+
             message("Saved!");
+
+            if (callback) {
+                callback();
+            }
         },
         error: function(result) {
             error("Error saving the note!");
@@ -44,6 +64,8 @@ function noteChanged() {
     });
 }
 
+setInterval(saveNoteIfChanged, 5000);
+
 $(document).ready(function() {
     $("#noteTitle").on('input', function() {
         noteChanged();
diff --git a/static/js/tree.js b/static/js/tree.js
index 2968164ca..5459a4d52 100644
--- a/static/js/tree.js
+++ b/static/js/tree.js
@@ -39,7 +39,7 @@ $(function(){
                 const node = data.node.data;
                 const noteId = node.is_clone ? node.note_clone_id : node.note_id;
 
-                loadNote(noteId);
+                saveNoteIfChanged(() => loadNote(noteId));
             },
             expand: function(event, data) {
                 setExpanded(data.node.key, true);
diff --git a/static/js/utils.js b/static/js/utils.js
index 071437c85..d9108d2be 100644
--- a/static/js/utils.js
+++ b/static/js/utils.js
@@ -1,7 +1,7 @@
 function message(str) {
-    $("#top-message").show();
+    $("#top-message").fadeIn(1500);
     $("#top-message").html(str);
-    $("#top-message").fadeOut(3000);
+    $("#top-message").fadeOut(1500);
 }
 
 function error(str) {
diff --git a/static/style.css b/static/style.css
index ecd10eb10..e5a9baf10 100644
--- a/static/style.css
+++ b/static/style.css
@@ -6,8 +6,8 @@
 
 #top-message {
     display: none; /* initial state is hidden */
-    background-color: greenyellow;
-    color: green;
+    background-color: #e0e0e0;
+    color: #333;
     padding: 5px;
     border-radius: 10px;
 }