move save up into DocumentDetailView

use async rather than deferred, which is easier to understand

no need to track dirtyness on properties view, we can get that from the
model directly

Author: longhotsummer

indigo_app/static/javascript/indigo/models.js

@@ -261,9 +261,8 @@
       }
       this.document.attributes.content = content;
       this.document.attributes.provision_eid = Indigo.Preloads.provisionEid;
-      var result = this.document.save();
-      // XXX works around https://github.com/Code4SA/indigo/issues/20 by not parsing
-      // the response to the save() call
+      const result = this.document.save();
+      // don't re-parse the content in the response to the save() call
       delete this.document.attributes.content;
       this.document.setClean();
       this.trigger('sync');
@@ -511,12 +510,6 @@
       return url;
     },
 
-    setWork: function(work) {
-      this.set('frbr_uri', work.get('frbr_uri'));
-      this.work = work;
-      this.trigger('change change:work');
-    },
-
     /** Get the Tradition description for this document's country.
      */
     tradition: function() {

indigo_app/static/javascript/indigo/utils.js

@@ -45,4 +45,13 @@ $(function() {
     }
     return doc;
   };
+
+  /**
+   * This converts a jquery deferred into javascript promise/async function
+   */
+  Indigo.deferredToAsync = async function(deferred) {
+    await new Promise((resolve, reject) => {
+      deferred.then(resolve).fail(reject);
+    });
+  };
 });

indigo_app/static/javascript/indigo/views/document.js

@@ -155,6 +155,7 @@
       this.document.work = new Indigo.Work(Indigo.Preloads.work);
       this.document.issues = new Backbone.Collection();
 
+      this.document.on('sync', this.setClean, this);
       this.document.on('change', this.setDirty, this);
       this.document.on('change:draft', this.draftChanged, this);
 
@@ -164,8 +165,6 @@
       this.cheatsheetView = new Indigo.CheatsheetView();
       this.titleView = new Indigo.DocumentTitleView({model: this.document});
       this.propertiesView = new Indigo.DocumentPropertiesView({model: this.document});
-      this.propertiesView.on('dirty', this.setDirty, this);
-      this.propertiesView.on('clean', this.setClean, this);
 
       this.attachmentsView = new Indigo.DocumentAttachmentsView({document: this.document});
       this.attachmentsView.on('dirty', this.setDirty, this);
@@ -237,7 +236,7 @@
     },
 
     isDirty: function(e) {
-      return this.propertiesView.dirty || this.bodyEditorView.isDirty();
+      return this.dirty || this.bodyEditorView.isDirty();
     },
 
     setDirty: function() {
@@ -248,7 +247,7 @@
 
     setClean: function() {
       // disable the save button if all views are clean
-      if (!this.propertiesView.dirty && !this.bodyEditorView.dirty && !this.attachmentsView.dirty) {
+      if (!this.bodyEditorView.dirty && !this.attachmentsView.dirty) {
         this.dirty = false;
         this.$saveBtn
           .prop('disabled', true)
@@ -283,44 +282,31 @@
       }
     },
 
-    save: function() {
-      var self = this;
-      var deferred = null;
-
+    save: async function() {
       if (!this.bodyEditorView.canCancelEdits()) return;
 
-      // always save properties if we save content
-      this.propertiesView.dirty = this.propertiesView.dirty || this.bodyEditorView.dirty;
-
-      var fail = function() {
-        self.$saveBtn
-          .prop('disabled', false)
-          .find('.fa')
-            .removeClass('fa-pulse fa-spinner')
-            .addClass('fa-save');
-        self.$menu.find('.save').removeClass('disabled');
-      };
-
       this.$saveBtn
         .prop('disabled', true)
         .find('.fa')
           .removeClass('fa-save')
           .addClass('fa-pulse fa-spinner');
-      this.$menu.find('.save').addClass('disabled');
-
-      deferred = $.Deferred().resolve();
-
-      // We save the content first, and then save
-      // the properties on top of it, so that content
-      // properties that change metadata in the content
-      // take precendence.
-      deferred.then(function() {
-        self.bodyEditorView.save().then(function() {
-          self.propertiesView.save().then(function() {
-            self.attachmentsView.save().fail(fail);
-          }).fail(fail);
-        }).fail(fail);
-      }).fail(fail);
+
+      try {
+        // this saves the content and the document properties together
+        await Indigo.deferredToAsync(this.documentContent.save());
+        await Indigo.deferredToAsync(this.attachmentsView.save());
+
+        // TODO: a better way of reloading the page (will redirect to provision chooser for now)
+        if (this.bodyEditorView.sourceEditor.aknTextEditor.reloadOnSave) {
+          window.location.reload();
+        }
+      } catch {
+        this.$saveBtn
+          .prop('disabled', false)
+          .find('.fa')
+          .removeClass('fa-pulse fa-spinner')
+          .addClass('fa-save');
+      }
     },
 
     delete: function() {

indigo_app/static/javascript/indigo/views/document_editor.js

@@ -553,42 +553,5 @@
     canCancelEdits: function() {
       return this.sourceEditor.confirmAndDiscardChanges();
     },
-
-    // Save the content of the editor, returns a Deferred
-    save: function() {
-      var self = this,
-          deferred = $.Deferred();
-
-      function ok() { deferred.resolve(); }
-      function fail() { deferred.reject(); }
-
-      if (!this.dirty) {
-        // don't do anything if it hasn't changed
-        ok();
-
-      } else {
-          // ask the editor to returns its contents
-        this.sourceEditor
-          .saveChanges()
-          .done(function() {
-            // save the model
-            self.saveModel().done(ok).fail(fail);
-          })
-          .fail(fail);
-      }
-
-      // TODO: a better way of reloading the page (will redirect to provision chooser for now)
-      if (this.sourceEditor.aknTextEditor.reloadOnSave) {
-        window.location.reload();
-      }
-
-      return deferred;
-    },
-
-    // Save the content of the document, returns a Deferred
-    saveModel: function() {
-      return this.documentContent.save();
-    },
-
   });
 })(window);

indigo_app/static/javascript/indigo/views/document_properties.js

@@ -9,10 +9,6 @@
     return (!val || val.trim() === "") ? null : val;
   }
 
-  function bool(val) {
-    return val == "1";
-  }
-
   // Handle the document properties form, and saving them back to the server.
   Indigo.DocumentPropertiesView = Backbone.View.extend({
     el: '.document-properties-view',
@@ -30,13 +26,8 @@
         work: this.model,
       });
 
-      this.dirty = false;
-      this.listenTo(this.model, 'change', this.setDirty);
-      this.listenTo(this.model, 'sync', this.setClean);
       this.listenTo(this.model, 'change:draft change:frbr_uri change:language change:expression_date sync', this.showPublishedUrl);
-
       this.stickit();
-
       this.render();
     },
 
@@ -47,34 +38,6 @@
       this.$el.find('#document_published_url').attr('href', url).text(url);
     },
 
-    setDirty: function() {
-      if (!this.dirty) {
-        this.dirty = true;
-        this.trigger('dirty');
-      }
-    },
-
-    setClean: function() {
-      if (this.dirty) {
-        this.dirty = false;
-        this.trigger('clean');
-      }
-    },
-
-    save: function() {
-      var self = this;
-      // TODO: validation
-
-      // don't do anything if it hasn't changed
-      if (!this.dirty) {
-        return $.Deferred().resolve();
-      }
-
-      return this.model.save().done(function() {
-        self.setClean();
-      });
-    },
-
     render: function() {
       var work = this.model.work;