mirror of
https://github.com/haiwen/seahub.git
synced 2025-09-25 06:33:48 +00:00
[upload/update] fixed bug, modified bar style and improved code
This commit is contained in:
@@ -1337,22 +1337,17 @@ textarea:-moz-placeholder {/* for FF */
|
||||
#upload-file-form .MultiFile-remove:hover {
|
||||
text-decoration:none;
|
||||
}
|
||||
#upload-progress {
|
||||
.upload-progress-con,
|
||||
.upload-cancel {
|
||||
margin-top:.8em;
|
||||
}
|
||||
#task-progress-bar {/*for progress container*/
|
||||
width:95%;
|
||||
.upload-progress-bar {/*for progress container*/
|
||||
height:1em;
|
||||
}
|
||||
#task-progress-bar .ui-progressbar-value {/*for progress*/
|
||||
background:#e83;
|
||||
margin:0;
|
||||
}
|
||||
#task-progress-bar {
|
||||
margin-top:-3px;
|
||||
}
|
||||
#upload-cancel {
|
||||
margin-top:.8em;
|
||||
.upload-progress-bar .ui-progressbar-value {/*for progress*/
|
||||
background:#e83;
|
||||
margin:0;
|
||||
}
|
||||
|
||||
/* file view online, file edit */
|
||||
|
@@ -3,25 +3,23 @@
|
||||
{% block extra_script %}
|
||||
<script type="text/javascript">
|
||||
// Update progress bar
|
||||
function update_progress_info() {
|
||||
var dialog_id = '{{ dialog_id }}';
|
||||
function updateProgress() {
|
||||
$.ajax({
|
||||
url: '{{ httpserver_root }}/upload_progress/?X-Progress-ID=' + '{{ uuid }}' + '&callback=?',
|
||||
dataType: 'jsonp',
|
||||
cache: false,
|
||||
success: function(data) {
|
||||
if (data) {
|
||||
$(dialog_id + ' #upload-progress-text', window.parent.document).html(filesizeformat(data.uploaded, 2) + ' / ' + filesizeformat(data.length, 2));
|
||||
$(dialog_id + ' #task-progress-bar', window.parent.document).removeClass('hide').progressbar({
|
||||
$('#{{ upload_progress_con_id }} .upload-progress-text', window.parent.document).html(filesizeformat(data.uploaded, 2) + ' / ' + filesizeformat(data.length, 2));
|
||||
$('#{{ upload_progress_con_id }} .upload-progress-bar', window.parent.document).progressbar({
|
||||
value: data.uploaded / data.length * 100
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
setTimeout(update_progress_info, 1000);
|
||||
setTimeout(updateProgress, 1000);
|
||||
};
|
||||
update_progress_info();
|
||||
|
||||
updateProgress();
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
||||
|
@@ -179,12 +179,12 @@
|
||||
<p class="error">{{ error_msg }}</p>
|
||||
<input type="submit" value="{% trans "Upload" %}" class="submit" />
|
||||
</form>
|
||||
<div id="upload-progress" class="hide">
|
||||
<p>{% trans "Uploaded:" %} <span id="upload-progress-text">{% trans "Fetching ..." %}</span></p>
|
||||
<div id="task-progress-bar" class="hide"></div>
|
||||
<button id="upload-cancel">{% trans "Cancel" %}</button>
|
||||
<div id="upload-progress-con" class="upload-progress-con hide">
|
||||
<p>{% trans "Uploaded:" %} <span class="upload-progress-text">{% trans "Fetching ..." %}</span></p>
|
||||
<div class="upload-progress-bar"></div>
|
||||
<button class="upload-cancel">{% trans "Cancel" %}</button>
|
||||
<iframe class="hide"><!--for chrome--></iframe>
|
||||
</div>
|
||||
<iframe id="request-progress" class="hide"><!--for chrome--></iframe>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
@@ -192,22 +192,22 @@
|
||||
<div id="update-file-dialog" class="hide">
|
||||
<h3>Update File</h3>
|
||||
{% if no_quota %}
|
||||
<p class="error">{% trans "The owner of this library has ran out of space. Update failed." %}</p>
|
||||
<p class="error">{% trans "The owner of this library has ran out of space." %}</p>
|
||||
{% else %}
|
||||
<form id="update-file-form" enctype="multipart/form-data" method="post" action="{{ update_url }}?head={{ head_id }}">
|
||||
<input type="hidden" name="target_file" />
|
||||
<input type="file" name="file" id="id_update_file" />
|
||||
<input type="file" name="file" id="file-update-input" />
|
||||
<p>({% trans "Smaller than" %} {{ max_upload_file_size|filesizeformat }})</p>
|
||||
<p class="error">{{ error_msg }}</p>
|
||||
<input type="submit" value="{% trans "Update" %}" class="submit" />
|
||||
</form>
|
||||
|
||||
<div id="upload-progress" class="hide">
|
||||
<p>{% trans "Uploaded:" %} <span id="upload-progress-text">{% trans "Fetching..." %}</span></p>
|
||||
<div id="task-progress-bar" class="hide"></div>
|
||||
<button id="upload-cancel">{% trans "Cancel" %}</button>
|
||||
<div id="update-progress-con" class="upload-progress-con hide">
|
||||
<p>{% trans "Uploaded:" %} <span class="upload-progress-text">{% trans "Fetching..." %}</span></p>
|
||||
<div class="upload-progress-bar"></div>
|
||||
<button class="upload-cancel">{% trans "Cancel" %}</button>
|
||||
<iframe class="hide"><!--for chrome--></iframe>
|
||||
</div>
|
||||
<iframe id="request-progress" class="hide"><!--for chrome--></iframe>
|
||||
{% endif %}
|
||||
</div>
|
||||
|
||||
@@ -616,8 +616,8 @@ $('#upload-file').click(function () {
|
||||
}
|
||||
}); // init MultiFile
|
||||
$('#simplemodal-container').css({'height':'auto', 'width':'auto'});
|
||||
$('#upload-file-form .files-add').css({'width':$('#upload-file-form .files-add').width()});
|
||||
$('#upload-file-form .files-add input').css({'right':$('#upload-add-tip').width()});
|
||||
$('#upload-file-form .files-add').css({'width':$('#upload-file-form .files-add').width() + 1}); // '+ 1' for ie
|
||||
$('#file-upload-input').css({'right':$('#upload-add-tip').width()});
|
||||
});
|
||||
|
||||
$('a.update-file').click(function() {
|
||||
|
@@ -9,38 +9,38 @@ function gen_uuid() {
|
||||
return uuid;
|
||||
}
|
||||
|
||||
function submit_and_real_time_show (dialog_id) {
|
||||
var form = $(dialog_id + ' form')[0],
|
||||
uuid = gen_uuid(); // id for this upload so we can fetch progress info.
|
||||
$(dialog_id + ' #upload-progress').removeClass('hide');
|
||||
function submitAndShowProgress(form, upload_progress_con) {
|
||||
var uuid = gen_uuid(); // id for this upload so we can fetch progress info.
|
||||
upload_progress_con.removeClass('hide');
|
||||
|
||||
// Append X-Progress-ID uuid form action
|
||||
form.action += (form.action.indexOf('?') == -1 ? '?' : '&') + 'X-Progress-ID=' + uuid;
|
||||
var form_action = form.attr('action');
|
||||
form.attr('action', form_action += (form_action.indexOf('?') == -1 ? '?' : '&') + 'X-Progress-ID=' + uuid);
|
||||
form.submit();
|
||||
$(dialog_id + ' form .submit').addClass('hide');
|
||||
form.find('.submit').addClass('hide');
|
||||
|
||||
// Update progress bar: not work in chrome.
|
||||
function update_progress_info() {
|
||||
// Update progress: not work in chrome.
|
||||
function updateProgress() {
|
||||
$.ajax({
|
||||
url: '{{ httpserver_root }}/upload_progress/?X-Progress-ID=' + uuid + '&callback=?',
|
||||
dataType: 'jsonp',
|
||||
cache: false,
|
||||
success: function(data) {
|
||||
if (data) {
|
||||
$(dialog_id + ' #upload-progress-text').html(filesizeformat(data.uploaded, 2) + ' / ' + filesizeformat(data.length, 2));
|
||||
$(dialog_id + ' #task-progress-bar').removeClass('hide').progressbar({
|
||||
upload_progress_con.find('.upload-progress-text').html(filesizeformat(data.uploaded, 2) + ' / ' + filesizeformat(data.length, 2));
|
||||
upload_progress_con.children('.upload-progress-bar').progressbar({
|
||||
value: data.uploaded / data.length * 100
|
||||
});
|
||||
}
|
||||
}
|
||||
});
|
||||
setTimeout(update_progress_info, 1000);
|
||||
setTimeout(updateProgress, 1000);
|
||||
};
|
||||
update_progress_info();
|
||||
updateProgress();
|
||||
|
||||
// Update progress bar: for chrome
|
||||
if ($.browser.safari) {
|
||||
$(dialog_id + ' iframe').attr('src', '{{ SITE_ROOT }}file_upload_progress_page/?uuid=' + uuid + '&dlg_id=' + dialog_id.substr(1));
|
||||
upload_progress_con.children('iframe').attr('src', '{{ SITE_ROOT }}file_upload_progress_page/?uuid=' + uuid + '&upload_progress_con_id=' + upload_progress_con.attr('id'));
|
||||
}
|
||||
|
||||
return false;
|
||||
@@ -52,46 +52,37 @@ $('#upload-file-form .submit').click(function () {
|
||||
return false;
|
||||
}
|
||||
|
||||
if (this.files) {
|
||||
var total = 0;
|
||||
var total_size = 0;
|
||||
$.each($('#upload-file-form input[type=file]'), function() {
|
||||
if($(this).val()) {
|
||||
total += this.files[0].size;
|
||||
if(this.files && this.files.length > 0) {
|
||||
total_size += this.files[0].size;
|
||||
}
|
||||
});
|
||||
if (total > {{ max_upload_file_size }}) {
|
||||
if (total_size > {{ max_upload_file_size }}) {
|
||||
$('#upload-file-form .error').html('{% trans "File size surpasses the limit." %}').removeClass('hide');
|
||||
return false;
|
||||
}
|
||||
}
|
||||
|
||||
$('#upload-file-form .error').addClass('hide');
|
||||
|
||||
$.fn.MultiFile.disableEmpty(); // disable dummy element before submiting the form
|
||||
submit_and_real_time_show('#upload-file-dialog');
|
||||
submitAndShowProgress($('#upload-file-form'), $('#upload-progress-con'))
|
||||
return false;
|
||||
});
|
||||
|
||||
$('#upload-file-dialog #upload-cancel').click(function() {
|
||||
location.reload(true);
|
||||
});
|
||||
|
||||
$('#update-file-form .submit').click(function () {
|
||||
if (!$.trim($('#update-file-form input[type=file]').val())) {
|
||||
if (!$.trim($('#file-update-input').val())) {
|
||||
$('#update-file-form .error').html('{% trans "Please choose a file at first." %}').removeClass('hide');
|
||||
return false;
|
||||
}
|
||||
|
||||
$('#update-file-form .error').addClass('hide');
|
||||
|
||||
$.fn.MultiFile.disableEmpty(); // disable dummy element before submiting the form
|
||||
submit_and_real_time_show('#update-file-dialog');
|
||||
submitAndShowProgress($('#update-file-form'), $('#update-progress-con'))
|
||||
return false;
|
||||
});
|
||||
|
||||
$('#update-file-dialog #upload-cancel').click(function() {
|
||||
location.reload(true);
|
||||
$('#upload-progress-con .upload-cancel, #update-progress-con .unload-cancel').click(function() {
|
||||
location.reload();
|
||||
});
|
||||
|
||||
</script>
|
||||
{% endif %}
|
||||
|
4
views.py
4
views.py
@@ -2030,11 +2030,11 @@ def file_upload_progress_page(request):
|
||||
'''
|
||||
uuid = request.GET.get('uuid', '')
|
||||
httpserver_root = get_httpserver_root()
|
||||
dialog_id = request.GET.get('dlg_id', '')
|
||||
upload_progress_con_id = request.GET.get('upload_progress_con_id', '')
|
||||
return render_to_response('file_upload_progress_page.html', {
|
||||
'uuid': uuid,
|
||||
'httpserver_root': httpserver_root,
|
||||
'dialog_id': '#' + dialog_id,
|
||||
'upload_progress_con_id': upload_progress_con_id,
|
||||
}, context_instance=RequestContext(request))
|
||||
|
||||
@login_required
|
||||
|
Reference in New Issue
Block a user