Dropzone CSS gets removed
Closed this issue · 2 comments
This might be more of a question/feature suggestion than an issue.
My goal with my app is to have pretty much the entire screen support droppable file uploads, so I set for-dropzone to one of the top-level divs. This works fine, but I found that ember-plupload kind of expects free reign over the dropzone, and will add and remove styles from it and its descendants. In previous versions of ember (1.13.8, I believe) I'd occasionally find that I couldn't click on anything within the dropzone after the drop had completed due to the pointerEvents style persisting. In 1.13.10, however, I find that by dragging a file on and off my app over and over I can slowly remove most of the styles from the app.
(Chrome 46.0 Mac)
Part two, the question, is: should I be using a separate dropzone that doesn't have anything in it? If so, how can I get that dropzone to cover the screen, but be hidden when not in use? I could imagine a nested div where the outer div was part of my app and received the event while the inner div was the one that got its styles changed, but am not sure how to do that with the current setup. Is this a supported use case?
I ended up extending the pl-upload component and overriding activateDropzone and deactivateDropzone to set a class. It works fine for my app but isn't really generalizable.
Weird. Looks like something here https://github.com/tim-evans/ember-plupload/blob/master/addon/components/pl-uploader.js#L215 is mucking with it, which in turn calls https://github.com/tim-evans/dinosheets. This adds a dynamic stylesheet, adding and removing styles dynamically (just pointer-events: none for all ancestors of the dropzone).
You should be able to use whatever element you'd like in your application. I've tried to make it so it doesn't muck with the element at all, but it seems that was a failure 😓