Esc to cancel (bug - Sticky, cannot let go)

[LukeTOBrien]

Hi there,

I like your library very much and I have read your blog.

The app that I am creating is a scene editor, the user can edit a scene by moving entities arround with their mouse.
I have an issue whereby once I click on a shape then it 'stick' to the mouse cursor and I cannot let it go, so I guess an event is not firing.

I also thourght that pressing the esc key would be a good way to cancel the drag and revert the entity bac to it's origional position.

[extraymond]

I have encounter the same issue if you start drag and get out of the scene object, then you get your cursor back in.
Try to maximize the a-scene object so no underlying object can hijack the needed events.

[LukeTOBrien]

One thing that I didn't mention is that my scene is embedded.
So even though my scene is near-full-screen it is still embedded.
The docs also say:

Use interaction with HTML elements (e.g., buttons, forms) to affect the scene

So perhaps embedded is somehow causing the event not to fire?
Your component is exactly the kind of thing that I need though, perhaps I should do some tinkering?

[extraymond]

@LukeTOBrien Sorry for the long waiting, just came back from holiday. Yes embedded is the culprit.

aframe-mouse-dragndrop/src/index.js

Line 21 in cc7eefe

this.el.addEventListener("click", e => {

Currently, the drop action is detected when the a-scene node detected the click event, which will not happen if you click outside of the a-scene node. One solution is to force fire up the click on the a-scene node manually when clicking on the outside div.