Angry Monkeys

I’m pretty happy with plupload for all my multi-upload needs. One thing that seems to be missing “out of the box”, is the ability to limit the number of queued files. It is possible, with a little event wrangling, to force plupload into allowing only a single upload.

The first thing you need to do is disable plupload’s “multi_selection” setting.

var uploader = new plupload.Uploader({
runtimes: 'gears,flash,silverlight,browserplus,html5',
multi_selection: false,
...
...
});

An important thing to note here. This doesn’t prevent queuing of multiple files, it only prevents multiple SELECTION of files. There are a few options to preventing queuing of multiple files. The one I’ve used below works for my needs, but there are other options.


uploader.bind('QueueChanged', function(up) {
if ( up.files.length > 0 && uploader.state != 2) {
uploader.start();
}
});

Basically, this is a bit of a cheat. Whenever we select a file, we check that we’re not already uploading and then automatically start the upload. At this point you could then choose to disable the uploader altogether, or in our case, display an icon for the uploaded file and give the user the option to replace it. I’ve seen other people use the event “FileAdded”, but this event looks like it should really be called “BeforeFileAdded”, as the newly added file doesn’t appear to be added to the “files” collection until after the event has run.

It’s worth noting that this method is really only appropriate if you’re using your own custom upload interface. Obviously the queuechanged event is triggered when adding AND removing files. Not to mention that our little cheat doesn’t actually clear the queue (although there is nothing stopping you doing that).

Comments(1)