From 128be9204c0d5746054d1cce3b7d297c0c484e76 Mon Sep 17 00:00:00 2001
From: Jason Robinson <mail@jasonrobinson.me>
Date: Sun, 1 Jun 2014 14:25:34 +0300
Subject: [PATCH] Refactor UI hint on status message submit. Now we close the
 publisher on submit and reopen it on error. The spinner is shown while
 submission is in progress. Fixes #4949

---
 .../javascripts/app/views/publisher_view.js   | 37 ++++++++++++++-----
 .../stylesheets/publisher_blueprint.css.scss  | 15 +++++---
 .../publisher/_publisher_blueprint.html.haml  |  4 +-
 3 files changed, 39 insertions(+), 17 deletions(-)

diff --git a/app/assets/javascripts/app/views/publisher_view.js b/app/assets/javascripts/app/views/publisher_view.js
index da32dd286..06dcc6400 100644
--- a/app/assets/javascripts/app/views/publisher_view.js
+++ b/app/assets/javascripts/app/views/publisher_view.js
@@ -69,6 +69,18 @@ app.views.Publisher = Backbone.View.extend({
           _this.tryClose()
         }
     });
+    
+    // close publisher on post
+    this.on('publisher:add', function() {
+      this.close();
+      this.showSpinner(true);
+    });
+    
+    // open publisher on post error
+    this.on('publisher:error', function() {
+      this.open();
+      this.showSpinner(false);
+    });
 
     this.initSubviews();
     return this;
@@ -134,6 +146,7 @@ app.views.Publisher = Backbone.View.extend({
   },
 
   createStatusMessage : function(evt) {
+    this.setButtonsEnabled(false);
     var self = this;
 
     if(evt){ evt.preventDefault(); }
@@ -144,8 +157,6 @@ app.views.Publisher = Backbone.View.extend({
     var serializedForm = $(evt.target).closest("form").serializeObject();
     // disable input while posting, must be after the form is serialized
     this.setInputEnabled(false);
-    this.setButtonsEnabled(false);
-    this.$('#publisher_spinner').removeClass('hidden');
 
     // lulz this code should be killed.
     var statusMessage = new app.models.Post();
@@ -180,10 +191,11 @@ app.views.Publisher = Backbone.View.extend({
       },
       error: function() {
         if( app.publisher ) app.publisher.trigger('publisher:error');
-        self.setInputEnabled(true);
         self.setButtonsEnabled(true);
-        self.$('#publisher_spinner').addClass('hidden');
+        self.setInputEnabled(true);
         Diaspora.page.flashMessages.render({ 'success':false, 'notice':Diaspora.I18n.t('failed_to_post_message') });
+        self.setButtonsEnabled(true);
+        self.setInputEnabled(true);
       }
     });
   },
@@ -349,14 +361,14 @@ app.views.Publisher = Backbone.View.extend({
     // disable submitting
     this.checkSubmitAvailability();
 
+    // hide spinner
+    this.showSpinner(false);
+
     // enable input
     this.setInputEnabled(true);
     
     // enable buttons
-    this.setButtonsEnabled(false);
-    
-    // hide spinner
-    this.$('#publisher_spinner').addClass('hidden');
+    this.setButtonsEnabled(true);
 
     // clear location
     this.destroyLocation();
@@ -397,7 +409,14 @@ app.views.Publisher = Backbone.View.extend({
     this.view_poll_creator.$el.removeClass('active');
     return this;
   },
-
+  
+  showSpinner: function(bool) {
+    if (bool)
+      this.$('#publisher_spinner').removeClass('hidden');
+    else
+      this.$('#publisher_spinner').addClass('hidden');
+  },
+  
   checkSubmitAvailability: function() {
     if( this._submittable() ) {
       this.setButtonsEnabled(true);
diff --git a/app/assets/stylesheets/publisher_blueprint.css.scss b/app/assets/stylesheets/publisher_blueprint.css.scss
index 15a51daf7..9c81db04c 100644
--- a/app/assets/stylesheets/publisher_blueprint.css.scss
+++ b/app/assets/stylesheets/publisher_blueprint.css.scss
@@ -42,6 +42,15 @@
     width: 483px;
   }
 
+  #publisher_spinner {
+    clear: both;
+    margin-bottom: -2px;
+    min-height: 21px;
+    padding-top: 6px;
+    position: relative;
+    text-align: center;
+  }
+
   .options_and_submit {
     min-height: 21px;
     clear: both;
@@ -70,12 +79,6 @@
       }
     }
 
-    #publisher_spinner {
-      position: relative;
-      top: 3px;
-      margin-right: 10px;
-    }
-
     #publisher_service_icons {
       position: relative;
       top: 3px;
diff --git a/app/views/publisher/_publisher_blueprint.html.haml b/app/views/publisher/_publisher_blueprint.html.haml
index bbfe3c9d7..a97beb2e7 100644
--- a/app/views/publisher/_publisher_blueprint.html.haml
+++ b/app/views/publisher/_publisher_blueprint.html.haml
@@ -47,10 +47,10 @@
         - for aspect_id in aspect_ids
           = hidden_field_tag 'aspect_ids[]', aspect_id.to_s
 
+      #publisher_spinner{:class => 'hidden'}
+        = image_tag 'ajax-loader.gif'
       .options_and_submit
         .public_toggle
-          %span#publisher_spinner{:class => 'hidden'}
-            = image_tag 'ajax-loader.gif'
           %span#publisher_service_icons
             - if current_user.services
               - for service in current_user.services