aboutsummaryrefslogtreecommitdiffstats
path: root/view/js
diff options
context:
space:
mode:
Diffstat (limited to 'view/js')
-rw-r--r--view/js/main.js38
-rw-r--r--view/js/mod_cloud.js115
-rw-r--r--view/js/mod_import_progress.js54
-rw-r--r--view/js/mod_photos.js280
4 files changed, 216 insertions, 271 deletions
diff --git a/view/js/main.js b/view/js/main.js
index 476e78056..d3f4eff9a 100644
--- a/view/js/main.js
+++ b/view/js/main.js
@@ -1457,35 +1457,21 @@ function preview_post() {
}
function bin2hex(s) {
- // Converts the binary representation of data to hex
- //
- // version: 812.316
- // discuss at: http://phpjs.org/functions/bin2hex
- // + original by: Kevin van Zonneveld (http://kevin.vanzonneveld.net)
- // + bugfixed by: Onno Marsman
- // + bugfixed by: Linuxworld
- // * example 1: bin2hex('Kev');
- // * returns 1: '4b6576'
- // * example 2: bin2hex(String.fromCharCode(0x00));
- // * returns 2: '00'
- var v,i, f = 0, a = [];
- s += '';
- f = s.length;
-
- for (i = 0; i<f; i++) {
- a[i] = s.charCodeAt(i).toString(16).replace(/^([\da-f])$/,"0$1");
- }
-
- return a.join('');
+ // UTF-8 encoding to hex is supported
+ var bytes = new TextEncoder().encode(s);
+ return Array.from(
+ bytes,
+ byte => byte.toString(16).padStart(2, "0")
+ ).join("");
}
function hex2bin(hex) {
- var bytes = [], str;
-
- for(var i=0; i< hex.length-1; i+=2)
- bytes.push(parseInt(hex.substr(i, 2), 16));
-
- return String.fromCharCode.apply(String, bytes);
+ // UTF-8 decoding from hex is supported
+ var bytes = new Uint8Array(hex.length / 2);
+ for (i = 0; i !== bytes.length; i++) {
+ bytes[i] = parseInt(hex.substr(i * 2, 2), 16);
+ }
+ return new TextDecoder().decode(bytes);
}
function groupChangeMember(gid, cid, sec_token) {
diff --git a/view/js/mod_cloud.js b/view/js/mod_cloud.js
index 928ce8689..1f444e4fe 100644
--- a/view/js/mod_cloud.js
+++ b/view/js/mod_cloud.js
@@ -402,74 +402,85 @@ $(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) {
- progress: function(e,data) {
+ idx++;
+ data.files[0].idx = idx;
+ prepareHtml(data.files[0]);
- // there will only be one file, the one we are looking for
+ 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') || []);
- $(data.files).each( function() {
- var idx = this.count;
+ $('.acl-field').remove();
- // 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) + '%');
+ $(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();
+ // trick it into not uploadiong all files at once
+ $('#new-upload-' + data.files[0].idx).one('fileupload_trigger', function () {
+ data.submit();
+ });
- },
+ $('#new-upload-1').trigger('fileupload_trigger');
+ },
- stop: function(e,data) {
- window.location.href = window.location.href;
+ 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('width', Math.round(data.loaded / data.total * 100) + '%');
- $('#upload-submit').click(function(event) { event.preventDefault(); $('#invisible-cloud-file-upload').trigger('click'); return false;});
+ },
-}
+ 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');});
+}
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>' +
@@ -479,7 +490,11 @@ function prepareHtml(f) {
'<td class="d-none d-md-table-cell">' + formatSizeUnits(f.size) + '</td><td class="d-none d-md-table-cell"></td>' +
'</tr>' +
'<tr id="new-upload-progress-bar-' + i + '" class="new-upload">' +
- '<td id="upload-progress-bar-' + i + '" colspan="9" class="upload-progress-bar"></td>' +
+ '<td colspan="9" class="upload-progress-bar">' +
+ '<div class="progress" style="height: 1px;">' +
+ '<div id="upload-progress-bar-' + i + '" class="progress-bar bg-info" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>' +
+ '</div>' +
+ '</td>' +
'</tr>'
);
}
diff --git a/view/js/mod_import_progress.js b/view/js/mod_import_progress.js
new file mode 100644
index 000000000..7aed56365
--- /dev/null
+++ b/view/js/mod_import_progress.js
@@ -0,0 +1,54 @@
+$(document).ready(function() {
+ setInterval(get_progress, 5000);
+
+ function get_progress(){
+ $.get('import_progress', function(data) {
+ update_progress(data);
+ });
+ }
+
+ function update_progress(data){
+
+ // items
+ if (typeof data.cprogress == 'number') {
+ $('#cprogress-label').html(data.cprogress + '%');
+ $('#cprogress-bar').css('width', data.cprogress + '%');
+
+ if (data.cprogress == 100) {
+ $('#cprogress-resume').addClass('d-none');
+ $('#cprogress-completed').removeClass('d-none');
+ $('#cprogress-bar').removeClass('progress-bar-animated');
+ }
+ else if (data.cprogress < 100) {
+ $('#cprogress-resume').removeClass('d-none');
+ $('#cprogress-completed').addClass('d-none');
+ $('#cprogress-bar').addClass('progress-bar-animated');
+ }
+ }
+ else {
+ $('#cprogress-label').html(data.cprogress);
+ $('#cprogress-bar').css('width', '0%');
+ }
+
+ // files
+ if (typeof data.fprogress == 'number') {
+ $('#fprogress-label').html(data.fprogress + '%');
+ $('#fprogress-bar').css('width', data.fprogress + '%');
+
+ if (data.fprogress == 100) {
+ $('#fprogress-resume').addClass('d-none');
+ $('#fprogress-completed').removeClass('d-none');
+ $('#fprogress-bar').removeClass('progress-bar-animated');
+ }
+ else if (data.fprogress < 100) {
+ $('#fprogress-resume').removeClass('d-none');
+ $('#fprogress-completed').addClass('d-none');
+ $('#fprogress-bar').addClass('progress-bar-animated');
+ }
+ }
+ else {
+ $('#fprogress-label').html(data.fprogress);
+ $('#fprogress-bar').css('width', '0%');
+ }
+ }
+});
diff --git a/view/js/mod_photos.js b/view/js/mod_photos.js
index 1ce410a1b..c487fc417 100644
--- a/view/js/mod_photos.js
+++ b/view/js/mod_photos.js
@@ -20,151 +20,101 @@ function UploadInit() {
var fileselect = $("#photos-upload-choose");
var filedrag = $("#photos-upload-form");
var submit = $("#dbtn-submit");
- var count = 1;
-
- $('#invisible-photos-file-upload').fileupload({
- url: 'photos/' + nickname,
- dataType: 'json',
- dropZone: filedrag,
- maxChunkSize: 4 * 1024 * 1024,
-
- add: function(e,data) {
- $(data.files).each( function() { this.count = ++ count; prepareHtml(this); });
-
- var allow_cid = ($('#photos-upload-form').data('allow_cid') || []);
- var allow_gid = ($('#photos-upload-form').data('allow_gid') || []);
- var deny_cid = ($('#photos-upload-form').data('deny_cid') || []);
- var deny_gid = ($('#photos-upload-form').data('deny_gid') || []);
-
- $('.acl-field').remove();
-
- $(allow_gid).each(function(i,v) {
- $('#photos-upload-form').append("<input class='acl-field' type='hidden' name='group_allow[]' value='"+v+"'>");
- });
- $(allow_cid).each(function(i,v) {
- $('#photos-upload-form').append("<input class='acl-field' type='hidden' name='contact_allow[]' value='"+v+"'>");
- });
- $(deny_gid).each(function(i,v) {
- $('#photos-upload-form').append("<input class='acl-field' type='hidden' name='group_deny[]' value='"+v+"'>");
- });
- $(deny_cid).each(function(i,v) {
- $('#photos-upload-form').append("<input class='acl-field' type='hidden' name='contact_deny[]' value='"+v+"'>");
- });
-
- data.formData = $('#photos-upload-form').serializeArray();
-
- data.submit();
- },
-
- progress: function(e,data) {
-
- // there will only be one file, the one we are looking for
-
- $(data.files).each( function() {
- var idx = this.count;
-
- // 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) + '%');
-
- });
-
-
- },
-
-
- stop: function(e,data) {
- window.location.href = window.location.href;
- }
-
- });
-
- $('#dbtn-submit').click(function(event) { event.preventDefault(); $('#invisible-photos-file-upload').trigger('click'); return false;});
-
-
-
-
- // is XHR2 available?
-// var xhr = new XMLHttpRequest();
-// if (xhr.upload) {
-
- // file select
-// fileselect.attr("multiple", 'multiple');
-// fileselect.on("change", UploadFileSelectHandler);
-
- // file submit
-// submit.on("click", fileselect, UploadFileSelectHandler);
+ var idx = 0;
+ var reload = false;
+
+
+ $('#invisible-photos-file-upload').fileupload({
+ url: 'photos/' + nickname,
+ 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 = ($('#photos-upload-form').data('allow_cid') || []);
+ var allow_gid = ($('#photos-upload-form').data('allow_gid') || []);
+ var deny_cid = ($('#photos-upload-form').data('deny_cid') || []);
+ var deny_gid = ($('#photos-upload-form').data('deny_gid') || []);
+
+ $('.acl-field').remove();
+
+ $(allow_gid).each(function(i,v) {
+ $('#photos-upload-form').append("<input class='acl-field' type='hidden' name='group_allow[]' value='"+v+"'>");
+ });
+ $(allow_cid).each(function(i,v) {
+ $('#photos-upload-form').append("<input class='acl-field' type='hidden' name='contact_allow[]' value='"+v+"'>");
+ });
+ $(deny_gid).each(function(i,v) {
+ $('#photos-upload-form').append("<input class='acl-field' type='hidden' name='group_deny[]' value='"+v+"'>");
+ });
+ $(deny_cid).each(function(i,v) {
+ $('#photos-upload-form').append("<input class='acl-field' type='hidden' name='contact_deny[]' value='"+v+"'>");
+ });
+
+ data.formData = $('#photos-upload-form').serializeArray();
+
+ // trick it into not uploadiong all files at once
+ $('#new-upload-' + data.files[0].idx).one('fileupload_trigger', function () {
+ data.submit();
+ });
+
+ $('#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('width', Math.round(data.loaded / data.total * 100) + '%');
+ },
+
+ stop: function(e,data) {
+ if(reload) {
+ console.log('Upload completed');
+ window.location.href = window.location.href;
+ }
+ }
+ });
- // file drop
-// filedrag.on("dragover", DragDropUploadFileHover);
-// filedrag.on("dragleave", DragDropUploadFileHover);
-// filedrag.on("drop", DragDropUploadFileSelectHandler);
-// }
+ $('#dbtn-submit').click(function(event) { event.preventDefault(); $('#invisible-photos-file-upload').trigger('click'); return false;});
-// window.filesToUpload = 0;
-// window.fileUploadsCompleted = 0;
}
-// file drag hover
-function DragDropUploadFileHover(e) {
- e.stopPropagation();
- e.preventDefault();
- e.currentTarget.className = (e.type == "dragover" ? "hover" : "");
-}
-
-// file selection via drag/drop
-function DragDropUploadFileSelectHandler(e) {
- // cancel event and hover styling
- DragDropUploadFileHover(e);
-
- // fetch FileList object
- var files = e.target.files || e.originalEvent.dataTransfer.files;
-
- $('.new-upload').remove();
-
- // process all File objects
- for (var i = 0, f; f = files[i]; i++) {
- prepareHtml(f, i);
- UploadFile(f, i);
- }
-}
-
-// file selection via input
-function UploadFileSelectHandler(e) {
- // fetch FileList object
- if(e.target.id === 'dbtn-submit') {
- e.preventDefault();
- var files = e.data[0].files;
- }
- if(e.target.id === 'photos-upload-choose') {
- $('.new-upload').remove();
- var files = e.target.files;
- }
-
- // process all File objects
- for (var i = 0, f; f = files[i]; i++) {
- if(e.target.id === 'photos-upload-choose')
- prepareHtml(f, i);
- if(e.target.id === 'dbtn-submit') {
- UploadFile(f, i);
- }
- }
-}
function prepareHtml(f) {
-
- var num = f.count - 1;
- var i = f.count;
-
+ var num = f.idx - 1;
+ var i = f.idx;
$('#upload-index #new-upload-progress-bar-' + num.toString()).after(
'<tr id="new-upload-' + i + '" class="new-upload">' +
- '<td width="1%"><i class="fa ' + getIconFromType(f.type) + '" title="' + f.type + '"></i></td>' +
- '<td width="96%">' + f.name + '</td>' +
- '<td id="upload-progress-' + i + '" width="1%"></td>' +
- '<td class="d-none d-md-table-cell" width="1%">' + formatSizeUnits(f.size) + '</td>' +
+ '<td></td>' +
+ '<td><i class="fa fa-fw ' + getIconFromType(f.type) + '" title="' + f.type + '"></i></td>' +
+ '<td>' + f.name + '</td>' +
+ '<td id="upload-progress-' + i + '"></td><td></td><td></td>' +
+ '<td class="d-none d-md-table-cell">' + formatSizeUnits(f.size) + '</td><td class="d-none d-md-table-cell"></td>' +
'</tr>' +
'<tr id="new-upload-progress-bar-' + i + '" class="new-upload">' +
- '<td id="upload-progress-bar-' + i + '" colspan="4" class="upload-progress-bar"></td>' +
+ '<td colspan="8" class="upload-progress-bar">' +
+ '<div class="progress" style="height: 1px;">' +
+ '<div id="upload-progress-bar-' + i + '" class="progress-bar bg-info" role="progressbar" style="width: 0%;" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100"></div>' +
+ '</div>' +
+ '</td>' +
'</tr>'
);
}
@@ -224,63 +174,3 @@ function getIconFromType(type) {
return iconFromType;
}
-
-// upload files
-function UploadFile(file, idx) {
-
- window.filesToUpload = window.filesToUpload + 1;
-
- var xhr = new XMLHttpRequest();
-
- xhr.withCredentials = true; // Include the SESSION cookie info for authentication
-
- (xhr.upload || xhr).addEventListener('progress', function (e) {
-
- var done = e.position || e.loaded;
- var total = e.totalSize || e.total;
- // Dynamically update the percentage complete displayed in the file upload list
- $('#upload-progress-' + idx).html(Math.round(done / total * 100) + '%');
- $('#upload-progress-bar-' + idx).css('background-size', Math.round(done / total * 100) + '%');
-
- if(done == total) {
- $('#upload-progress-' + idx).html('Processing...');
- }
-
- });
-
-
- xhr.addEventListener('load', function (e) {
- //we could possibly turn the filenames to real links here and add the delete and edit buttons to avoid page reload...
- $('#upload-progress-' + idx).html('Ready!');
-
- //console.log('xhr upload complete', e);
- window.fileUploadsCompleted = window.fileUploadsCompleted + 1;
-
- // When all the uploads have completed, refresh the page
- if (window.filesToUpload > 0 && window.fileUploadsCompleted === window.filesToUpload) {
-
- window.fileUploadsCompleted = window.filesToUpload = 0;
-
- // After uploads complete, refresh browser window to display new files
- window.location.href = window.location.href;
- }
- });
-
-
- xhr.addEventListener('error', function (e) {
- $('#upload-progress-' + idx).html('<span style="color: red;">ERROR</span>');
- });
-
- // POST to the entire cloud path
- xhr.open('post', $('#photos-upload-form').attr( 'action' ), true);
-
- var formfields = $("#photos-upload-form").serializeArray();
-
- var data = new FormData();
- $.each(formfields, function(i, field) {
- data.append(field.name, field.value);
- });
- data.append('userfile', file);
-
- xhr.send(data);
-}