Event Log
Complete event log showing every callback firing with timestamps. Watch the log as you upload files.
Drag & drop files here
Events will appear here...
var uploader = new MultipleUpload(el, {
uploadUrl: '/api/upload',
onSelect: function(files) { log('onSelect: ' + files.length + ' file(s)'); },
onFileAdded: function(task) { log('onFileAdded: ' + task.name); },
onQueueRemove: function(task) { log('onQueueRemove: ' + task.name); },
onUploadStart: function() { log('onUploadStart'); },
onTaskStart: function(task) { log('onTaskStart: ' + task.name); },
onTaskProgress: function(task, pct) { log('onTaskProgress: ' + task.name + ' ' + pct + '%'); },
onTaskComplete: function(task) { log('onTaskComplete: ' + task.name); },
onTaskError: function(task, err) { log('onTaskError: ' + task.name); },
onUploadComplete:function() { log('onUploadComplete'); },
onDragEnter: function() { log('onDragEnter'); },
onDragLeave: function() { log('onDragLeave'); },
onDrop: function(files) { log('onDrop: ' + files.length + ' file(s)'); }
});
Watching the sequence
A running log of the callbacks as they fire, which is the fastest way to understand the order things happen in — and the fastest way to work out which hook you should be listening to for a particular job.
A useful thing to keep in your own app
A debug log of upload events, switchable on, pays for itself the first time a customer reports that uploads “sometimes fail”. The events carry the file, the sizes and the failure reason, which is most of what a support conversation otherwise has to guess at.