leaflet-with-dashoffset-canvas-fix 1.9.4

package/src/map/handler/Map.TapHold.js

@@ -0,0 +1,102 @@
+import {Map} from '../Map';
+import {Handler} from '../../core/Handler';
+import * as DomEvent from '../../dom/DomEvent';
+import {Point} from '../../geometry/Point';
+import * as Util from '../../core/Util';
+import Browser from '../../core/Browser';
+
+/*
+ * L.Map.TapHold is used to simulate `contextmenu` event on long hold,
+ * which otherwise is not fired by mobile Safari.
+ */
+
+var tapHoldDelay = 600;
+
+// @namespace Map
+// @section Interaction Options
+Map.mergeOptions({
+	// @section Touch interaction options
+	// @option tapHold: Boolean
+	// Enables simulation of `contextmenu` event, default is `true` for mobile Safari.
+	tapHold: Browser.touchNative && Browser.safari && Browser.mobile,
+
+	// @option tapTolerance: Number = 15
+	// The max number of pixels a user can shift his finger during touch
+	// for it to be considered a valid tap.
+	tapTolerance: 15
+});
+
+export var TapHold = Handler.extend({
+	addHooks: function () {
+		DomEvent.on(this._map._container, 'touchstart', this._onDown, this);
+	},
+
+	removeHooks: function () {
+		DomEvent.off(this._map._container, 'touchstart', this._onDown, this);
+	},
+
+	_onDown: function (e) {
+		clearTimeout(this._holdTimeout);
+		if (e.touches.length !== 1) { return; }
+
+		var first = e.touches[0];
+		this._startPos = this._newPos = new Point(first.clientX, first.clientY);
+
+		this._holdTimeout = setTimeout(Util.bind(function () {
+			this._cancel();
+			if (!this._isTapValid()) { return; }
+
+			// prevent simulated mouse events https://w3c.github.io/touch-events/#mouse-events
+			DomEvent.on(document, 'touchend', DomEvent.preventDefault);
+			DomEvent.on(document, 'touchend touchcancel', this._cancelClickPrevent);
+			this._simulateEvent('contextmenu', first);
+		}, this), tapHoldDelay);
+
+		DomEvent.on(document, 'touchend touchcancel contextmenu', this._cancel, this);
+		DomEvent.on(document, 'touchmove', this._onMove, this);
+	},
+
+	_cancelClickPrevent: function cancelClickPrevent() {
+		DomEvent.off(document, 'touchend', DomEvent.preventDefault);
+		DomEvent.off(document, 'touchend touchcancel', cancelClickPrevent);
+	},
+
+	_cancel: function () {
+		clearTimeout(this._holdTimeout);
+		DomEvent.off(document, 'touchend touchcancel contextmenu', this._cancel, this);
+		DomEvent.off(document, 'touchmove', this._onMove, this);
+	},
+
+	_onMove: function (e) {
+		var first = e.touches[0];
+		this._newPos = new Point(first.clientX, first.clientY);
+	},
+
+	_isTapValid: function () {
+		return this._newPos.distanceTo(this._startPos) <= this._map.options.tapTolerance;
+	},
+
+	_simulateEvent: function (type, e) {
+		var simulatedEvent = new MouseEvent(type, {
+			bubbles: true,
+			cancelable: true,
+			view: window,
+			// detail: 1,
+			screenX: e.screenX,
+			screenY: e.screenY,
+			clientX: e.clientX,
+			clientY: e.clientY,
+			// button: 2,
+			// buttons: 2
+		});
+
+		simulatedEvent._simulated = true;
+
+		e.target.dispatchEvent(simulatedEvent);
+	}
+});
+
+// @section Handlers
+// @property tapHold: Handler
+// Long tap handler to simulate `contextmenu` event (useful in mobile Safari).
+Map.addInitHook('addHandler', 'tapHold', TapHold);

package/src/map/handler/Map.TouchZoom.js

