Strange drag + release behavior for button

[MartinSStewart]

When opening https://elm-designer.passiomatic.com/ for the first time (or after I clear local storage) if I click and drag a primary button onto the page, and then drag the primary button after I've placed it, releasing it will cause the viewport to scroll really far down and to the right.

Browser: Firefox
OS: Windows 10

[passiomatic]

As you have written on Slack the bug is always reproducible if one releases the mouse over part of a page, while it always works fine if one releases outside of a page.

The underlying issue is that drop event offsetX and offsetY values are set differently if user drops the page on a empty area of the workspace or not (this works the same with other mouse events too). In detail:

1. Blank area: the event offset values refer to the top left corner of the workspace - so we can use them directly to abs. position the page. This the ideal scenario that works nowadays.
2. Over another page: the event offset values now refer to the top left corner on the overlapped page and this clearly cannot work. So we need a way to sum the offsets and come up with the final values. The issue is more complex though: if the overlapped page contains children these needs to be taken into account, because the offset may be calculated from one of them.

In the second case I guess we can track event.currentTarget and event.target and see if they are different.

Seems likes others are having the same issue norpan/elm-html5-drag-drop#24