Jonathan/calibre-web
1
0
Fork 0
mirror of https://github.com/JonathanHerrewijnen/calibre-web.git synced 2024-11-11 05:33:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

Add progress bar to upload form

Browse Source
This commit is contained in:
Louis Jencka 2017-09-02 11:51:11 -06:00
parent 81219663fe
commit b3217496d1
2 changed files with 30 additions and 0 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

25
cps/static/js/main.js
View File

@ -164,6 +164,31 @@ $(function() {
$(this).find(".modal-body").html("...");
});
$("#form-upload").ajaxForm({
beforeSend: function() {
// Replace upload button with progress bar
$("#upload-bar").width($("#form-upload").width());
$("#form-upload").hide();
$("#upload-bar").show();
var percentVal = "0%";
$("#upload-bar-val").width(percentVal);
$("#upload-bar-val").html(percentVal);
},
uploadProgress: function(event, position, total, percentComplete) {
var percentVal = percentComplete + "%";
$("#upload-bar-val").width(percentVal);
$("#upload-bar-val").html(percentVal);
},
error: function() {
$("#upload-bar").hide();
$("#form-upload").show();
alert("Upload failed.");
},
type: "post",
target: "html"
});
$(window).resize(function() {
$(".discover .row").isotope("reLayout");
});

5
cps/templates/layout.html
View File

@ -56,6 +56,11 @@
{% if g.user.role_upload() or g.user.role_admin()%}
{% if g.allow_upload %}
<li>
<div id="upload-bar" class="navbar-text progress" style="display: none;">
<div id="upload-bar-val" class="progress-bar">
0%
</div>
</div>
<form id="form-upload" class="navbar-form" action="{{ url_for('upload') }}" method="post" enctype="multipart/form-data">
<div class="form-group">
<span class="btn btn-default btn-file">{{_('Upload')}} <input id="btn-upload" name="btn-upload" type="file"></span>