From 6c062fb31206c32646d5d86bdd454dd6901e2a71 Mon Sep 17 00:00:00 2001 From: Bryan Housel Date: Sat, 28 Jan 2017 15:51:23 -0500 Subject: [PATCH] WIP: improve edge to support diagonal nudges, redraws on nudge (working on #3594 today) --- modules/modes/drag_node.js | 80 ++++++++++++++++++++++++-------------- 1 file changed, 51 insertions(+), 29 deletions(-) diff --git a/modules/modes/drag_node.js b/modules/modes/drag_node.js index 575df3a05..01a290500 100644 --- a/modules/modes/drag_node.js +++ b/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;