Mouse position changes restricted area about interact.js

[taye]

Yeah, I've been meaning to add an option for this. For now, here's an example of how to do it manually: http://plnkr.co/edit/cFVVS63pVIw3zyP5VEzS

.on('dragstart', function (event) {
  var
    containerRect = interact.getElementRect(event.target.parentNode),
    elementRect = interact.getElementRect(event.target);

  var restrictRect = {
    left: containerRect.left + (event.pageX - elementRect.left),
    top : containerRect.top  + (event.pageY - elementRect.top ),

    right : containerRect.right  - (elementRect.right  - event.pageX),
    bottom: containerRect.bottom - (elementRect.bottom - event.pageY)
  };

  interact('.compare-left-item').restrict({
    drag: restrictRect
  });

In this case, the intended restriction, containerRect, is the rect of the parent element. When a drag starts, the restriction is recalculated to account for the position of the mouse and the rect of the target element.

[dexusnl]

Thanks!
And for your quick reply to.

I put the code in the onstart event from interact.draggable itself instead of separately.
Works like a charm.

[taye]

Excellent! I'll leave this issue open until a solution is built into interact.js.