NicolasCARPi / dropzone

Dropzone is an easy to use drag'n'drop library. It supports image previews and shows nice progress bars.
http://www.dropzone.dev/js
Other
58 stars 4 forks source link

How to show dropzone on drag into window? #5

Closed mattpilott closed 5 months ago

mattpilott commented 5 months ago

I have a full screen dropzone but I cant see how to display it only when a file is being dragged over the window. How can i do this?

User sees app ui User drags file from desktop into browser window Dropzone appears User drops file Dropzone disappears File upload progress is shown somewhere in app ui

Thanks!

NicolasCARPi commented 5 months ago

Hello,

You can initialize dropzone after detecting an event such as dragenter in the screen, see: https://developer.mozilla.org/en-US/docs/Web/API/HTML_Drag_and_Drop_API.

Then use events to detect when a file has been added: https://docs.dropzone.dev/configuration/events

Hope that helps.

Of course, how exactly you achieve that workflow will depend on your app and is outside the scope of this issue tracker, and as such I'm closing this issue. Do not hesitate to open a new issue or comment here if you feel something is missing in the doc or if a feature isn't working as expected/documented.