cloudinary icon indicating copy to clipboard operation
cloudinary copied to clipboard

Upload of Dropped Image

Open mizdflop opened this issue 11 years ago • 4 comments

Would love to see an example of using this package to upload images dropped on an HTML element.

Thanks for the package. Huge time saver.

mizdflop avatar Sep 07 '14 14:09 mizdflop

Like drag-drop? I'm thinking about adding something to simplify preview right now but for drag drop you would have to do something similar to what is described here: http://www.html5rocks.com/en/tutorials/file/dndfiles/

Lepozepo avatar Sep 07 '14 18:09 Lepozepo

Yeah, I got it working by making small changes to your controllers.js file -- the c_upload event. I look for a drop event, and if it is a drop, look for the file in e.originalEvent.dataTransfer.files. thanks.

mizdflop avatar Sep 07 '14 23:09 mizdflop

I'm not much of a coder, so I don't know if this is of any interest, but here's the change I made. It's sufficient for the prototype I'm creating.

    'change input[type=file], drop .testDrop': function (e,helper) {
        var files = [];
        if(e.type==="drop"){
            e.preventDefault();
            files = e.originalEvent.dataTransfer.files;
        } else {
            files = e.currentTarget.files;
        }

The rest of the method is the same.

mizdflop avatar Sep 08 '14 00:09 mizdflop

Cool, yeah, I'm going to revamp all of this project just like I did with the S3 project. It'll make it more flexible for working with things like that. :)

Lepozepo avatar Sep 08 '14 01:09 Lepozepo