diff options
Diffstat (limited to 'view')
| -rw-r--r-- | view/js/mod_cloud.js | 74 | ||||
| -rw-r--r-- | view/tpl/cloud.tpl | 4 | ||||
| -rw-r--r-- | view/tpl/cloud_actionspanel.tpl | 9 | ||||
| -rw-r--r-- | view/tpl/cloud_directory.tpl | 2 |
4 files changed, 59 insertions, 30 deletions
diff --git a/view/js/mod_cloud.js b/view/js/mod_cloud.js index 8af90863e..9f2a007f3 100644 --- a/view/js/mod_cloud.js +++ b/view/js/mod_cloud.js @@ -16,26 +16,48 @@ function UploadInit() { var fileselect = $("#files-upload"); var filedrag = $("#cloud-drag-area"); var submit = $("#upload-submit"); + var count = 1; - // is XHR2 available? - var xhr = new XMLHttpRequest(); - if (xhr.upload) { + + $('#invisible-cloud-file-upload').fileupload({ + url: 'file_upload', + dataType: 'json', + dropZone: filedrag, + formData: $('#ajax-upload-files').serializeArray(), + maxChunkSize: 4 * 1024 * 1024, - // file select - fileselect.attr("multiple", 'multiple'); - fileselect.on("change", UploadFileSelectHandler); + add: function(e,data) { + $(data.files).each( function() { this.count = ++ count; prepareHtml(this); }); + + data.submit(); + }, - // file submit - submit.on("click", fileselect, UploadFileSelectHandler); - // file drop - filedrag.on("dragover", DragDropUploadFileHover); - filedrag.on("dragleave", DragDropUploadFileHover); - filedrag.on("drop", DragDropUploadFileSelectHandler); - } + 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; + } + + }); + + $('#upload-submit').click(function(event) { event.preventDefault(); $('#invisible-cloud-file-upload').trigger('click'); return false;}); - window.filesToUpload = 0; - window.fileUploadsCompleted = 0; } // file drag hover @@ -84,8 +106,9 @@ function UploadFileSelectHandler(e) { } } -function prepareHtml(f, i) { - var num = i - 1; +function prepareHtml(f) { + var num = f.count - 1; + var i = f.count; $('#cloud-index #new-upload-progress-bar-' + num.toString()).after( '<tr id="new-upload-' + i + '" class="new-upload">' + '<td><i class="fa ' + getIconFromType(f.type) + '" title="' + f.type + '"></i></td>' + @@ -158,6 +181,7 @@ function getIconFromType(type) { // upload files function UploadFile(file, idx) { + window.filesToUpload = window.filesToUpload + 1; var xhr = new XMLHttpRequest(); @@ -202,15 +226,15 @@ function UploadFile(file, idx) { }); // POST to the entire cloud path - xhr.open('post', 'file_upload', true); +// xhr.open('post', 'file_upload', true); - var formfields = $("#ajax-upload-files").serializeArray(); +// var formfields = $("#ajax-upload-files").serializeArray(); - var data = new FormData(); - $.each(formfields, function(i, field) { - data.append(field.name, field.value); - }); - data.append('userfile', file); +// var data = new FormData(); +// $.each(formfields, function(i, field) { +// data.append(field.name, field.value); +// }); +// data.append('userfile', file); - xhr.send(data); +// xhr.send(data); } diff --git a/view/tpl/cloud.tpl b/view/tpl/cloud.tpl index d1567af9f..e7237c7e6 100644 --- a/view/tpl/cloud.tpl +++ b/view/tpl/cloud.tpl @@ -1,3 +1,7 @@ +<script src="library/blueimp_upload/js/vendor/jquery.ui.widget.js"></script> +<script src="library/blueimp_upload/js/jquery.iframe-transport.js"></script> +<script src="library/blueimp_upload/js/jquery.fileupload.js"></script> + <div class="generic-content-wrapper"> {{include file="cloud_header.tpl"}} {{include file="cloud_directory.tpl"}} diff --git a/view/tpl/cloud_actionspanel.tpl b/view/tpl/cloud_actionspanel.tpl index fc3e7f82f..6b876d2ac 100644 --- a/view/tpl/cloud_actionspanel.tpl +++ b/view/tpl/cloud_actionspanel.tpl @@ -1,3 +1,4 @@ +<input id="invisible-cloud-file-upload" type="file" name="files" style="visibility:hidden;position:absolute;top:-50;left:-50;width:0;height:0;" multiple> <div id="files-mkdir-tools" class="section-content-tools-wrapper"> <label for="files-mkdir">{{$folder_header}}</label> <form id="mkdir-form" method="post" action="file_upload" class="acl-form" data-form_id="mkdir-form" data-allow_cid='{{$allow_cid}}' data-allow_gid='{{$allow_gid}}' data-deny_cid='{{$deny_cid}}' data-deny_gid='{{$deny_gid}}'> @@ -20,12 +21,12 @@ </div> <div id="files-upload-tools" class="section-content-tools-wrapper"> {{if $quota.limit || $quota.used}}<div class="{{if $quota.warning}}section-content-danger-wrapper{{else}}section-content-info-wrapper{{/if}}">{{if $quota.warning}}<strong>{{$quota.warning}} </strong>{{/if}}{{if $quota.desc}}{{$quota.desc}}<br><br>{{/if}}{{$info}}</div>{{/if}} - <form id="ajax-upload-files" method="post" action="file_upload" enctype="multipart/form-data" class="acl-form" data-form_id="ajax-upload-files" data-allow_cid='{{$allow_cid}}' data-allow_gid='{{$allow_gid}}' data-deny_cid='{{$deny_cid}}' data-deny_gid='{{$deny_gid}}'> + <form id="ajax-upload-files" method="post" action="#" enctype="multipart/form-data" class="acl-form" data-form_id="ajax-upload-files" data-allow_cid='{{$allow_cid}}' data-allow_gid='{{$allow_gid}}' data-deny_cid='{{$deny_cid}}' data-deny_gid='{{$deny_gid}}'> <input type="hidden" name="directory" value="{{$path}}" /> <input type="hidden" name="channick" value="{{$channick}}" /> <input type="hidden" name="return_url" value="{{$return_url}}" /> - <label for="files-upload">{{$upload_header}}</label> - <input class="form-group pull-left" id="files-upload" type="file" name="userfile"> + <!--label for="files-upload">{{$upload_header}}</label> + <input class="form-group pull-left" id="files-upload" type="file" name="files[]" multiple --> {{include file="field_checkbox.tpl" field=$notify}} <div class="pull-right btn-group"> <div class="btn-group"> @@ -34,7 +35,7 @@ <i class="jot-perms-icon fa fa-{{$lockstate}}"></i> </button> {{/if}} - <button id="upload-submit" class="btn btn-primary btn-sm pull-right" type="submit" name="submit" value="{{$upload_submit}}">{{$upload_submit}}</button> + <button id="upload-submit" class="btn btn-primary btn-sm pull-right">{{$upload_submit}}</button> </div> </div> </form> diff --git a/view/tpl/cloud_directory.tpl b/view/tpl/cloud_directory.tpl index 88b6bf563..7017df344 100644 --- a/view/tpl/cloud_directory.tpl +++ b/view/tpl/cloud_directory.tpl @@ -52,7 +52,7 @@ <td class="d-none d-md-table-cell"></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-1"></tr> {{* this is needed to append the upload files in the right order *}} {{foreach $entries as $item}} <tr id="cloud-index-{{$item.attachId}}"> <td><i class="fa {{$item.iconFromType}}" title="{{$item.type}}"></i></td> |