JQuery File Upload
aquantum-demo.appspot.com
aquantum-demo.appspot.com
Who wants to write the blog post reviewing and testing them all in various browsers? I will donate $5!
(1) Plugins must be submitted with a list of tags/categories indicating their purpose. For example, a plugin for uploading multiple files might take the tag "uploader". If it has file preview features, it might have the tag "file-preview".
(2) People rating the plugins may add tags. These will be marked specially as rater/community tags.
(3) For a particular tag/category, a rater may arrange plugins in order of preference (preference voting -- see http://selectricity.org/ for an example of a working system).
(4) People looking for a plugin can see how the community rates it in each category compared to other plugins.
And if you believe what the community has to say, this rating system can give you a decent idea of which plugin may best do the job for you.
Unfortunately that news item linked to a blog post and not to the project itself.
valums ajax-upload seemed like it would be the best fit, but I couldn't get a full-screen Drag and Drop target working and had a hard (impossible) time customizing it to behave differently.
Wanted to use uploadify, but as mentioned it didn't work inside a browser with Flash-blocking enabled which turned me off immediately.
I actually wrote an HTML5 DnD + File API tutorial a few months ago: http://www.thebuzzmedia.com/html5-drag-and-drop-and-file-api...
and decided to get down and dirty with the whole process since everything else out there seemed relatively new to the scene anyway. Some things I found out:
1. Opera and Mozilla (thank the gods) seem to behave almost identical to each other... at least with the HTML5 DnD behavior/events and File API functionality.
2. Safari 5 (on Win 7) doesn't seem to understand Drag and Dropped native elements at all. I also scrubbed through the Apple HTML5 site and found no mention of support for the File API anywhere... so even if DnD was made to work, it wouldn't know what to do with the resources.
TIP: There is a great tutorial from 2009 online, and seems to be for Safari only, where you can hack the styling of an <input type="file"> dialog and MAKE it a drop target while hiding the default file box here: http://www.borismus.com/wp-content/uploads/2009/02/drag_drop...
3. Opera, as much credit as it gets for being so great, doesn't seem to want to have anything to do with some of these native HTML5 APIs -- I believe I read somewhere (this has all become a blur) that they are sitting out from these 2 APIs until the dust finishes settling... probably the smart move, but still annoying my app won't work in their browser.
4. IE 8/9... what can I say. I don't think I expected any of this to work, and probably plan on a Flash-fallback for IE only as some longer term solution, but damn, I sort of hoped it would have.
5. There is a massive post on all the things wrong with the HTML5 DnD API at quirksblog that made me want to give up HTML5 programming and go back to embedded Applets: http://www.quirksmode.org/blog/archives/2009/09/the_html5_dr...
My point being (12 paragraphs later) that from a week of working on this problem there doesn't seem to be a sure-fire solution out there yet for someone wanting to go the "pure HTML5" route... there are some awesome starts to it as linked below, and all the JavaScript from imgscalr.com is heavily commented if you want to take a look at it, but it seems we are still a far way away from some drop-in/jack-of-all-DnD-upload experience that we were hoping for.
Made me realize HTML5, at least in the aspects I'm most interested in, is still a long way away from giving me exactly what I need.
I really appreciate that this doesn't require Flash as Uploadify does. Very cool, I'm probably going to see if we can get this in our project - multifile upload is an important story coming up next week!
Uploadify uses Flash's multifile upload whereas the submission uses the new File API (I believe, I'm guessing, I haven't looked at the source)