If an element no longer needs to be dragged, could it be "unregistered" and removed from the callbacks array? This would help save memory especially in single page apps where several views could potentially be shown or rerendered.

const instance = dragmove(...)
instance.unregister()

// or

const id = dragmove(...)
enddragmove(id)

Hi,
Using webpack in development (with watch without build and finalization) everything works perfectly. But when I go to build I get this error from the browser: TypeError: can't access property "addEventListener", (void 0) is undefined .
I use Laravel Mix for build the assets. I paste here the lines of code I use, maybe I wrote something wrong.

(function () {
  'use strict';

  document.addEventListener('DOMContentLoaded', handleDOMContentLoaded);

  function handleDOMContentLoaded() {
    document.querySelectorAll('.collage__item').forEach(function (el) {
      dragmove(el, el);
    })
  }
})();

Hi, can you add extra feature to make element drag only inside a specific element..

Thanks

On line 49,

  document.addEventListener(_isTouch ? "touchend" : "mouseup", function() {
   /* ... */
  }

I think this should be target instead of document, no? This way, only the functions specific to an element get fired (not for every onEnd ever registered).

On line 53,

if (onEnd && e.target === handler) {
  onEnd(target, parseInt(target.style.left), parseInt(target.style.top));
}

If the handler has child nodes covering it, e.target will end up being the child node you clicked on, not the handler itself, so onEnd won't run. One way to replicate this bug is through the example in docs/index.html by changing it like so:

Add a span element to one of the handlers:

<div id="test" class="parent" data-drag-bound="true">
  <div class="handle" style=""><span>Drag here</span></div>
</div>

and make sure .handle has a minimum height, like say 24px for this example:

.handle {
  background: #888;
  cursor: move;
  width: 130px;
  min-height: 24px;
  color: #fff;
  padding: 10px;
}

Then try dragging the element outside the view by clicking on its text first, and you'll see that the snapping won't happen.

I was working on adding buttons and menus in the handler nodes in my project, which is how I found the bug. The dragging works perfectly fine, just to be clear. It's just onEnd that's the issue.

Nevermind.

I love this package! Thanks!

Layers would be fun.