diff --git a/modules/behavior/drag.js b/modules/behavior/drag.js index 93d42cfb3..879ef55dc 100644 --- a/modules/behavior/drag.js +++ b/modules/behavior/drag.js @@ -3,14 +3,13 @@ import { dispatch as d3_dispatch } from 'd3-dispatch'; import { customEvent as d3_customEvent, event as d3_event, - mouse as d3_mouse, select as d3_select, selection as d3_selection } from 'd3-selection'; import { osmNote } from '../osm'; import { utilRebind } from '../util/rebind'; -import { utilPrefixCSSProperty, utilPrefixDOMProperty } from '../util'; +import { utilFastMouse, utilPrefixCSSProperty, utilPrefixDOMProperty } from '../util'; /* @@ -68,9 +67,12 @@ export function behaviorDrag() { _target = this; _event = eventOf(_target, arguments); + // only force reflow once per drag + var pointerLocGetter = utilFastMouse(_surface || _target.parentNode); + var eventTarget = d3_event.target; var offset; - var startOrigin = point(); + var startOrigin = pointerLocGetter(d3_event); var started = false; var selectEnable = d3_event_userSelectSuppress(); @@ -88,14 +90,8 @@ export function behaviorDrag() { d3_event.stopPropagation(); - function point() { - var p = _surface || _target.parentNode; - return d3_mouse(p); - } - - function pointermove() { - var p = point(); + var p = pointerLocGetter(d3_event); var dx = p[0] - startOrigin[0]; var dy = p[1] - startOrigin[1]; diff --git a/modules/behavior/draw.js b/modules/behavior/draw.js index 7a5afb0f2..4e0de520b 100644 --- a/modules/behavior/draw.js +++ b/modules/behavior/draw.js @@ -2,7 +2,6 @@ import { dispatch as d3_dispatch } from 'd3-dispatch'; import { event as d3_event, - mouse as d3_mouse, select as d3_select } from 'd3-selection'; @@ -10,7 +9,7 @@ import { behaviorEdit } from './edit'; import { behaviorHover } from './hover'; import { behaviorTail } from './tail'; import { geoChooseEdge, geoVecLength } from '../geo'; -import { utilKeybinding, utilRebind } from '../util'; +import { utilFastMouse, utilKeybinding, utilRebind } from '../util'; var _usedTails = {}; var _disableSpace = false; @@ -61,19 +60,17 @@ export function behaviorDraw(context) { function pointerdown() { - function point() { - return d3_mouse(context.container().node()); - } + var pointerLocGetter = utilFastMouse(this); var element = d3_select(this); var t1 = +new Date(); - var p1 = point(); + var p1 = pointerLocGetter(d3_event); element.on(_pointerPrefix + 'move.draw', null); d3_select(window).on(_pointerPrefix + 'up.draw', function() { var t2 = +new Date(); - var p2 = point(); + var p2 = pointerLocGetter(d3_event); var dist = geoVecLength(p1, p2); element.on(_pointerPrefix + 'move.draw', pointermove); @@ -92,7 +89,7 @@ export function behaviorDraw(context) { d3_select(window).on('click.draw-block', null); }, 500); - click(d3_mouse(context.surface().node())); + click(p2); } }, true); } diff --git a/modules/behavior/select.js b/modules/behavior/select.js index 69722bee3..36e45f73d 100644 --- a/modules/behavior/select.js +++ b/modules/behavior/select.js @@ -1,4 +1,4 @@ -import { event as d3_event, mouse as d3_mouse, select as d3_select } from 'd3-selection'; +import { event as d3_event, select as d3_select } from 'd3-selection'; import { geoVecLength } from '../geo'; import { modeBrowse } from '../modes/browse'; @@ -8,6 +8,7 @@ import { modeSelectNote } from '../modes/select_note'; import { modeSelectError } from '../modes/select_error'; import { osmEntity, osmNote, QAItem } from '../osm'; import { utilArrayIdentical } from '../util/array'; +import { utilFastMouse } from '../util/util'; export function behaviorSelect(context) { @@ -22,7 +23,7 @@ export function behaviorSelect(context) { var _pointerPrefix = 'PointerEvent' in window ? 'pointer' : 'mouse'; function point() { - return d3_mouse(context.container().node()); + return utilFastMouse(context.container().node())(d3_event); } diff --git a/modules/util/double_up.js b/modules/util/double_up.js index 46aff0cd6..ecd4be03f 100644 --- a/modules/util/double_up.js +++ b/modules/util/double_up.js @@ -1,6 +1,7 @@ import { dispatch as d3_dispatch } from 'd3-dispatch'; -import { event as d3_event, mouse as d3_mouse } from 'd3-selection'; +import { event as d3_event } from 'd3-selection'; +import { utilFastMouse } from './util'; import { utilRebind } from './rebind'; import { geoVecLength } from '../geo/vector'; @@ -26,8 +27,7 @@ export function utilDoubleUp() { // ignore right-click if (d3_event.ctrlKey || d3_event.button === 2) return; - // d3_mouse works since pointer events inherit from mouse events - var loc = d3_mouse(this); + var loc = utilFastMouse(this)(d3_event); if (_pointer && !pointerIsValidFor(loc)) { // if this pointer is no longer valid, clear it so another can be started @@ -53,7 +53,7 @@ export function utilDoubleUp() { _pointer.upCount += 1; if (_pointer.upCount === 2) { // double up! - var loc = d3_mouse(this); + var loc = utilFastMouse(this)(d3_event); if (pointerIsValidFor(loc)) { dispatch.call('doubleUp', this, loc); } @@ -73,7 +73,7 @@ export function utilDoubleUp() { // fallback to dblclick selection .on('dblclick.doubleUp', function() { - dispatch.call('doubleUp', this, d3_mouse(this)); + dispatch.call('doubleUp', this, utilFastMouse(this)(d3_event)); }); } } diff --git a/modules/util/zoom_pan.js b/modules/util/zoom_pan.js index 9de01d404..3053bdcc2 100644 --- a/modules/util/zoom_pan.js +++ b/modules/util/zoom_pan.js @@ -3,12 +3,12 @@ import { dispatch as d3_dispatch } from 'd3-dispatch'; import { interpolateZoom } from 'd3-interpolate'; -import { event as d3_event, customEvent as d3_customEvent, mouse as d3_mouse } from 'd3-selection'; +import { event as d3_event, customEvent as d3_customEvent } from 'd3-selection'; import { interrupt as d3_interrupt } from 'd3-transition'; import ZoomEvent from '../../node_modules/d3-zoom/src/event.js'; import { Transform, identity } from '../../node_modules/d3-zoom/src/transform.js'; -import { utilFunctor } from './util'; +import { utilFastMouse, utilFunctor } from './util'; // Ignore right-click, since that should open the context menu. function defaultFilter() { @@ -54,10 +54,9 @@ export function utilZoomPan() { wheelDelta = defaultWheelDelta, scaleExtent = [0, Infinity], translateExtent = [[-Infinity, -Infinity], [Infinity, Infinity]], - duration = 250, interpolate = interpolateZoom, listeners = d3_dispatch('start', 'zoom', 'end'), - wheelDelay = 150; + _wheelDelay = 150; function zoom(selection) { selection @@ -205,7 +204,7 @@ export function utilZoomPan() { var g = gesture(this, arguments), t = this.__zoom, k = Math.max(scaleExtent[0], Math.min(scaleExtent[1], t.k * Math.pow(2, wheelDelta.apply(this, arguments)))), - p = d3_mouse(this); + p = utilFastMouse(this)(d3_event); // If the mouse is in the same location as before, reuse it. // If there were recent wheel events, reset the wheel idle timeout. @@ -228,7 +227,7 @@ export function utilZoomPan() { d3_event.preventDefault(); d3_event.stopImmediatePropagation(); - g.wheel = setTimeout(wheelidled, wheelDelay); + g.wheel = setTimeout(wheelidled, _wheelDelay); g.zoom('mouse', constrain(translate(scale(t, k), g.mouse[0], g.mouse[1]), g.extent, translateExtent)); function wheelidled() { @@ -237,18 +236,20 @@ export function utilZoomPan() { } } - var downPointerIDs = new Set(); + var _downPointerIDs = new Set(); + var _pointerLocGetter; function pointerdown() { - downPointerIDs.add(d3_event.pointerId); + _downPointerIDs.add(d3_event.pointerId); if (!filter.apply(this, arguments)) return; - var g = gesture(this, arguments, downPointerIDs.size === 1); + var g = gesture(this, arguments, _downPointerIDs.size === 1); var started; d3_event.stopImmediatePropagation(); - var loc = d3_mouse(this); + _pointerLocGetter = utilFastMouse(this); + var loc = _pointerLocGetter(d3_event); var p = [loc, this.__zoom.invert(loc), d3_event.pointerId]; if (!g.pointer0) { g.pointer0 = p; @@ -275,8 +276,8 @@ export function utilZoomPan() { if ((isPointer0 || isPointer1) && 'buttons' in d3_event && !d3_event.buttons) { // The pointer went up without ending the gesture somehow, e.g. // a down mouse was moved off the map and released. End it here. - if (g.pointer0) downPointerIDs.delete(g.pointer0[2]); - if (g.pointer1) downPointerIDs.delete(g.pointer1[2]); + if (g.pointer0) _downPointerIDs.delete(g.pointer0[2]); + if (g.pointer1) _downPointerIDs.delete(g.pointer1[2]); g.end(); return; } @@ -284,7 +285,7 @@ export function utilZoomPan() { d3_event.preventDefault(); d3_event.stopImmediatePropagation(); - var loc = d3_mouse(this); + var loc = _pointerLocGetter(d3_event); var t, p, l; if (isPointer0) g.pointer0[0] = loc; @@ -308,7 +309,7 @@ export function utilZoomPan() { } function pointerup() { - downPointerIDs.delete(d3_event.pointerId); + _downPointerIDs.delete(d3_event.pointerId); if (!this.__zooming) return; @@ -353,10 +354,6 @@ export function utilZoomPan() { return arguments.length ? (constrain = _, zoom) : constrain; }; - zoom.duration = function(_) { - return arguments.length ? (duration = +_, zoom) : duration; - }; - zoom.interpolate = function(_) { return arguments.length ? (interpolate = _, zoom) : interpolate; };