Fix and polish drag-and-drop on Firefox and Chrome.

Review Request #2580 — Created Sept. 5, 2011 and submitted


Review Board


Fix and polish drag-and-drop on Firefox and Chrome.

Drag-and-drop had some issues due to how we handled the various events.
HTML5 drag events are a bit strange and don't act as one would expect, mostly
because of legacy IE reasons. You can't easily determine through the event
if the dragleave was due to leaving the window. In the case of Firefox 4+,
dragleave won't even fire if leaving a window.

The code is now simplified to only listen for dragleave on the drop indicator
overlay. If we get it, we compare the coordinates for where the leave took
place. Generally, this will be 0 if we exit, with the exception of the
right-hand-side scrollbar, where we need to compare with the page width. Using
this information, we can know with more certainty that the user dragged outside
the browser.

Firefox will still be stuck with the drag screen, but the workaround there is
to listen for mouse movement over the drop indicator. If that indicator is
on the screen, the only way mouse movement will be recorded is if a drop isn't
in progress. We schedule a drag exit in this case.

This also adds a nice fadeout instead of an immediate removal of the indicator.
Tested with Firefox 6 and Chrome. The drag events now work about as well as we
can hope. I've uploaded screenshots and file attachments.
  1. Ship It!
Review request changed