changeset 18:3642bb668af1

Indicate if there are unsaved changes
author Guido Berhoerster <guido+booket@berhoerster.name>
date Tue, 30 Sep 2014 21:32:39 +0200
parents 8445c729ba97
children 4a4d9527c06f
files booket.css booket.html booket.js
diffstat 3 files changed, 34 insertions(+), 1 deletions(-) [+]
line wrap: on
line diff
--- a/booket.css	Mon Sep 29 22:39:17 2014 +0200
+++ b/booket.css	Tue Sep 30 21:32:39 2014 +0200
@@ -146,6 +146,16 @@
     font-size: .75em;
 }
 
+#save-form .unsaved-changes-message {
+    margin: 0;
+    font-size: .75em;
+}
+
+.unsaved-changes-message strong {
+    font-weight: bold;
+    color: #a40000;
+}
+
 form.bookmark-editor-form img.bookmark-favicon {
     display: block;
     padding: 1px 0;
--- a/booket.html	Mon Sep 29 22:39:17 2014 +0200
+++ b/booket.html	Tue Sep 30 21:32:39 2014 +0200
@@ -110,6 +110,8 @@
     <form id="save-form">
       <fieldset>
         <legend>Save Bookmarks</legend>
+        <p class="unsaved-changes-message" hidden="hidden"><strong>There are
+        unsaved changes to your bookmarks.</strong></p>
         <a href="#" id="save-link" hidden="hidden"
         download="bookmarks.json"></a>
         <button type="submit" name="save-file"
--- a/booket.js	Mon Sep 29 22:39:17 2014 +0200
+++ b/booket.js	Tue Sep 30 21:32:39 2014 +0200
@@ -453,7 +453,7 @@
 var BookmarkModel = function () {
     ObservableMixin.call(this);
 
-    this.unsavedChanges = false;
+    this._unsavedChanges = false;
     this.loadFileReader = null;
     this.importFileReader= null;
     this._bookmarks = new StringMap();
@@ -466,6 +466,18 @@
 
 extend(BookmarkModel, ObservableMixin);
 
+Object.defineProperty(BookmarkModel.prototype, 'unsavedChanges', {
+    set: function (value) {
+        if (this._unsavedChanges !== value) {
+            this._unsavedChanges = value;
+            this.notify('unsaved-changes-changed', value)
+        }
+    },
+    get: function () {
+        return this._unsavedChanges;
+    }
+});
+
 BookmarkModel.prototype.add = function (bookmarks) {
     var addedBookmarkUrls = new StringSet();
 
@@ -1051,6 +1063,9 @@
     saveFormElement = document.querySelector('form#save-form');
     saveFormElement.addEventListener('submit', this);
 
+    this.unsavedChangesElement =
+        saveFormElement.querySelector('.unsaved-changes-message');
+
     this.saveLinkElement = saveFormElement.querySelector('a#save-link');
 
     loadFormElement = document.querySelector('form#load-form');
@@ -1243,6 +1258,10 @@
     window.alert('Failed to parse bookmark file:\n' + message);
 };
 
+ActionsView.prototype.onUnsavedChangesChanged = function (unsavedChanges) {
+    this.unsavedChangesElement.hidden = !unsavedChanges;
+};
+
 
 var BookmarkView = function () {
     var searchFormElement;
@@ -1623,6 +1642,8 @@
         this.actionsView.onSaveFile.bind(this.actionsView));
     this.bookmarkModel.addObserver('export-file',
         this.actionsView.onExportFile.bind(this.actionsView));
+    this.bookmarkModel.addObserver('unsaved-changes-changed',
+        this.actionsView.onUnsavedChangesChanged.bind(this.actionsView));
     this.bookmarkModel.addObserver('tag-added',
         this.tagView.onTagAdded.bind(this.tagView));
     this.bookmarkModel.addObserver('tag-count-changed',