Topic: Auto-start uploading doesn't work in WebKit (Safari & Chrome)
Hi guys,
I'm using the following code to auto-start the upload after selecting files, however, it does not work when using WebKit.
Here's my code:
__Debug = true;
__Files = 0;
__Total = 0;
var status = function() {
var msg = (__Files == 1 ? '1 bestand resterend.' : __Files + ' bestanden resterend.');
$('#num_files').html(msg);
return true;
};
var percentage = function(p) {
var $b = $('#progress_bar');
var $p = $('#percentage');
if(p > parseInt(($b.width() / 360) * 100)) {
$p.html(p + '%');
$b.animate({
'width': p + '%'
}, 50);
}
return p;
};
$(window).load(function() {
var uploader = new plupload.Uploader({
runtimes: 'gears,flash,silverlight,html5,browserplus',
browse_button: 'browse',
flash_swf_url : '<?=base_url()?>scripts/beta/plupload/js/plupload.flash.swf',
silverlight_xap_url : '<?=base_url()?>scripts/beta/plupload/js/plupload.silverlight.xap',
<? if($uploader == 'pictures'): ?>
url: '<?=site_url('beta/pictures/' . $this->auth->user_id() . '/' . $this->auth->user_group() . '/' . $album_uid)?>',
unique_names: true,
max_file_size: '5mb',
resize: {width: 1024, height: 768, quality: 90},
filters : [
{title: "Afbeeldingen", extensions: "jpg,gif,png"}
]
<? endif; ?>
<? if($uploader == 'documents'): ?>
max_file_size: '20mb',
url: '<?=site_url('beta/documents/' . $this->auth->user_id() . '/' . $this->auth->user_group())?>',
filters : [
{title: "Documenten", extensions: "doc,docx,pdf,xls,xlsx,ppt,pptx,rtf,txt"}
]
<? endif; ?>
});
if(__Debug === true) {
uploader.bind('Init', function(up, params) {
console.log('Runtime: ' + params.runtime);
});
}
uploader.init();
uploader.bind('FilesAdded', function(up, files) {
$.each(files, function(i, file) {
__Files += 1;
__Total += file.size;
status;
});
if(__Debug === true) {
console.log('Files: ' + __Files);
console.log('Total: ' + __Total);
}
$('#upl_overlay').show();
up.refresh();
up.start();
});
uploader.bind('UploadProgress', function(up, file) {
var p = percentage(up.total.percent);
if(__Debug === true) {
console.log('Percent: ' + p + '%');
console.log('Loaded / Total: ' + up.total.loaded + ' / ' + up.total.size);
console.log('B/s: ' + up.total.bytesPerSec);
}
});
uploader.bind('FileUploaded', function(up, file, r) {
if(__Debug === true) console.log(r);
var json = JSON.parse(r.response);
__Total -= file.size;
__Files -= 1;
status;
if(json.error) {
if(__Debug === true) console.log(json.error.code + ': ' + json.error.message);
} else {
if(__Debug === true) console.log('Upload was successful: ' + json.result.s3url);
}
});
uploader.bind('UploadComplete', function(up, files) {
__Files = 0;
__Total = 0;
status;
$('#upl_overlay').fadeOut(250, function() {
if(__Debug !== true) window.location.href = window.location.href;
});
});I'm not sure what's going wrong, since it never shows any error. It just shows the overlay with the progress bar, and doesn't continue. Seems to me that Uploader.start() isn't working, since the UploadProgress event is never called...
Any ideas?
Fabian