Commit 77f37fa9 authored by Stan Hu's avatar Stan Hu

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
parents fb6f8d91 17bab502
...@@ -154,7 +154,7 @@ GEM ...@@ -154,7 +154,7 @@ GEM
doorkeeper (2.1.3) doorkeeper (2.1.3)
railties (>= 3.2) railties (>= 3.2)
dotenv (0.9.0) dotenv (0.9.0)
dropzonejs-rails (0.4.14) dropzonejs-rails (0.7.1)
rails (> 3.1) rails (> 3.1)
email_spec (1.6.0) email_spec (1.6.0)
launchy (~> 2.1) launchy (~> 2.1)
...@@ -373,7 +373,7 @@ GEM ...@@ -373,7 +373,7 @@ GEM
mini_portile (0.6.2) mini_portile (0.6.2)
minitest (5.3.5) minitest (5.3.5)
mousetrap-rails (1.4.6) mousetrap-rails (1.4.6)
multi_json (1.11.1) multi_json (1.11.2)
multi_xml (0.5.5) multi_xml (0.5.5)
multipart-post (1.2.0) multipart-post (1.2.0)
mysql2 (0.3.16) mysql2 (0.3.16)
......
...@@ -8,6 +8,7 @@ class @DropzoneInput ...@@ -8,6 +8,7 @@ class @DropzoneInput
divAlert = "<div class=\"" + alertClass + "\"></div>" divAlert = "<div class=\"" + alertClass + "\"></div>"
iconPaperclip = "<i class=\"fa fa-paperclip div-dropzone-icon\"></i>" iconPaperclip = "<i class=\"fa fa-paperclip div-dropzone-icon\"></i>"
iconSpinner = "<i class=\"fa fa-spinner fa-spin 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>" btnAlert = "<button type=\"button\"" + alertAttr + ">&times;</button>"
project_uploads_path = window.project_uploads_path or null project_uploads_path = window.project_uploads_path or null
markdown_preview_path = window.markdown_preview_path or null markdown_preview_path = window.markdown_preview_path or null
...@@ -28,6 +29,7 @@ class @DropzoneInput ...@@ -28,6 +29,7 @@ class @DropzoneInput
form_dropzone.find(".div-dropzone-hover").append iconPaperclip form_dropzone.find(".div-dropzone-hover").append iconPaperclip
form_dropzone.append divSpinner form_dropzone.append divSpinner
form_dropzone.find(".div-dropzone-spinner").append iconSpinner form_dropzone.find(".div-dropzone-spinner").append iconSpinner
form_dropzone.find(".div-dropzone-spinner").append uploadProgress
form_dropzone.find(".div-dropzone-spinner").css form_dropzone.find(".div-dropzone-spinner").css
"opacity": 0 "opacity": 0
"display": "none" "display": "none"
...@@ -112,13 +114,18 @@ class @DropzoneInput ...@@ -112,13 +114,18 @@ class @DropzoneInput
$(".div-dropzone-alert").append btnAlert + errorMessage $(".div-dropzone-alert").append btnAlert + errorMessage
return return
totaluploadprogress: (totalUploadProgress) ->
uploadProgress.text Math.round(totalUploadProgress) + "%"
return
sending: -> sending: ->
form_dropzone.find(".div-dropzone-spinner").css form_dropzone.find(".div-dropzone-spinner").css
"opacity": 0.7 "opacity": 0.7
"display": "inherit" "display": "inherit"
return return
complete: -> queuecomplete: ->
uploadProgress.text ""
$(".dz-preview").remove() $(".dz-preview").remove()
$(".markdown-area").trigger "input" $(".markdown-area").trigger "input"
$(".div-dropzone-spinner").css $(".div-dropzone-spinner").css
......
...@@ -40,6 +40,15 @@ ...@@ -40,6 +40,15 @@
font-size: inherit; font-size: inherit;
} }
.div-dropzone-progress {
position: absolute;
top: 7px;
left: -40px;
width: 35px;
font-size: 13px;
text-align: right;
}
.dz-preview { .dz-preview {
display: none; display: none;
} }
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment