projects/booket

changeset 18:3642bb668af1

Indicate if there are unsaved changes
author Guido Berhoerster <guido+booket@berhoerster.name>
date Tue Sep 30 21:32:39 2014 +0200 (2014-09-30)
parents 8445c729ba97
children 4a4d9527c06f
files booket.css booket.html booket.js
line diff
     1.1 --- a/booket.css	Mon Sep 29 22:39:17 2014 +0200
     1.2 +++ b/booket.css	Tue Sep 30 21:32:39 2014 +0200
     1.3 @@ -146,6 +146,16 @@
     1.4      font-size: .75em;
     1.5  }
     1.6  
     1.7 +#save-form .unsaved-changes-message {
     1.8 +    margin: 0;
     1.9 +    font-size: .75em;
    1.10 +}
    1.11 +
    1.12 +.unsaved-changes-message strong {
    1.13 +    font-weight: bold;
    1.14 +    color: #a40000;
    1.15 +}
    1.16 +
    1.17  form.bookmark-editor-form img.bookmark-favicon {
    1.18      display: block;
    1.19      padding: 1px 0;
     2.1 --- a/booket.html	Mon Sep 29 22:39:17 2014 +0200
     2.2 +++ b/booket.html	Tue Sep 30 21:32:39 2014 +0200
     2.3 @@ -110,6 +110,8 @@
     2.4      <form id="save-form">
     2.5        <fieldset>
     2.6          <legend>Save Bookmarks</legend>
     2.7 +        <p class="unsaved-changes-message" hidden="hidden"><strong>There are
     2.8 +        unsaved changes to your bookmarks.</strong></p>
     2.9          <a href="#" id="save-link" hidden="hidden"
    2.10          download="bookmarks.json"></a>
    2.11          <button type="submit" name="save-file"
     3.1 --- a/booket.js	Mon Sep 29 22:39:17 2014 +0200
     3.2 +++ b/booket.js	Tue Sep 30 21:32:39 2014 +0200
     3.3 @@ -453,7 +453,7 @@
     3.4  var BookmarkModel = function () {
     3.5      ObservableMixin.call(this);
     3.6  
     3.7 -    this.unsavedChanges = false;
     3.8 +    this._unsavedChanges = false;
     3.9      this.loadFileReader = null;
    3.10      this.importFileReader= null;
    3.11      this._bookmarks = new StringMap();
    3.12 @@ -466,6 +466,18 @@
    3.13  
    3.14  extend(BookmarkModel, ObservableMixin);
    3.15  
    3.16 +Object.defineProperty(BookmarkModel.prototype, 'unsavedChanges', {
    3.17 +    set: function (value) {
    3.18 +        if (this._unsavedChanges !== value) {
    3.19 +            this._unsavedChanges = value;
    3.20 +            this.notify('unsaved-changes-changed', value)
    3.21 +        }
    3.22 +    },
    3.23 +    get: function () {
    3.24 +        return this._unsavedChanges;
    3.25 +    }
    3.26 +});
    3.27 +
    3.28  BookmarkModel.prototype.add = function (bookmarks) {
    3.29      var addedBookmarkUrls = new StringSet();
    3.30  
    3.31 @@ -1051,6 +1063,9 @@
    3.32      saveFormElement = document.querySelector('form#save-form');
    3.33      saveFormElement.addEventListener('submit', this);
    3.34  
    3.35 +    this.unsavedChangesElement =
    3.36 +        saveFormElement.querySelector('.unsaved-changes-message');
    3.37 +
    3.38      this.saveLinkElement = saveFormElement.querySelector('a#save-link');
    3.39  
    3.40      loadFormElement = document.querySelector('form#load-form');
    3.41 @@ -1243,6 +1258,10 @@
    3.42      window.alert('Failed to parse bookmark file:\n' + message);
    3.43  };
    3.44  
    3.45 +ActionsView.prototype.onUnsavedChangesChanged = function (unsavedChanges) {
    3.46 +    this.unsavedChangesElement.hidden = !unsavedChanges;
    3.47 +};
    3.48 +
    3.49  
    3.50  var BookmarkView = function () {
    3.51      var searchFormElement;
    3.52 @@ -1623,6 +1642,8 @@
    3.53          this.actionsView.onSaveFile.bind(this.actionsView));
    3.54      this.bookmarkModel.addObserver('export-file',
    3.55          this.actionsView.onExportFile.bind(this.actionsView));
    3.56 +    this.bookmarkModel.addObserver('unsaved-changes-changed',
    3.57 +        this.actionsView.onUnsavedChangesChanged.bind(this.actionsView));
    3.58      this.bookmarkModel.addObserver('tag-added',
    3.59          this.tagView.onTagAdded.bind(this.tagView));
    3.60      this.bookmarkModel.addObserver('tag-count-changed',