@@ -0,0 +1,130 @@
+import {Map} from '../Map';
+import {Handler} from '../../core/Handler';
+import * as DomEvent from '../../dom/DomEvent';
+import * as Util from '../../core/Util';
+import * as DomUtil from '../../dom/DomUtil';
+import Browser from '../../core/Browser';
+
+/*
+ * L.Handler.TouchZoom is used by L.Map to add pinch zoom on supported mobile browsers.
+ */
+
+// @namespace Map
+// @section Interaction Options
+Map.mergeOptions({
+	// @section Touch interaction options
+	// @option touchZoom: Boolean|String = *
+	// Whether the map can be zoomed by touch-dragging with two fingers. If
+	// passed `'center'`, it will zoom to the center of the view regardless of
+	// where the touch events (fingers) were. Enabled for touch-capable web
+	// browsers.
+	touchZoom: Browser.touch,
+
+	// @option bounceAtZoomLimits: Boolean = true
+	// Set it to false if you don't want the map to zoom beyond min/max zoom
+	// and then bounce back when pinch-zooming.
+	bounceAtZoomLimits: true
+});
+
+export var TouchZoom = Handler.extend({
+	addHooks: function () {
+		DomUtil.addClass(this._map._container, 'leaflet-touch-zoom');
+		DomEvent.on(this._map._container, 'touchstart', this._onTouchStart, this);
+	},
+
+	removeHooks: function () {
+		DomUtil.removeClass(this._map._container, 'leaflet-touch-zoom');
+		DomEvent.off(this._map._container, 'touchstart', this._onTouchStart, this);
+	},
+
+	_onTouchStart: function (e) {
+		var map = this._map;
+		if (!e.touches || e.touches.length !== 2 || map._animatingZoom || this._zooming) { return; }
+
+		var p1 = map.mouseEventToContainerPoint(e.touches[0]),
+		    p2 = map.mouseEventToContainerPoint(e.touches[1]);
+
+		this._centerPoint = map.getSize()._divideBy(2);
+		this._startLatLng = map.containerPointToLatLng(this._centerPoint);
+		if (map.options.touchZoom !== 'center') {
+			this._pinchStartLatLng = map.containerPointToLatLng(p1.add(p2)._divideBy(2));
+		}
+
+		this._startDist = p1.distanceTo(p2);
+		this._startZoom = map.getZoom();
+
+		this._moved = false;
+		this._zooming = true;
+
+		map._stop();
+
+		DomEvent.on(document, 'touchmove', this._onTouchMove, this);
+		DomEvent.on(document, 'touchend touchcancel', this._onTouchEnd, this);
+
+		DomEvent.preventDefault(e);
+	},
+
+	_onTouchMove: function (e) {
+		if (!e.touches || e.touches.length !== 2 || !this._zooming) { return; }
+
+		var map = this._map,
+		    p1 = map.mouseEventToContainerPoint(e.touches[0]),
+		    p2 = map.mouseEventToContainerPoint(e.touches[1]),
+		    scale = p1.distanceTo(p2) / this._startDist;
+
+		this._zoom = map.getScaleZoom(scale, this._startZoom);
+
+		if (!map.options.bounceAtZoomLimits && (
+			(this._zoom < map.getMinZoom() && scale < 1) ||
+			(this._zoom > map.getMaxZoom() && scale > 1))) {
+			this._zoom = map._limitZoom(this._zoom);
+		}
+
+		if (map.options.touchZoom === 'center') {
+			this._center = this._startLatLng;
+			if (scale === 1) { return; }
+		} else {
+			// Get delta from pinch to center, so centerLatLng is delta applied to initial pinchLatLng
+			var delta = p1._add(p2)._divideBy(2)._subtract(this._centerPoint);
+			if (scale === 1 && delta.x === 0 && delta.y === 0) { return; }
+			this._center = map.unproject(map.project(this._pinchStartLatLng, this._zoom).subtract(delta), this._zoom);
+		}
+
+		if (!this._moved) {
+			map._moveStart(true, false);
+			this._moved = true;
+		}
+
+		Util.cancelAnimFrame(this._animRequest);
+
+		var moveFn = Util.bind(map._move, map, this._center, this._zoom, {pinch: true, round: false}, undefined);
+		this._animRequest = Util.requestAnimFrame(moveFn, this, true);
+
+		DomEvent.preventDefault(e);
+	},
+
+	_onTouchEnd: function () {
+		if (!this._moved || !this._zooming) {
+			this._zooming = false;
+			return;
+		}
+
+		this._zooming = false;
+		Util.cancelAnimFrame(this._animRequest);
+
+		DomEvent.off(document, 'touchmove', this._onTouchMove, this);
+		DomEvent.off(document, 'touchend touchcancel', this._onTouchEnd, this);
+
+		// Pinch updates GridLayers' levels only when zoomSnap is off, so zoomSnap becomes noUpdate.
+		if (this._map.options.zoomAnimation) {
+			this._map._animateZoom(this._center, this._map._limitZoom(this._zoom), true, this._map.options.zoomSnap);
+		} else {
+			this._map._resetView(this._center, this._map._limitZoom(this._zoom));
+		}
+	}
+});
+
+// @section Handlers
+// @property touchZoom: Handler
+// Touch zoom handler.
+Map.addInitHook('addHandler', 'touchZoom', TouchZoom);

package/src/map/index.js

@@ -0,0 +1,17 @@
+import {Map} from './Map';
+import {BoxZoom} from './handler/Map.BoxZoom';
+Map.BoxZoom = BoxZoom;
+import {DoubleClickZoom} from './handler/Map.DoubleClickZoom';
+Map.DoubleClickZoom = DoubleClickZoom;
+import {Drag} from './handler/Map.Drag';
+Map.Drag = Drag;
+import {Keyboard} from './handler/Map.Keyboard';
+Map.Keyboard = Keyboard;
+import {ScrollWheelZoom} from './handler/Map.ScrollWheelZoom';
+Map.ScrollWheelZoom = ScrollWheelZoom;
+import {TapHold} from './handler/Map.TapHold';
+Map.TapHold = TapHold;
+import {TouchZoom} from './handler/Map.TouchZoom';
+Map.TouchZoom = TouchZoom;
+
+export {Map, createMap as map} from './Map';