aboutsummaryrefslogtreecommitdiffstats
path: root/view/js/mod_cloud.js
diff options
context:
space:
mode:
authorMario <mario@mariovavti.com>2021-10-01 07:14:05 +0000
committerMario <mario@mariovavti.com>2021-10-01 07:14:05 +0000
commit22dff49673d7732b846107c888259170332746cb (patch)
treeb4f371f8347c71ce81f79df334bc6579e135c84e /view/js/mod_cloud.js
parent6ed160e4fa05e880bc81720b626f2bdc68a20db8 (diff)
downloadvolse-hubzilla-22dff49673d7732b846107c888259170332746cb.tar.gz
volse-hubzilla-22dff49673d7732b846107c888259170332746cb.tar.bz2
volse-hubzilla-22dff49673d7732b846107c888259170332746cb.zip
improve file upload performance: start uploading next file only after the previous finished, make sure to not return when uploading via ajax
Diffstat (limited to 'view/js/mod_cloud.js')
-rw-r--r--view/js/mod_cloud.js107
1 files changed, 60 insertions, 47 deletions
diff --git a/view/js/mod_cloud.js b/view/js/mod_cloud.js
index 928ce8689..08fdbd677 100644
--- a/view/js/mod_cloud.js
+++ b/view/js/mod_cloud.js
@@ -402,74 +402,87 @@ $(document).ready(function () {
function UploadInit() {
var submit = $("#upload-submit");
- var count = 1;
+ var idx = 0;
var filedrag = $(".cloud-index.attach-drop");
+ var reload = false;
$('#invisible-cloud-file-upload').fileupload({
- url: 'file_upload',
- dataType: 'json',
- dropZone: filedrag,
- maxChunkSize: 4 * 1024 * 1024,
-
- add: function(e,data) {
- $(data.files).each( function() { this.count = ++ count; prepareHtml(this); });
-
- var allow_cid = ($('#ajax-upload-files').data('allow_cid') || []);
- var allow_gid = ($('#ajax-upload-files').data('allow_gid') || []);
- var deny_cid = ($('#ajax-upload-files').data('deny_cid') || []);
- var deny_gid = ($('#ajax-upload-files').data('deny_gid') || []);
-
- $('.acl-field').remove();
-
- $(allow_gid).each(function(i,v) {
- $('#ajax-upload-files').append("<input class='acl-field' type='hidden' name='group_allow[]' value='"+v+"'>");
- });
- $(allow_cid).each(function(i,v) {
- $('#ajax-upload-files').append("<input class='acl-field' type='hidden' name='contact_allow[]' value='"+v+"'>");
- });
- $(deny_gid).each(function(i,v) {
- $('#ajax-upload-files').append("<input class='acl-field' type='hidden' name='group_deny[]' value='"+v+"'>");
- });
- $(deny_cid).each(function(i,v) {
- $('#ajax-upload-files').append("<input class='acl-field' type='hidden' name='contact_deny[]' value='"+v+"'>");
- });
-
- data.formData = $('#ajax-upload-files').serializeArray();
- data.submit();
- },
+ url: 'file_upload',
+ dataType: 'json',
+ dropZone: filedrag,
+ maxChunkSize: 4 * 1024 * 1024,
+ add: function(e,data) {
+
+ idx++;
+ data.files[0].idx = idx;
+ prepareHtml(data.files[0]);
+ var allow_cid = ($('#ajax-upload-files').data('allow_cid') || []);
+ var allow_gid = ($('#ajax-upload-files').data('allow_gid') || []);
+ var deny_cid = ($('#ajax-upload-files').data('deny_cid') || []);
+ var deny_gid = ($('#ajax-upload-files').data('deny_gid') || []);
- progress: function(e,data) {
+ $('.acl-field').remove();
+
+ $(allow_gid).each(function(i,v) {
+ $('#ajax-upload-files').append("<input class='acl-field' type='hidden' name='group_allow[]' value='"+v+"'>");
+ });
+ $(allow_cid).each(function(i,v) {
+ $('#ajax-upload-files').append("<input class='acl-field' type='hidden' name='contact_allow[]' value='"+v+"'>");
+ });
+ $(deny_gid).each(function(i,v) {
+ $('#ajax-upload-files').append("<input class='acl-field' type='hidden' name='group_deny[]' value='"+v+"'>");
+ });
+ $(deny_cid).each(function(i,v) {
+ $('#ajax-upload-files').append("<input class='acl-field' type='hidden' name='contact_deny[]' value='"+v+"'>");
+ });
- // there will only be one file, the one we are looking for
+ data.formData = $('#ajax-upload-files').serializeArray();
- $(data.files).each( function() {
- var idx = this.count;
+ // trick it into not uploadiong all files at once
+ $('#new-upload-' + data.files[0].idx).one('fileupload_trigger', function () {
+ data.submit();
+ });
- // Dynamically update the percentage complete displayed in the file upload list
- $('#upload-progress-' + idx).html(Math.round(data.loaded / data.total * 100) + '%');
- $('#upload-progress-bar-' + idx).css('background-size', Math.round(data.loaded / data.total * 100) + '%');
+ $('#new-upload-1').trigger('fileupload_trigger');
+ },
- });
+ progress: function(e,data) {
+ var id = data.files[0].idx;
+ if(data.loaded == data.total) {
+ if(id == data.originalFiles.length) {
+ reload = true;
+ }
+ else {
+ // trigger uploading the next file
+ var next_id = id + 1;
+ setTimeout(function(){ $('#new-upload-' + next_id).trigger('fileupload_trigger'); }, 1000);
+ }
+ }
+ // Dynamically update the percentage complete displayed in the file upload list
+ $('#upload-progress-' + id).html(Math.round(data.loaded / data.total * 100) + '%');
+ $('#upload-progress-bar-' + id).css('background-size', Math.round(data.loaded / data.total * 100) + '%');
- },
+ },
- stop: function(e,data) {
+ stop: function(e,data) {
+ if(reload) {
+ console.log('Upload completed');
window.location.href = window.location.href;
}
+ }
+ });
- });
-
- $('#upload-submit').click(function(event) { event.preventDefault(); $('#invisible-cloud-file-upload').trigger('click'); return false;});
+ $('#upload-submit').click(function(event) { event.preventDefault(); $('#invisible-cloud-file-upload').trigger('click');});
}
function prepareHtml(f) {
- var num = f.count - 1;
- var i = f.count;
+ var num = f.idx - 1;
+ var i = f.idx;
$('#cloud-index #new-upload-progress-bar-' + num.toString()).after(
'<tr id="new-upload-' + i + '" class="new-upload">' +
'<td></td>' +