diff --git a/js/ui/handler/box_zoom.js b/js/ui/handler/box_zoom.js index 83663e85302..9d1a47237e7 100644 --- a/js/ui/handler/box_zoom.js +++ b/js/ui/handler/box_zoom.js @@ -5,45 +5,44 @@ const LngLatBounds = require('../../geo/lng_lat_bounds'); const util = require('../../util/util'); const window = require('../../util/window'); -module.exports = BoxZoomHandler; - /** * The `BoxZoomHandler` allows the user to zoom the map to fit within a bounding box. * The bounding box is defined by clicking and holding `shift` while dragging the cursor. * - * @class BoxZoomHandler * @param {Map} map The Mapbox GL JS map to add the handler to. */ -function BoxZoomHandler(map) { - this._map = map; - this._el = map.getCanvasContainer(); - this._container = map.getContainer(); - - util.bindHandlers(this); -} - -BoxZoomHandler.prototype = { - - _enabled: false, - _active: false, +class BoxZoomHandler { + + constructor(map) { + this._map = map; + this._el = map.getCanvasContainer(); + this._container = map.getContainer(); + + util.bindAll([ + '_onMouseDown', + '_onMouseMove', + '_onMouseUp', + '_onKeyDown' + ], this); + } /** * Returns a Boolean indicating whether the "box zoom" interaction is enabled. * * @returns {boolean} `true` if the "box zoom" interaction is enabled. */ - isEnabled: function () { - return this._enabled; - }, + isEnabled() { + return !!this._enabled; + } /** * Returns a Boolean indicating whether the "box zoom" interaction is active, i.e. currently being used. * * @returns {boolean} `true` if the "box zoom" interaction is active. */ - isActive: function () { - return this._active; - }, + isActive() { + return !!this._active; + } /** * Enables the "box zoom" interaction. @@ -51,11 +50,11 @@ BoxZoomHandler.prototype = { * @example * map.boxZoom.enable(); */ - enable: function () { + enable() { if (this.isEnabled()) return; this._el.addEventListener('mousedown', this._onMouseDown, false); this._enabled = true; - }, + } /** * Disables the "box zoom" interaction. @@ -63,13 +62,13 @@ BoxZoomHandler.prototype = { * @example * map.boxZoom.disable(); */ - disable: function () { + disable() { if (!this.isEnabled()) return; this._el.removeEventListener('mousedown', this._onMouseDown); this._enabled = false; - }, + } - _onMouseDown: function (e) { + _onMouseDown(e) { if (!(e.shiftKey && e.button === 0)) return; window.document.addEventListener('mousemove', this._onMouseMove, false); @@ -79,9 +78,9 @@ BoxZoomHandler.prototype = { DOM.disableDrag(); this._startPos = DOM.mousePos(this._el, e); this._active = true; - }, + } - _onMouseMove: function (e) { + _onMouseMove(e) { const p0 = this._startPos, p1 = DOM.mousePos(this._el, e); @@ -100,9 +99,9 @@ BoxZoomHandler.prototype = { this._box.style.width = `${maxX - minX}px`; this._box.style.height = `${maxY - minY}px`; - }, + } - _onMouseUp: function (e) { + _onMouseUp(e) { if (e.button !== 0) return; const p0 = this._startPos, @@ -120,16 +119,16 @@ BoxZoomHandler.prototype = { .fitBounds(bounds, {linear: true}) .fire('boxzoomend', { originalEvent: e, boxZoomBounds: bounds }); } - }, + } - _onKeyDown: function (e) { + _onKeyDown(e) { if (e.keyCode === 27) { this._finish(); this._fireEvent('boxzoomcancel', e); } - }, + } - _finish: function () { + _finish() { this._active = false; window.document.removeEventListener('mousemove', this._onMouseMove, false); @@ -144,12 +143,14 @@ BoxZoomHandler.prototype = { } DOM.enableDrag(); - }, + } - _fireEvent: function (type, e) { + _fireEvent(type, e) { return this._map.fire(type, { originalEvent: e }); } -}; +} + +module.exports = BoxZoomHandler; /** * @typedef {Object} MapBoxZoomEvent diff --git a/js/ui/handler/dblclick_zoom.js b/js/ui/handler/dblclick_zoom.js index 61ba8ebed78..d65eac5dd55 100644 --- a/js/ui/handler/dblclick_zoom.js +++ b/js/ui/handler/dblclick_zoom.js @@ -1,31 +1,25 @@ 'use strict'; -module.exports = DoubleClickZoomHandler; - /** * The `DoubleClickZoomHandler` allows the user to zoom the map at a point by * double clicking. * - * @class DoubleClickZoomHandler * @param {Map} map The Mapbox GL JS map to add the handler to. */ -function DoubleClickZoomHandler(map) { - this._map = map; - this._onDblClick = this._onDblClick.bind(this); -} - -DoubleClickZoomHandler.prototype = { - - _enabled: false, +class DoubleClickZoomHandler { + constructor(map) { + this._map = map; + this._onDblClick = this._onDblClick.bind(this); + } /** * Returns a Boolean indicating whether the "double click to zoom" interaction is enabled. * * @returns {boolean} `true` if the "double click to zoom" interaction is enabled. */ - isEnabled: function () { - return this._enabled; - }, + isEnabled() { + return !!this._enabled; + } /** * Enables the "double click to zoom" interaction. @@ -33,11 +27,11 @@ DoubleClickZoomHandler.prototype = { * @example * map.doubleClickZoom.enable(); */ - enable: function () { + enable() { if (this.isEnabled()) return; this._map.on('dblclick', this._onDblClick); this._enabled = true; - }, + } /** * Disables the "double click to zoom" interaction. @@ -45,17 +39,19 @@ DoubleClickZoomHandler.prototype = { * @example * map.doubleClickZoom.disable(); */ - disable: function () { + disable() { if (!this.isEnabled()) return; this._map.off('dblclick', this._onDblClick); this._enabled = false; - }, + } - _onDblClick: function (e) { + _onDblClick(e) { this._map.zoomTo( this._map.getZoom() + (e.originalEvent.shiftKey ? -1 : 1), {around: e.lngLat}, e ); } -}; +} + +module.exports = DoubleClickZoomHandler; diff --git a/js/ui/handler/drag_pan.js b/js/ui/handler/drag_pan.js index ca8b0a0771f..b2c447b0d70 100644 --- a/js/ui/handler/drag_pan.js +++ b/js/ui/handler/drag_pan.js @@ -4,50 +4,48 @@ const DOM = require('../../util/dom'); const util = require('../../util/util'); const window = require('../../util/window'); -module.exports = DragPanHandler; - const inertiaLinearity = 0.3, inertiaEasing = util.bezier(0, 0, inertiaLinearity, 1), inertiaMaxSpeed = 1400, // px/s inertiaDeceleration = 2500; // px/s^2 - /** * The `DragPanHandler` allows the user to pan the map by clicking and dragging * the cursor. * - * @class DragPanHandler * @param {Map} map The Mapbox GL JS map to add the handler to. */ -function DragPanHandler(map) { - this._map = map; - this._el = map.getCanvasContainer(); - - util.bindHandlers(this); -} - -DragPanHandler.prototype = { - - _enabled: false, - _active: false, +class DragPanHandler { + constructor(map) { + this._map = map; + this._el = map.getCanvasContainer(); + + util.bindAll([ + '_onDown', + '_onMove', + '_onUp', + '_onTouchEnd', + '_onMouseUp' + ], this); + } /** * Returns a Boolean indicating whether the "drag to pan" interaction is enabled. * * @returns {boolean} `true` if the "drag to pan" interaction is enabled. */ - isEnabled: function () { - return this._enabled; - }, + isEnabled() { + return !!this._enabled; + } /** * Returns a Boolean indicating whether the "drag to pan" interaction is active, i.e. currently being used. * * @returns {boolean} `true` if the "drag to pan" interaction is active. */ - isActive: function () { - return this._active; - }, + isActive() { + return !!this._active; + } /** * Enables the "drag to pan" interaction. @@ -55,12 +53,12 @@ DragPanHandler.prototype = { * @example * map.dragPan.enable(); */ - enable: function () { + enable() { if (this.isEnabled()) return; this._el.addEventListener('mousedown', this._onDown); this._el.addEventListener('touchstart', this._onDown); this._enabled = true; - }, + } /** * Disables the "drag to pan" interaction. @@ -68,14 +66,14 @@ DragPanHandler.prototype = { * @example * map.dragPan.disable(); */ - disable: function () { + disable() { if (!this.isEnabled()) return; this._el.removeEventListener('mousedown', this._onDown); this._el.removeEventListener('touchstart', this._onDown); this._enabled = false; - }, + } - _onDown: function (e) { + _onDown(e) { if (this._ignoreEvent(e)) return; if (this.isActive()) return; @@ -90,9 +88,9 @@ DragPanHandler.prototype = { this._active = false; this._startPos = this._pos = DOM.mousePos(this._el, e); this._inertia = [[Date.now(), this._pos]]; - }, + } - _onMove: function (e) { + _onMove(e) { if (this._ignoreEvent(e)) return; if (!this.isActive()) { @@ -116,18 +114,16 @@ DragPanHandler.prototype = { this._pos = pos; e.preventDefault(); - }, + } - _onUp: function (e) { + _onUp(e) { if (!this.isActive()) return; this._active = false; this._fireEvent('dragend', e); this._drainInertiaBuffer(); - const finish = function() { - this._fireEvent('moveend', e); - }.bind(this); + const finish = () => this._fireEvent('moveend', e); const inertia = this._inertia; if (inertia.length < 2) { @@ -162,27 +158,27 @@ DragPanHandler.prototype = { easing: inertiaEasing, noMoveStart: true }, { originalEvent: e }); - }, + } - _onMouseUp: function (e) { + _onMouseUp(e) { if (this._ignoreEvent(e)) return; this._onUp(e); window.document.removeEventListener('mousemove', this._onMove); window.document.removeEventListener('mouseup', this._onMouseUp); - }, + } - _onTouchEnd: function (e) { + _onTouchEnd(e) { if (this._ignoreEvent(e)) return; this._onUp(e); window.document.removeEventListener('touchmove', this._onMove); window.document.removeEventListener('touchend', this._onTouchEnd); - }, + } - _fireEvent: function (type, e) { + _fireEvent(type, e) { return this._map.fire(type, { originalEvent: e }); - }, + } - _ignoreEvent: function (e) { + _ignoreEvent(e) { const map = this._map; if (map.boxZoom && map.boxZoom.isActive()) return true; @@ -195,17 +191,18 @@ DragPanHandler.prototype = { button = 0; // left button return (e.type === 'mousemove' ? e.buttons & buttons === 0 : e.button !== button); } - }, + } - _drainInertiaBuffer: function () { + _drainInertiaBuffer() { const inertia = this._inertia, now = Date.now(), cutoff = 160; // msec while (inertia.length > 0 && now - inertia[0][0] > cutoff) inertia.shift(); } -}; +} +module.exports = DragPanHandler; /** * Fired when a "drag to pan" interaction starts. See [`DragPanHandler`](#DragPanHandler). diff --git a/js/ui/handler/drag_rotate.js b/js/ui/handler/drag_rotate.js index b758dfd6c4a..f35d52e302a 100644 --- a/js/ui/handler/drag_rotate.js +++ b/js/ui/handler/drag_rotate.js @@ -4,56 +4,53 @@ const DOM = require('../../util/dom'); const util = require('../../util/util'); const window = require('../../util/window'); -module.exports = DragRotateHandler; - const inertiaLinearity = 0.25, inertiaEasing = util.bezier(0, 0, inertiaLinearity, 1), inertiaMaxSpeed = 180, // deg/s inertiaDeceleration = 720; // deg/s^2 - /** * The `DragRotateHandler` allows the user to rotate the map by clicking and * dragging the cursor while holding the right mouse button or `ctrl` key. * - * @class DragRotateHandler * @param {Map} map The Mapbox GL JS map to add the handler to. * @param {Object} [options] * @param {number} [options.bearingSnap] The threshold, measured in degrees, that determines when the map's * bearing (rotation) will snap to north. * @param {bool} [options.pitchWithRotate=true] Control the map pitch in addition to the bearing */ -function DragRotateHandler(map, options) { - this._map = map; - this._el = map.getCanvasContainer(); - this._bearingSnap = options.bearingSnap; - this._pitchWithRotate = options.pitchWithRotate !== false; - - util.bindHandlers(this); -} +class DragRotateHandler { + constructor(map, options) { + this._map = map; + this._el = map.getCanvasContainer(); + this._bearingSnap = options.bearingSnap; + this._pitchWithRotate = options.pitchWithRotate !== false; + + util.bindAll([ + '_onDown', + '_onMove', + '_onUp' + ], this); -DragRotateHandler.prototype = { - - _enabled: false, - _active: false, + } /** * Returns a Boolean indicating whether the "drag to rotate" interaction is enabled. * * @returns {boolean} `true` if the "drag to rotate" interaction is enabled. */ - isEnabled: function () { - return this._enabled; - }, + isEnabled() { + return !!this._enabled; + } /** * Returns a Boolean indicating whether the "drag to rotate" interaction is active, i.e. currently being used. * * @returns {boolean} `true` if the "drag to rotate" interaction is active. */ - isActive: function () { - return this._active; - }, + isActive() { + return !!this._active; + } /** * Enables the "drag to rotate" interaction. @@ -61,11 +58,11 @@ DragRotateHandler.prototype = { * @example * map.dragRotate.enable(); */ - enable: function () { + enable() { if (this.isEnabled()) return; this._el.addEventListener('mousedown', this._onDown); this._enabled = true; - }, + } /** * Disables the "drag to rotate" interaction. @@ -73,13 +70,13 @@ DragRotateHandler.prototype = { * @example * map.dragRotate.disable(); */ - disable: function () { + disable() { if (!this.isEnabled()) return; this._el.removeEventListener('mousedown', this._onDown); this._enabled = false; - }, + } - _onDown: function (e) { + _onDown(e) { if (this._ignoreEvent(e)) return; if (this.isActive()) return; @@ -92,9 +89,9 @@ DragRotateHandler.prototype = { this._center = this._map.transform.centerPoint; // Center of rotation e.preventDefault(); - }, + } - _onMove: function (e) { + _onMove(e) { if (this._ignoreEvent(e)) return; if (!this.isActive()) { @@ -125,9 +122,9 @@ DragRotateHandler.prototype = { this._fireEvent('move', e); this._pos = p2; - }, + } - _onUp: function (e) { + _onUp(e) { if (this._ignoreEvent(e)) return; window.document.removeEventListener('mousemove', this._onMove); window.document.removeEventListener('mouseup', this._onUp); @@ -142,13 +139,13 @@ DragRotateHandler.prototype = { mapBearing = map.getBearing(), inertia = this._inertia; - const finish = function() { + const finish = () => { if (Math.abs(mapBearing) < this._bearingSnap) { map.resetNorth({noMoveStart: true}, { originalEvent: e }); } else { this._fireEvent('moveend', e); } - }.bind(this); + }; if (inertia.length < 2) { finish(); @@ -187,13 +184,13 @@ DragRotateHandler.prototype = { easing: inertiaEasing, noMoveStart: true }, { originalEvent: e }); - }, + } - _fireEvent: function (type, e) { + _fireEvent(type, e) { return this._map.fire(type, { originalEvent: e }); - }, + } - _ignoreEvent: function (e) { + _ignoreEvent(e) { const map = this._map; if (map.boxZoom && map.boxZoom.isActive()) return true; @@ -205,9 +202,9 @@ DragRotateHandler.prototype = { button = (e.ctrlKey ? 0 : 2); // ? ctrl+left button : right button return (e.type === 'mousemove' ? e.buttons & buttons === 0 : e.button !== button); } - }, + } - _drainInertiaBuffer: function () { + _drainInertiaBuffer() { const inertia = this._inertia, now = Date.now(), cutoff = 160; //msec @@ -215,9 +212,9 @@ DragRotateHandler.prototype = { while (inertia.length > 0 && now - inertia[0][0] > cutoff) inertia.shift(); } +} -}; - +module.exports = DragRotateHandler; /** * Fired when a "drag to rotate" interaction starts. See [`DragRotateHandler`](#DragRotateHandler). diff --git a/js/ui/handler/keyboard.js b/js/ui/handler/keyboard.js index 820c7e86d85..11a35cfa905 100644 --- a/js/ui/handler/keyboard.js +++ b/js/ui/handler/keyboard.js @@ -1,8 +1,5 @@ 'use strict'; -module.exports = KeyboardHandler; - - const panStep = 100, bearingStep = 15, pitchStep = 10; @@ -21,32 +18,24 @@ const panStep = 100, * - `Shift+⇡`: Increase the pitch by 10 degrees. * - `Shift+⇣`: Decrease the pitch by 10 degrees. * - * @class KeyboardHandler * @param {Map} map The Mapbox GL JS map to add the handler to. */ -function KeyboardHandler(map) { - this._map = map; - this._el = map.getCanvasContainer(); +class KeyboardHandler { + constructor(map) { + this._map = map; + this._el = map.getCanvasContainer(); - this._onKeyDown = this._onKeyDown.bind(this); -} - -function easeOut(t) { - return t * (2 - t); -} - -KeyboardHandler.prototype = { - - _enabled: false, + this._onKeyDown = this._onKeyDown.bind(this); + } /** * Returns a Boolean indicating whether keyboard interaction is enabled. * * @returns {boolean} `true` if keyboard interaction is enabled. */ - isEnabled: function () { - return this._enabled; - }, + isEnabled() { + return !!this._enabled; + } /** * Enables keyboard interaction. @@ -54,11 +43,11 @@ KeyboardHandler.prototype = { * @example * map.keyboard.enable(); */ - enable: function () { + enable() { if (this.isEnabled()) return; this._el.addEventListener('keydown', this._onKeyDown, false); this._enabled = true; - }, + } /** * Disables keyboard interaction. @@ -66,13 +55,13 @@ KeyboardHandler.prototype = { * @example * map.keyboard.disable(); */ - disable: function () { + disable() { if (!this.isEnabled()) return; this._el.removeEventListener('keydown', this._onKeyDown); this._enabled = false; - }, + } - _onKeyDown: function (e) { + _onKeyDown(e) { if (e.altKey || e.ctrlKey || e.metaKey) return; let zoomDir = 0; @@ -149,4 +138,10 @@ KeyboardHandler.prototype = { map.easeTo(easeOptions, {originalEvent: e}); } -}; +} + +function easeOut(t) { + return t * (2 - t); +} + +module.exports = KeyboardHandler; diff --git a/js/ui/handler/scroll_zoom.js b/js/ui/handler/scroll_zoom.js index d8c2137cc09..2260bd44bcc 100644 --- a/js/ui/handler/scroll_zoom.js +++ b/js/ui/handler/scroll_zoom.js @@ -5,39 +5,34 @@ const util = require('../../util/util'); const browser = require('../../util/browser'); const window = require('../../util/window'); -module.exports = ScrollZoomHandler; - - const ua = window.navigator.userAgent.toLowerCase(), firefox = ua.indexOf('firefox') !== -1, safari = ua.indexOf('safari') !== -1 && ua.indexOf('chrom') === -1; - /** * The `ScrollZoomHandler` allows the user to zoom the map by scrolling. * - * @class ScrollZoomHandler * @param {Map} map The Mapbox GL JS map to add the handler to. */ -function ScrollZoomHandler(map) { - this._map = map; - this._el = map.getCanvasContainer(); - - util.bindHandlers(this); -} - -ScrollZoomHandler.prototype = { - - _enabled: false, +class ScrollZoomHandler { + constructor(map) { + this._map = map; + this._el = map.getCanvasContainer(); + + util.bindAll([ + '_onWheel', + '_onTimeout' + ], this); + } /** * Returns a Boolean indicating whether the "scroll to zoom" interaction is enabled. * * @returns {boolean} `true` if the "scroll to zoom" interaction is enabled. */ - isEnabled: function () { - return this._enabled; - }, + isEnabled() { + return !!this._enabled; + } /** * Enables the "scroll to zoom" interaction. @@ -45,12 +40,12 @@ ScrollZoomHandler.prototype = { * @example * map.scrollZoom.enable(); */ - enable: function () { + enable() { if (this.isEnabled()) return; this._el.addEventListener('wheel', this._onWheel, false); this._el.addEventListener('mousewheel', this._onWheel, false); this._enabled = true; - }, + } /** * Disables the "scroll to zoom" interaction. @@ -58,14 +53,14 @@ ScrollZoomHandler.prototype = { * @example * map.scrollZoom.disable(); */ - disable: function () { + disable() { if (!this.isEnabled()) return; this._el.removeEventListener('wheel', this._onWheel); this._el.removeEventListener('mousewheel', this._onWheel); this._enabled = false; - }, + } - _onWheel: function (e) { + _onWheel(e) { let value; if (e.type === 'wheel') { @@ -122,14 +117,14 @@ ScrollZoomHandler.prototype = { if (this._type) this._zoom(-value, e); e.preventDefault(); - }, + } - _onTimeout: function () { + _onTimeout() { this._type = 'wheel'; this._zoom(-this._lastValue); - }, + } - _zoom: function (delta, e) { + _zoom(delta, e) { if (delta === 0) return; const map = this._map; @@ -147,8 +142,9 @@ ScrollZoomHandler.prototype = { smoothEasing: true }, { originalEvent: e }); } -}; +} +module.exports = ScrollZoomHandler; /** * Fired just before the map begins a transition from one zoom level to another, diff --git a/js/ui/handler/touch_zoom_rotate.js b/js/ui/handler/touch_zoom_rotate.js index 4de1e261f40..b2559c91f8b 100644 --- a/js/ui/handler/touch_zoom_rotate.js +++ b/js/ui/handler/touch_zoom_rotate.js @@ -4,8 +4,6 @@ const DOM = require('../../util/dom'); const util = require('../../util/util'); const window = require('../../util/window'); -module.exports = TouchZoomRotateHandler; - const inertiaLinearity = 0.15, inertiaEasing = util.bezier(0, 0, inertiaLinearity, 1), inertiaDeceleration = 12, // scale / s^2 @@ -13,33 +11,32 @@ const inertiaLinearity = 0.15, significantScaleThreshold = 0.15, significantRotateThreshold = 4; - /** * The `TouchZoomRotateHandler` allows the user to zoom and rotate the map by * pinching on a touchscreen. * - * @class TouchZoomRotateHandler * @param {Map} map The Mapbox GL JS map to add the handler to. */ -function TouchZoomRotateHandler(map) { - this._map = map; - this._el = map.getCanvasContainer(); - - util.bindHandlers(this); -} - -TouchZoomRotateHandler.prototype = { - - _enabled: false, +class TouchZoomRotateHandler { + constructor(map) { + this._map = map; + this._el = map.getCanvasContainer(); + + util.bindAll([ + '_onStart', + '_onMove', + '_onEnd' + ], this); + } /** * Returns a Boolean indicating whether the "pinch to rotate and zoom" interaction is enabled. * * @returns {boolean} `true` if the "pinch to rotate and zoom" interaction is enabled. */ - isEnabled: function () { - return this._enabled; - }, + isEnabled() { + return !!this._enabled; + } /** * Enables the "pinch to rotate and zoom" interaction. @@ -47,11 +44,11 @@ TouchZoomRotateHandler.prototype = { * @example * map.touchZoomRotate.enable(); */ - enable: function () { + enable() { if (this.isEnabled()) return; this._el.addEventListener('touchstart', this._onStart, false); this._enabled = true; - }, + } /** * Disables the "pinch to rotate and zoom" interaction. @@ -59,11 +56,11 @@ TouchZoomRotateHandler.prototype = { * @example * map.touchZoomRotate.disable(); */ - disable: function () { + disable() { if (!this.isEnabled()) return; this._el.removeEventListener('touchstart', this._onStart); this._enabled = false; - }, + } /** * Disables the "pinch to rotate" interaction, leaving the "pinch to zoom" @@ -72,9 +69,9 @@ TouchZoomRotateHandler.prototype = { * @example * map.touchZoomRotate.disableRotation(); */ - disableRotation: function() { + disableRotation() { this._rotationDisabled = true; - }, + } /** * Enables the "pinch to rotate" interaction. @@ -83,11 +80,11 @@ TouchZoomRotateHandler.prototype = { * map.touchZoomRotate.enable(); * map.touchZoomRotate.enableRotation(); */ - enableRotation: function() { + enableRotation() { this._rotationDisabled = false; - }, + } - _onStart: function (e) { + _onStart(e) { if (e.touches.length !== 2) return; const p0 = DOM.mousePos(this._el, e.touches[0]), @@ -101,9 +98,9 @@ TouchZoomRotateHandler.prototype = { window.document.addEventListener('touchmove', this._onMove, false); window.document.addEventListener('touchend', this._onEnd, false); - }, + } - _onMove: function (e) { + _onMove(e) { if (e.touches.length !== 2) return; const p0 = DOM.mousePos(this._el, e.touches[0]), @@ -150,9 +147,9 @@ TouchZoomRotateHandler.prototype = { } e.preventDefault(); - }, + } - _onEnd: function (e) { + _onEnd(e) { window.document.removeEventListener('touchmove', this._onMove); window.document.removeEventListener('touchend', this._onEnd); this._drainInertiaBuffer(); @@ -202,13 +199,15 @@ TouchZoomRotateHandler.prototype = { easing: inertiaEasing, around: map.unproject(p) }, { originalEvent: e }); - }, + } - _drainInertiaBuffer: function() { + _drainInertiaBuffer() { const inertia = this._inertia, now = Date.now(), cutoff = 160; // msec while (inertia.length > 2 && now - inertia[0][0] > cutoff) inertia.shift(); } -}; +} + +module.exports = TouchZoomRotateHandler; diff --git a/js/util/util.js b/js/util/util.js index ec480793bfb..90dffaac639 100644 --- a/js/util/util.js +++ b/js/util/util.js @@ -273,21 +273,6 @@ exports.bindAll = function(fns, context) { }); }; -/** - * Given a class, bind all of the methods that look like handlers: that - * begin with _on, and bind them to the class. - * - * @param {Object} context an object with methods - * @private - */ -exports.bindHandlers = function(context) { - for (const i in context) { - if (typeof context[i] === 'function' && i.indexOf('_on') === 0) { - context[i] = context[i].bind(context); - } - } -}; - /** * Set the 'options' property on `obj` with properties * from the `options` argument. Properties in the `options` diff --git a/test/js/util/util.test.js b/test/js/util/util.test.js index 53d15983c41..e6afdb14d08 100644 --- a/test/js/util/util.test.js +++ b/test/js/util/util.test.js @@ -75,23 +75,6 @@ test('util', (t) => { t.end(); }); - t.test('bindHandlers', (t) => { - function MyClass() { - util.bindHandlers(this); - this.name = 'Tom'; - } - MyClass.prototype.otherMethod = function() { - t.equal(this, undefined); - }; - MyClass.prototype._onClick = function() { - t.equal(this.name, 'Tom'); - t.end(); - }; - const my = new MyClass(); - my.otherMethod.call(undefined); - setTimeout(my._onClick, 0); - }); - t.test('asyncAll - sync', (t) => { t.equal(util.asyncAll([0, 1, 2], (data, callback) => { callback(null, data);