all files / lib/navigation/movecanvas/ MoveCanvas.js

10% Statements 3/30
0% Branches 0/16
16.67% Functions 1/6
10% Lines 3/30
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111                                                                                                                                                                                                                       
import {
  set as cursorSet,
  unset as cursorUnset
} from '../../util/Cursor';
 
import {
  install as installClickTrap
} from '../../util/ClickTrap';
 
import {
  delta as deltaPos
} from '../../util/PositionUtil';
 
import {
  event as domEvent,
  closest as domClosest
} from 'min-dom';
 
import {
  toPoint
} from '../../util/Event';
 
 
function length(point) {
  return Math.sqrt(Math.pow(point.x, 2) + Math.pow(point.y, 2));
}
 
var THRESHOLD = 15;
 
 
export default function MoveCanvas(eventBus, canvas) {
 
  var context;
 
  function handleMove(event) {
 
    var start = context.start,
        position = toPoint(event),
        delta = deltaPos(position, start);
 
    if (!context.dragging && length(delta) > THRESHOLD) {
      context.dragging = true;
 
      installClickTrap(eventBus);
 
      cursorSet('grab');
    }
 
    if (context.dragging) {
 
      var lastPosition = context.last || context.start;
 
      delta = deltaPos(position, lastPosition);
 
      canvas.scroll({
        dx: delta.x,
        dy: delta.y
      });
 
      context.last = position;
    }
 
    // prevent select
    event.preventDefault();
  }
 
 
  function handleEnd(event) {
    domEvent.unbind(document, 'mousemove', handleMove);
    domEvent.unbind(document, 'mouseup', handleEnd);
 
    context = null;
 
    cursorUnset();
  }
 
  function handleStart(event) {
    // event is already handled by '.djs-draggable'
    if (domClosest(event.target, '.djs-draggable')) {
      return;
    }
 
 
    // reject non-left left mouse button or modifier key
    if (event.button || event.ctrlKey || event.shiftKey || event.altKey) {
      return;
    }
 
    context = {
      start: toPoint(event)
    };
 
    domEvent.bind(document, 'mousemove', handleMove);
    domEvent.bind(document, 'mouseup', handleEnd);
 
    // we've handled the event
    return true;
  }
 
  // listen for move on element mouse down;
  // allow others to hook into the event before us though
  // (dragging / element moving will do this)
  eventBus.on('element.mousedown', 500, function(e) {
    return handleStart(e.originalEvent);
  });
 
}
 
 
MoveCanvas.$inject = [ 'eventBus', 'canvas' ];