Reorder Queue

Drag to reorder files in the upload queue before uploading. Uses autoUpload: false so you can arrange files, then click Upload.

var uploader = new MultipleUpload(document.getElementById('demo-reorder'), {
 uploadUrl: '/api/upload',
 multiple: true,
 autoUpload: false,
 onSelect: function(files) {
 var list = document.getElementById('reorder-list');
 document.getElementById('reorder-upload-btn').style.display = '';
 list.innerHTML = '';
 files.forEach(function(f) {
 var item = document.createElement('div');
 item.className = 'reorder-item';
 item.draggable = true;
 item.innerHTML = '<span class="handle"></span>' +
 '<span class="name">' + f.name + '</span>' +
 '<span class="size">' + MultipleUpload.formatSize(f.size) + '</span>';
 list.appendChild(item);
 });
 }
});

document.getElementById('reorder-upload-btn').addEventListener('click', function() {
 uploader.upload();
});