Merge branch 'dropzone-upload-progress' into 'master'

Add dropzone upload progress

This MR adds upload progress in percents to dropzone.

![progress](https://gitlab.com/vernik91/gitlab-ce/uploads/9be251e4f3a99bc1d65435b1f001d021/progress.png)

I thought, it can be nice small enhancement :)

See merge request !1125

Gemfile.lock

@@ -154,7 +154,7 @@ GEM
     doorkeeper (2.1.3)
       railties (>= 3.2)
     dotenv (0.9.0)
-    dropzonejs-rails (0.4.14)
+    dropzonejs-rails (0.7.1)
       rails (> 3.1)
     email_spec (1.6.0)
       launchy (~> 2.1)
@@ -373,7 +373,7 @@ GEM
     mini_portile (0.6.2)
     minitest (5.3.5)
     mousetrap-rails (1.4.6)
-    multi_json (1.11.1)
+    multi_json (1.11.2)
     multi_xml (0.5.5)
     multipart-post (1.2.0)
     mysql2 (0.3.16)

app/assets/javascripts/dropzone_input.js.coffee

@@ -8,6 +8,7 @@ class @DropzoneInput
     divAlert = "<div class=\"" + alertClass + "\"></div>"
     iconPaperclip = "<i class=\"fa fa-paperclip div-dropzone-icon\"></i>"
     iconSpinner = "<i class=\"fa fa-spinner fa-spin div-dropzone-icon\"></i>"
+    uploadProgress = $("<div class=\"div-dropzone-progress\"></div>")
     btnAlert = "<button type=\"button\"" + alertAttr + ">&times;</button>"
     project_uploads_path = window.project_uploads_path or null
     markdown_preview_path = window.markdown_preview_path or null
@@ -28,6 +29,7 @@ class @DropzoneInput
     form_dropzone.find(".div-dropzone-hover").append iconPaperclip
     form_dropzone.append divSpinner
     form_dropzone.find(".div-dropzone-spinner").append iconSpinner
+    form_dropzone.find(".div-dropzone-spinner").append uploadProgress
     form_dropzone.find(".div-dropzone-spinner").css
       "opacity": 0
       "display": "none"
@@ -112,13 +114,18 @@ class @DropzoneInput
           $(".div-dropzone-alert").append btnAlert + errorMessage
         return
 
+      totaluploadprogress: (totalUploadProgress) ->
+        uploadProgress.text Math.round(totalUploadProgress) + "%"
+        return
+
       sending: ->
         form_dropzone.find(".div-dropzone-spinner").css
           "opacity": 0.7
           "display": "inherit"
         return
 
-      complete: ->
+      queuecomplete: ->
+        uploadProgress.text ""
         $(".dz-preview").remove()
         $(".markdown-area").trigger "input"
         $(".div-dropzone-spinner").css

app/assets/stylesheets/generic/markdown_area.scss

@@ -40,6 +40,15 @@
       font-size: inherit;
     }
 
+    .div-dropzone-progress {
+      position: absolute;
+      top: 7px;
+      left: -40px;
+      width: 35px;
+      font-size: 13px;
+      text-align: right;
+    }
+
     .dz-preview {
       display: none;
     }