Drupal: Drag and Drop file upload demo.
Edit: I have finally submitted the module to Drupal.org. For more information, read my latest blog post or head to the modules project page.
One thing I always wanted was the ability to drag an image from my desktop, drop it into a textarea on a web page and have the image uploaded and inserted into the textarea. Unfortunately, there really hasn't been any way to do this without the use of Java... until now.
A week ago I came across SwellJS, a new JavaScript library that also has that goal in mind, and not only have they got that goal in mind, but they have somewhat achieved the goal. On the 28th of July 2009 they released a demo allowing you do exactly that - http://playground.justswell.org/drag-and-drop-file-upload.html.
Inspired by the work of SwellJS, I put together a little proof of concept module to see what could be done getting the functionality into Drupal. While the SwellJS demo was very impressive, it's use of a Dropzone wasn't exactly what I was after.
Below is a quick video demonstrating what has been achieved so far:
Unfortunately, with the good there is also bad, the method used to achieve the drag and drop upload is only available in Chrome and Safari 4 and due to conflicts with the SwellJS library and jQuery it will only work in Drupal 7, which is still in development.
Deciphered.RSS
Whoa,
that is really cool stuff. Starting to imagine the new user experience and whoaaa.
On the other hand (as a pretty non-code guy): Can this create security problems not easily avoidable?
Hi dddave,
I honestly don't believe that security will be an issue. Uploading is still handled by the Drupal code Upload module, so it will still handle security.
Is there any public code for your drupal version?
I would be very interested in testing it out
Hi jackinloadup,
There isn't a publicly available version yet as I'm still pondering how to proceed with the module. Plus, even when I do put out a release, there will not be a stable release as it's currently only available for Drupal 7 which does not yet have a stable release.
I will, however, let everyone know when there is build available for testing via this Blog and Twitter (@Decipher).
Great proof of concept. It is people like you that push the community forward. I am excited to see this implemented one day. I use Safari 4 so I am ready.. hehe!!
2ndMile,
Thank you for your kind words, but I can't take all the credit, the guys at SwellJS did most of the hard work, I just made there work work for my needs :)