diff options
-rw-r--r-- | Zotlabs/Module/File_upload.php | 3 | ||||
-rw-r--r-- | Zotlabs/Module/Photos.php | 4 | ||||
-rwxr-xr-x | util/storageconv | 19 | ||||
-rw-r--r-- | view/js/mod_cloud.js | 107 | ||||
-rw-r--r-- | view/js/mod_photos.js | 277 | ||||
-rw-r--r-- | view/tpl/cloud_directory.tpl | 4 | ||||
-rw-r--r-- | view/tpl/photos_upload.tpl | 2 |
7 files changed, 161 insertions, 255 deletions
diff --git a/Zotlabs/Module/File_upload.php b/Zotlabs/Module/File_upload.php index e18067e20..d4c9ad59a 100644 --- a/Zotlabs/Module/File_upload.php +++ b/Zotlabs/Module/File_upload.php @@ -99,6 +99,9 @@ class File_upload extends \Zotlabs\Web\Controller { } } + if(is_ajax()) + killme(); + goaway(z_root() . '/' . $_REQUEST['return_url']); } diff --git a/Zotlabs/Module/Photos.php b/Zotlabs/Module/Photos.php index 3aad70d18..57126df5f 100644 --- a/Zotlabs/Module/Photos.php +++ b/Zotlabs/Module/Photos.php @@ -171,6 +171,7 @@ class Photos extends \Zotlabs\Web\Controller { } goaway(z_root() . '/photos/' . \App::$data['channel']['channel_address']); + } if((argc() > 2) && (x($_REQUEST,'delete')) && ($_REQUEST['delete'] === t('Delete Photo'))) { @@ -501,6 +502,9 @@ class Photos extends \Zotlabs\Web\Controller { goaway(z_root() . '/photos/' . \App::$data['channel']['channel_address']); } + if(is_ajax()) + killme(); + goaway(z_root() . '/photos/' . \App::$data['channel']['channel_address'] . '/album/' . $r['data']['folder']); } diff --git a/util/storageconv b/util/storageconv index 52bb77fbb..676425038 100755 --- a/util/storageconv +++ b/util/storageconv @@ -77,17 +77,18 @@ if($argc == 2) { } if(! file_put_contents($filename, dbunescbin($xx['content']))) { + @unlink($filename); echo PHP_EOL . 'Failed to save file ' . $filename . PHP_EOL; - continue; } - - $z = q("UPDATE photo SET content = '%s', os_storage = 1 WHERE id = %d", - dbescbin($filename), - intval($xx['id']) - ); - if(! $z) { - @unlink($filename); - echo PHP_EOL . 'Failed to update metadata for saved file ' . $filename . PHP_EOL; + else { + $z = q("UPDATE photo SET content = '%s', os_storage = 1 WHERE id = %d", + dbescbin($filename), + intval($xx['id']) + ); + if(! $z) { + @unlink($filename); + echo PHP_EOL . 'Failed to update metadata for saved file ' . $filename . PHP_EOL; + } } $cur_id = $xx['id']; 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>' + diff --git a/view/js/mod_photos.js b/view/js/mod_photos.js index 1ce410a1b..faf14982b 100644 --- a/view/js/mod_photos.js +++ b/view/js/mod_photos.js @@ -20,151 +20,96 @@ 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); - - // file drop -// filedrag.on("dragover", DragDropUploadFileHover); -// filedrag.on("dragleave", DragDropUploadFileHover); -// filedrag.on("drop", DragDropUploadFileSelectHandler); -// } - -// 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); - } -} + 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('background-size', Math.round(data.loaded / data.total * 100) + '%'); + }, + + stop: function(e,data) { + if(reload) { + console.log('Upload completed'); + window.location.href = window.location.href; + } + } + }); -// 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; - } + $('#dbtn-submit').click(function(event) { event.preventDefault(); $('#invisible-photos-file-upload').trigger('click'); return false;}); - // 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 id="upload-progress-bar-' + i + '" colspan="9" class="upload-progress-bar"></td>' + '</tr>' ); } @@ -224,63 +169,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); -} diff --git a/view/tpl/cloud_directory.tpl b/view/tpl/cloud_directory.tpl index b5ac93204..a851eb203 100644 --- a/view/tpl/cloud_directory.tpl +++ b/view/tpl/cloud_directory.tpl @@ -1,7 +1,7 @@ <div class="{{if $tiles}}section-content-wrapper{{else}}section-content-wrapper-np{{/if}}"> {{if $tiles}} <table id="cloud-index"> - <tr id="new-upload-progress-bar-1"></tr> {{* this is needed to append the upload files in the right order *}} + <tr id="new-upload-progress-bar-0"></tr> {{* this is needed to append the upload files in the right order *}} </table> <div class="row row-cols-2 row-cols-md-4"> {{if $parentpath}} @@ -136,7 +136,7 @@ </td> </tr> {{/if}} - <tr id="new-upload-progress-bar-1"></tr> {{* this is needed to append the upload files in the right order *}} + <tr id="new-upload-progress-bar-0"></tr> {{* this is needed to append the upload files in the right order *}} {{foreach $entries as $item}} <tr id="cloud-index-{{$item.attach_id}}" class="cloud-index{{if $item.collection}} attach-drop{{/if}}"{{if $item.collection}} data-folder="{{$item.resource}}"{{/if}} data-id="{{$item.attach_id}}" draggable="true"> <td> diff --git a/view/tpl/photos_upload.tpl b/view/tpl/photos_upload.tpl index 95cf4e295..72f6c4611 100644 --- a/view/tpl/photos_upload.tpl +++ b/view/tpl/photos_upload.tpl @@ -55,7 +55,7 @@ </form> </div> <table id="upload-index"> - <tr id="new-upload-progress-bar-1"></tr> {{* this is needed to append the upload files in the right order *}} + <tr id="new-upload-progress-bar-0"></tr> {{* this is needed to append the upload files in the right order *}} </table> {{$aclselect}} <div id="photos-upload-end" class="clear"></div> |