From b0e4c5d66caf4388f830faf4fadc53b03b31cc48 Mon Sep 17 00:00:00 2001
From: Alessandro Cuoghi <agileontheweb@gmail.com>
Date: Fri, 25 Aug 2017 18:50:02 +0200
Subject: [PATCH] Hide progress bar for remove white space on init form. Added
 display block via js to show progrss bar. Added some margin.

---
 app/assets/javascripts/documentable.js.coffee |  2 ++
 app/assets/stylesheets/documentable.scss      | 18 +++++++++++++++++-
 app/views/documents/_nested_fields.html.erb   |  4 +---
 app/views/documents/_plain_fields.html.erb    |  4 ++--
 4 files changed, 22 insertions(+), 6 deletions(-)

diff --git a/app/assets/javascripts/documentable.js.coffee b/app/assets/javascripts/documentable.js.coffee
index f86d68433..8683ce5e2 100644
--- a/app/assets/javascripts/documentable.js.coffee
+++ b/app/assets/javascripts/documentable.js.coffee
@@ -18,6 +18,7 @@ App.Documentable =
         is_nested_document = $(e.target).data('nested-document')
         $(wrapper).find('.progress-bar-placeholder').empty()
         data.progressBar = $(wrapper).find('.progress-bar-placeholder').html('<div class="progress-bar"><div class="loading-bar uploading"></div></div>')
+        $(wrapper).find('.progress-bar-placeholder').css('display','block')
         data.formData = {
           "document[title]": $(wrapper).find('input.document-title').val() || data.files[0].name
           "index": index,
@@ -66,6 +67,7 @@ App.Documentable =
       $('#' + id).find('.loading-bar').addClass 'complete'
     else
       $('#' + id).find('.loading-bar').addClass 'errors'
+    $('#' + id).find('.progress-bar-placeholder').css('display','block')
 
   new: (nested_fields) ->
     $(".documents-list").append(nested_fields)
diff --git a/app/assets/stylesheets/documentable.scss b/app/assets/stylesheets/documentable.scss
index 0f009ecc1..2aa015a14 100644
--- a/app/assets/stylesheets/documentable.scss
+++ b/app/assets/stylesheets/documentable.scss
@@ -1,3 +1,19 @@
+.progress-bar-placeholder {
+  display: none;
+}
+
+.document-form {
+  .document .file-name {
+    margin-top: 0;
+  }
+  .progress-bar-placeholder {
+    margin-bottom: 15px;
+  }
+  .document .loading-bar.errors {
+    margin-top: $line-height * 2;
+  }
+}
+
 .document {
   .button {
     font-weight: normal;
@@ -28,12 +44,12 @@
     &.complete {
       background-color: $success-color;
       width: 100%;
-      margin-top: $line-height * 2;
     }
 
     &.errors {
       background-color: $alert-color;
       width: 100%;
+      margin-top: $line-height / 2;
     }
   }
 
diff --git a/app/views/documents/_nested_fields.html.erb b/app/views/documents/_nested_fields.html.erb
index e9332534b..164a85982 100644
--- a/app/views/documents/_nested_fields.html.erb
+++ b/app/views/documents/_nested_fields.html.erb
@@ -25,9 +25,7 @@
   <%= render_attachment(document, index) %>
 
   <%= render_destroy_document_link(document, index) %>
-
-  <div class="progress-bar-placeholder"><div class="loading-bar"></div></div>
   <p class="file-name"><%= document_attachment_file_name(document) %></p>
-
+  <div class="progress-bar-placeholder"><div class="loading-bar"></div></div>
   <hr>
 </div>
diff --git a/app/views/documents/_plain_fields.html.erb b/app/views/documents/_plain_fields.html.erb
index 510fffce9..e45a5c238 100644
--- a/app/views/documents/_plain_fields.html.erb
+++ b/app/views/documents/_plain_fields.html.erb
@@ -43,8 +43,8 @@
         </div>
       </div>
     <% end %>
-    <div class="progress-bar-placeholder"><div class="loading-bar"></div></div>
     <p class="file-name"><%= document_attachment_file_name(document) %></p>
+    <div class="progress-bar-placeholder"><div class="loading-bar"></div></div>
   </div>
 
-</div>
\ No newline at end of file
+</div>