All Events
Log every MultipleUpload event to a console div. Useful for debugging and understanding the event lifecycle.
Event Log
var log = document.getElementById('event-log');
function logEvent(name, detail) {
var time = new Date().toLocaleTimeString();
var msg = document.createElement('div');
msg.innerHTML = '<span style="color:#22d3ee">' + time + '</span> ' +
'<span style="color:#f59e0b">' + name + '</span> ' +
(detail || '');
log.appendChild(msg);
log.scrollTop = log.scrollHeight;
}
new MultipleUpload(document.getElementById('demo-all-events'), {
uploadUrl: '/api/upload',
multiple: true,
onInit: function() { logEvent('onInit'); },
onSelect: function(files) {
logEvent('onSelect', files.length + ' file(s)');
},
onTaskStart: function(task) { logEvent('onTaskStart', task.fileName); },
onTaskProgress: function(task) {
logEvent('onTaskProgress', task.fileName + ' ' + Math.round(task.progress) + '%');
},
onTaskComplete: function(task, result) {
logEvent('onTaskComplete', task.fileName);
},
onTaskError: function(task, error) {
logEvent('onTaskError', task.fileName + ': ' + error);
},
onProgress: function(progress) {
logEvent('onProgress', Math.round(progress.percent) + '%');
},
onComplete: function(files) {
logEvent('onComplete', files.length + ' file(s) done');
},
onChange: function(files) {
logEvent('onChange', files.length + ' completed file(s)');
},
onError: function(msg) { logEvent('onError', msg); }
});