chunked uploads for photos page
This commit is contained in:
zotlabs
parent
d5763ba476
commit
ba547c2257
@ -465,6 +465,51 @@ class Photos extends \Zotlabs\Web\Controller {
|
||||
$_REQUEST['group_deny'] = expand_acl($channel['channel_deny_gid']);
|
||||
}
|
||||
|
||||
|
||||
$matches = [];
|
||||
$partial = false;
|
||||
|
||||
|
||||
|
||||
if(array_key_exists('HTTP_CONTENT_RANGE',$_SERVER)) {
|
||||
$pm = preg_match('/bytes (\d*)\-(\d*)\/(\d*)/',$_SERVER['HTTP_CONTENT_RANGE'],$matches);
|
||||
if($pm) {
|
||||
logger('Content-Range: ' . print_r($matches,true));
|
||||
$partial = true;
|
||||
}
|
||||
}
|
||||
|
||||
if($partial) {
|
||||
$x = save_chunk($channel,$matches[1],$matches[2],$matches[3]);
|
||||
|
||||
if($x['partial']) {
|
||||
header('Range: bytes=0-' . (($x['length']) ? $x['length'] - 1 : 0));
|
||||
json_return_and_die($result);
|
||||
}
|
||||
else {
|
||||
header('Range: bytes=0-' . (($x['size']) ? $x['size'] - 1 : 0));
|
||||
|
||||
$_FILES['userfile'] = [
|
||||
'name' => $x['name'],
|
||||
'type' => $x['type'],
|
||||
'tmp_name' => $x['tmp_name'],
|
||||
'error' => $x['error'],
|
||||
'size' => $x['size']
|
||||
];
|
||||
}
|
||||
}
|
||||
else {
|
||||
if(! array_key_exists('userfile',$_FILES)) {
|
||||
$_FILES['userfile'] = [
|
||||
'name' => $_FILES['files']['name'],
|
||||
'type' => $_FILES['files']['type'],
|
||||
'tmp_name' => $_FILES['files']['tmp_name'],
|
||||
'error' => $_FILES['files']['error'],
|
||||
'size' => $_FILES['files']['size']
|
||||
];
|
||||
}
|
||||
}
|
||||
|
||||
$r = attach_store($channel,get_observer_hash(), '', $_REQUEST);
|
||||
|
||||
if(! $r['success']) {
|
||||
@ -557,8 +602,11 @@ class Photos extends \Zotlabs\Web\Controller {
|
||||
|
||||
nav_set_selected('Photos');
|
||||
|
||||
$o = "";
|
||||
|
||||
$o = '<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>';
|
||||
|
||||
|
||||
$o .= "<script> var profile_uid = " . \App::$profile['profile_uid']
|
||||
. "; var netargs = '?f='; var profile_page = " . \App::$pager['page'] . "; </script>\r\n";
|
||||
|
||||
|
||||
@ -27,29 +27,93 @@ function showHideBodyTextarea() {
|
||||
// initialize
|
||||
function UploadInit() {
|
||||
|
||||
var nickname = $('#invisible-photos-file-upload').data('nickname');
|
||||
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) {
|
||||
// var xhr = new XMLHttpRequest();
|
||||
// if (xhr.upload) {
|
||||
|
||||
// file select
|
||||
fileselect.attr("multiple", 'multiple');
|
||||
fileselect.on("change", UploadFileSelectHandler);
|
||||
// fileselect.attr("multiple", 'multiple');
|
||||
// fileselect.on("change", UploadFileSelectHandler);
|
||||
|
||||
// file submit
|
||||
submit.on("click", fileselect, UploadFileSelectHandler);
|
||||
// submit.on("click", fileselect, UploadFileSelectHandler);
|
||||
|
||||
// file drop
|
||||
filedrag.on("dragover", DragDropUploadFileHover);
|
||||
filedrag.on("dragleave", DragDropUploadFileHover);
|
||||
filedrag.on("drop", DragDropUploadFileSelectHandler);
|
||||
}
|
||||
// filedrag.on("dragover", DragDropUploadFileHover);
|
||||
// filedrag.on("dragleave", DragDropUploadFileHover);
|
||||
// filedrag.on("drop", DragDropUploadFileSelectHandler);
|
||||
// }
|
||||
|
||||
window.filesToUpload = 0;
|
||||
window.fileUploadsCompleted = 0;
|
||||
// window.filesToUpload = 0;
|
||||
// window.fileUploadsCompleted = 0;
|
||||
}
|
||||
|
||||
// file drag hover
|
||||
@ -98,8 +162,11 @@ function UploadFileSelectHandler(e) {
|
||||
}
|
||||
}
|
||||
|
||||
function prepareHtml(f, i) {
|
||||
var num = i - 1;
|
||||
function prepareHtml(f) {
|
||||
|
||||
var num = f.count - 1;
|
||||
var i = f.count;
|
||||
|
||||
$('#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>' +
|
||||
|
||||
@ -1,6 +1,7 @@
|
||||
<div id="photo-upload-form">
|
||||
<input id="invisible-photos-file-upload" type="file" name="files" style="visibility:hidden;position:absolute;top:-50;left:-50;width:0;height:0;" multiple data-nickname='{{$nickname}}' >
|
||||
<div class="section-content-tools-wrapper">
|
||||
<form action="photos/{{$nickname}}" enctype="multipart/form-data" method="post" name="photos-upload-form" id="photos-upload-form" class="acl-form" data-form_id="photos-upload-form" data-allow_cid='{{$allow_cid}}' data-allow_gid='{{$allow_gid}}' data-deny_cid='{{$deny_cid}}' data-deny_gid='{{$deny_gid}}'>
|
||||
<form action="#" enctype="multipart/form-data" method="post" name="photos-upload-form" id="photos-upload-form" class="acl-form" data-form_id="photos-upload-form" data-allow_cid='{{$allow_cid}}' data-allow_gid='{{$allow_gid}}' data-deny_cid='{{$deny_cid}}' data-deny_gid='{{$deny_gid}}'>
|
||||
<input type="hidden" id="photos-upload-source" name="source" value="photos" />
|
||||
|
||||
<div class="form-group">
|
||||
@ -15,9 +16,9 @@
|
||||
</datalist>
|
||||
</div>
|
||||
{{if $default}}
|
||||
<div class="form-group">
|
||||
<!-- div class="form-group">
|
||||
<input id="photos-upload-choose" type="file" name="userfile" />
|
||||
</div>
|
||||
</div -->
|
||||
{{include file="field_input.tpl" field=$caption}}
|
||||
{{include file="field_checkbox.tpl" field=$visible}}
|
||||
<div id="body-textarea">
|
||||
@ -30,7 +31,7 @@
|
||||
<i id="jot-perms-icon" class="fa fa-{{$lockstate}}"></i>
|
||||
</button>
|
||||
{{/if}}
|
||||
<button id="dbtn-submit" class="btn btn-primary btn-sm" type="submit" name="submit" >{{$submit}}</button>
|
||||
<button id="dbtn-submit" class="btn btn-primary btn-sm">{{$submit}}</button>
|
||||
</div>
|
||||
|
||||
</div>
|
||||
@ -57,7 +58,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-1"></tr> {{* this is needed to append the upload files in the right order *}}
|
||||
</table>
|
||||
{{$aclselect}}
|
||||
<div id="photos-upload-end" class="clear"></div>
|
||||
|
||||
Reference in New Issue
Block a user