WIP: improve edge to support diagonal nudges, redraws on nudge

(working on #3594 today)

modules/modes/drag_node.js

@@ -34,25 +34,43 @@ export function modeDragNode(context) {
         activeIDs,
         wasMidpoint,
         isCancelled,
+        lastLoc,
         selectedIDs = [],
         hover = behaviorHover(context).altDisables(true).on('hover', context.ui().sidebar.hover),
         edit = behaviorEdit(context);
 
 
+    function vecSub(a, b) {
+        return [a[0] - b[0], a[1] - b[1]];
+    }
+
     function edge(point, size) {
-        var pad = [30, 100, 30, 100];
-        if (point[0] > size[0] - pad[0]) return [-10, 0];
-        else if (point[0] < pad[2]) return [10, 0];
-        else if (point[1] > size[1] - pad[1]) return [0, -10];
-        else if (point[1] < pad[3]) return [0, 10];
-        return null;
+        var pad = [30, 100, 30, 100],
+            x = 0,
+            y = 0;
+
+        if (point[0] > size[0] - pad[0])
+            x = -10;
+        if (point[0] < pad[2])
+            x = 10;
+        if (point[1] > size[1] - pad[1])
+            y = -10;
+        if (point[1] < pad[3])
+            y = 10;
+
+        if (x || y) {
+            return [x, y];
+        } else {
+            return null;
+        }
     }
 
 
-    function startNudge(nudge) {
+    function startNudge(entity, nudge) {
         if (nudgeInterval) window.clearInterval(nudgeInterval);
         nudgeInterval = window.setInterval(function() {
             context.pan(nudge);
+            doMove(entity, nudge);
         }, 50);
     }
 
@@ -117,36 +135,28 @@ export function modeDragNode(context) {
 
 
     function datum() {
-        if (d3.event.sourceEvent.altKey) {
+        var event = d3.event && d3.event.sourceEvent;
+        if (!event || event.altKey) {
             return {};
+        } else {
+            return event.target.__data__ || {};
         }
-
-        return d3.event.sourceEvent.target.__data__ || {};
     }
 
 
-    // via https://gist.github.com/shawnbot/4166283
-    function childOf(p, c) {
-        if (p === c) return false;
-        while (c && c !== p) c = c.parentNode;
-        return c === p;
-    }
+    function doMove(entity, nudge) {
+        nudge = nudge || [0, 0];
 
+        var currPoint = (d3.event && d3.event.point) || context.projection(lastLoc),
+            currMouse = vecSub(currPoint, nudge),
+            loc = context.projection.invert(currMouse),
+            d = datum();
 
-    function move(entity) {
-        if (isCancelled) return;
-        d3.event.sourceEvent.stopPropagation();
+console.log('event.point = ' + (d3.event && d3.event.point) +
+    ', currMouse = ' + currMouse +
+    ', context.mouse = ' + context.mouse()
+);
 
-        var nudge = childOf(context.container().node(),
-            d3.event.sourceEvent.toElement) &&
-            edge(d3.event.point, context.map().dimensions());
-
-        if (nudge) startNudge(nudge);
-        else stopNudge();
-
-        var loc = context.projection.invert(d3.event.point);
-
-        var d = datum();
         if (d.type === 'node' && d.id !== entity.id) {
             loc = d.loc;
         } else if (d.type === 'way' && !d3.select(d3.event.sourceEvent.target).classed('fill')) {
@@ -160,6 +170,18 @@ export function modeDragNode(context) {
     }
 
 
+    function move(entity) {
+        if (isCancelled) return;
+        d3.event.sourceEvent.stopPropagation();
+        lastLoc = context.projection.invert(d3.event.point);
+
+        doMove(entity);
+        var nudge = edge(d3.event.point, context.map().dimensions());
+        if (nudge) startNudge(entity, nudge);
+        else stopNudge();
+    }
+
+
     function end(entity) {
         if (isCancelled) return;