Drag point changes after initial drag

Is there a reason to remove the initial drag distance in function _renderMovement (and never add it back)? I think this is a bug. To illustrate, position the mouse pointer over a defined point in the image, click and drag quickly. The mouse pointer should remain over the initial click point. But it will change by the amount subtracted below:

            if(_isFirstMove) {
                _isFirstMove = false;

                // subtract drag distance that was used during the detection direction  

                if( Math.abs(delta.x) >= DIRECTION_CHECK_OFFSET) {
                    delta.x -= _currentPoints[0].x - _startPoint.x;
                }

                if( Math.abs(delta.y) >= DIRECTION_CHECK_OFFSET) {
                    delta.y -= _currentPoints[0].y - _startPoint.y;
                }
            }

When panning an image quickly it adds inertia to the drag that is never recovered.

[tomdav999]

OK, after playing around with this on touch vs. non-touch devices I think I better understand the issue.

First of all, the concept of an initial drag threshold is only pertinent to touch devices. We need to differentiate between a drag and a tap, because fingers are not precicse. If the user is using a mouse or precision pointer we shouldn’t apply an initial drag threshold (because mice are precise).

Also, to the extent we choose to apply a minimum initial drag threshold, we should subtract the initial drag (less than the threshold) for smoothness. This is what the code is trying to do, but it actually isn’t smooth because it only subtracts the initial drag in ONE direction. For smoothness it should subtract the initial drag in BOTH directions. Also, the initial drag threshold should be checked against the distance dragged NOT the direction dragged. Remember, the goal is differentiate between a finger tap and a drag, not force the user to drag in any one direction! Note the current code makes it very difficult to pan at an angle (when zoomed in).

Here is the correct way (in my humble opinion) 😃 to handle this.

//  if(Math.abs(diff)j >= DIRECTION_CHECK_OFFSET) {
//
// replace the line commented above with this code (so that the user can drag at any angle when zoomed in):
//
    DIRECTION_CHECK_OFFSET = Math.abs(DIRECTION_CHECK_OFFSET);
    if(e.type.indexOf('mouse') > -1 || e.pointerType && e.pointerType.indexOf('mouse') > -1) {
        DIRECTION_CHECK_OFFSET = -DIRECTION_CHECK_OFFSET; // do not appply threhold for mice
    }
    var dist = Math.sqrt(Math.pow(touchesList[0].x - _currPoint.x, 2) + Math.pow(touchesList[0].y - _currPoint.y, 2));
    if(dist >= DIRECTION_CHECK_OFFSET) { // we have a drag not a tap or a click
.
.
.
if(_isFirstMove) {
    _isFirstMove = false;

    // subtract drag distance that was used during the detection direction
//  if( Math.abs(delta.x) >= DIRECTION_CHECK_OFFSET) {
//      delta.x -= _currentPoints[0].x - _startPoint.x;
//  }
//  if( Math.abs(delta.y) >= DIRECTION_CHECK_OFFSET) {
//      delta.y -= _currentPoints[0].y - _startPoint.y;
//  }
//
// replace the code commented above with this code (so that drag is smooth when dragging at an angle):
//
    if(DIRECTION_CHECK_OFFSET > 0) {
        delta.x -= _currentPoints[0].x - _startPoint.x;
        delta.y -= _currentPoints[0].y - _startPoint.y;
    }

[dimsemenov]

I agree with most of your statements. The fix will be included in the next major update. Thanks!