leaflet-rotate 0.1.3 → 0.2.0

package/src/layer/Popup.js

@@ -1,25 +1,41 @@
 /**
- * L.Popup
+ * @external L.Popup
+ * 
+ * @see https://github.com/Leaflet/Leaflet/tree/v1.9.3/src/layer/Popup.js
  */
+
 const popupProto = L.extend({}, L.Popup.prototype);
 
 L.Popup.include({
 
     _animateZoom: function(e) {
-        if (!this._map._rotate) {
-            popupProto._animateZoom.call(this, e);
+        // 0. update anchor (leaflet v1.9.3)
+        popupProto._animateZoom.call(this, e);
+        // 1. subtract anchor
+        // 2. rotate element
+        // 3. restore anchor
+        if (this._map && this._map._rotate) {
+            var anchor = this._getAnchor();
+            var pos = L.DomUtil.getPosition(this._container).subtract(anchor);
+            L.DomUtil.setPosition(this._container, this._map.rotatedPointToMapPanePoint(pos).add(anchor));
         }
-        var pos = this._map._latLngToNewLayerPoint(this._latlng, e.zoom, e.center),
-            anchor = this._getAnchor();
-
-        pos = this._map.rotatedPointToMapPanePoint(pos);
-
-        L.DomUtil.setPosition(this._container, pos.add(anchor));
     },
 
+    /**
+     * Hot fix for L.Popup.mergeOptions({ keepInView: true, });
+     * 
+     * @see https://github.com/fnicollet/Leaflet/pull/21
+     */
     _adjustPan: function() {
         if (!this.options.autoPan || (this._map._panAnim && this._map._panAnim._inProgress)) { return; }
 
+        // We can endlessly recurse if keepInView is set and the view resets.
+        // Let's guard against that by exiting early if we're responding to our own autopan.
+        if (this._autopanning) {
+            this._autopanning = false;
+            return;
+        }
+
         var map = this._map,
             marginBottom = parseInt(L.DomUtil.getStyle(this._container, 'marginBottom'), 10) || 0,
             containerHeight = this._container.offsetHeight + marginBottom,
@@ -29,7 +45,7 @@ L.Popup.include({
         layerPos._add(L.DomUtil.getPosition(this._container));
 
         // var containerPos = map.layerPointToContainerPoint(layerPos);
-        // TODO: use popupProto._adjustPan
+        /** @TODO use popupProto._adjustPan */
         var containerPos = layerPos._add(this._map._getMapPanePos()),
             padding = L.point(this.options.autoPanPadding),
             paddingTL = L.point(this.options.autoPanPaddingTopLeft || padding),
@@ -56,6 +72,10 @@ L.Popup.include({
         // @event autopanstart: Event
         // Fired when the map starts autopanning when opening a popup.
         if (dx || dy) {
+            // Track that we're autopanning, as this function will be re-ran on moveend
+            if (this.options.keepInView) {
+                this._autopanning = true;
+            }
             map
                 .fire('autopanstart')
                 .panBy([dx, dy]);

package/src/layer/Tooltip.js

@@ -1,25 +1,28 @@
 /**
- * L.Tooltip
+ * @external L.Tooltip
+ * 
+ * @see https://github.com/Leaflet/Leaflet/tree/v1.9.3/src/layer/Tooltip.js
  */
+
 const tooltipProto = L.extend({}, L.Tooltip.prototype);
 
 L.Tooltip.include({
 
-    _updatePosition: function() {
+    _animateZoom: function(e) {
         if (!this._map._rotate) {
-            return tooltipProto._updatePosition.call(this);
+            return tooltipProto._animateZoom.call(this, e);
         }
-        var pos = this._map.latLngToLayerPoint(this._latlng);
+        var pos = this._map._latLngToNewLayerPoint(this._latlng, e.zoom, e.center);
 
         pos = this._map.rotatedPointToMapPanePoint(pos);
         this._setPosition(pos);
     },
 
-    _animateZoom: function(e) {
+    _updatePosition: function() {
         if (!this._map._rotate) {
-            return tooltipProto._animateZoom.call(this, e);
+            return tooltipProto._updatePosition.call(this);
         }
-        var pos = this._map._latLngToNewLayerPoint(this._latlng, e.zoom, e.center);
+        var pos = this._map.latLngToLayerPoint(this._latlng);
 
         pos = this._map.rotatedPointToMapPanePoint(pos);
         this._setPosition(pos);

package/src/layer/marker/Icon.js

@@ -1,6 +1,9 @@
 /**
- * L.Icon
+ * @external L.Icon
+ * 
+ * @see https://github.com/Leaflet/Leaflet/tree/v1.9.3/src/layer/marker/Icon.js
  */
+
 const iconProto = L.extend({}, L.Icon.prototype);
 
 L.Icon.include({
@@ -22,7 +25,7 @@ L.Icon.include({
         if (anchor) {
             img.style.marginLeft = (-anchor.x) + 'px';
             img.style.marginTop = (-anchor.y) + 'px';
-            // TODO: use iconProto._setIconStyles
+            /** @TODO use iconProto._setIconStyles */
             img.style[L.DomUtil.TRANSFORM + "Origin"] = anchor.x + "px " + anchor.y + "px 0px";
         }
 

package/src/layer/marker/Marker.js

@@ -1,31 +1,49 @@
 /**
- * L.Handler.MarkerDrag
+ * @external L.Marker
+ * @external L.Handler.MarkerDrag
+ * 
+ * @see https://github.com/Leaflet/Leaflet/tree/v1.9.3/src/layer/marker/Marker.js
  */
-var markerDragProto;
+
+const markerProto = L.extend({}, L.Marker.prototype);
+
+L.Marker.mergeOptions({
+
+    // @option rotation: Number = 0
+    // Rotation of this marker in rad
+    rotation: 0,
+
+    // @option rotateWithView: Boolean = false
+    // Rotate this marker when map rotates
+    rotateWithView: false,
+
+});
+
+var markerDragProto; // retrived at runtime (see below: L.Marker::_initInteraction())
 
 var MarkerDrag = {
 
-    _onDragStart: function() {
-        if (!this._marker._map._rotate) {
-            return markerDragProto._onDragStart.call(this)
-        }
-        this._draggable.updateMapBearing(this._marker._map._bearing);
-    },
+    // _onDragStart: function() {
+    //     if (!this._marker._map._rotate) {
+    //         return markerDragProto._onDragStart.call(this)
+    //     }
+    //     this._draggable.updateMapBearing(this._marker._map._bearing);
+    // },
 
     _onDrag: function(e) {
         var marker = this._marker,
-            // TODO: use markerDragProto._onDrag
+            /** @TODO use markerDragProto._onDrag */
             rotated_marker = marker.options.rotation || marker.options.rotateWithView,
             shadow = marker._shadow,
             iconPos = L.DomUtil.getPosition(marker._icon);
 
-        // TODO: use markerDragProto._onDrag
+        /** @TODO use markerDragProto._onDrag */
         // update shadow position
         if (!rotated_marker && shadow) {
             L.DomUtil.setPosition(shadow, iconPos);
         }
 
-        // TODO: use markerDragProto._onDrag
+        /** @TODO use markerDragProto._onDrag */
         if (marker._map._rotate) {
             // Reverse calculation from mapPane coordinates to rotatePane coordinates
             iconPos = marker._map.mapPanePointToRotatedPoint(iconPos);
@@ -36,7 +54,7 @@ var MarkerDrag = {
         e.latlng = latlng;
         e.oldLatLng = this._oldLatLng;
 
-        // TODO: use markerDragProto._onDrag
+        /** @TODO use markerDragProto._onDrag */
         if (rotated_marker) marker.setLatLng(latlng); // use `setLatLng` to presisit rotation. low efficiency
         else marker.fire('move', e); // `setLatLng` will trig 'move' event. we imitate here.
 
@@ -55,23 +73,6 @@ var MarkerDrag = {
 
 };
 
-/**
- * L.Marker
- */
-const markerProto = L.extend({}, L.Marker.prototype);
-
-L.Marker.mergeOptions({
-
-    // @option rotation: Number = 0
-    // Rotation of this marker in rad
-    rotation: 0,
-
-    // @option rotateWithView: Boolean = false
-    // Rotate this marker when map rotates
-    rotateWithView: false,
-
-});
-
 L.Marker.include({
 
     getEvents: function() {
@@ -88,9 +89,11 @@ L.Marker.include({
         if (this.dragging && this.dragging.enabled() && this._map && this._map._rotate) {
             // L.Handler.MarkerDrag is used internally by L.Marker to make the markers draggable
             markerDragProto = markerDragProto || Object.getPrototypeOf(this.dragging);
-            this.dragging._onDragStart = MarkerDrag._onDragStart.bind(this.dragging);
-            this.dragging._onDrag = MarkerDrag._onDrag.bind(this.dragging);
-            this.dragging._onDragEnd = MarkerDrag._onDragEnd.bind(this.dragging);
+            Object.assign(this.dragging, {
+                // _onDragStart: MarkerDrag._onDragStart.bind(this.dragging),
+                _onDrag: MarkerDrag._onDrag.bind(this.dragging),
+                _onDragEnd: MarkerDrag._onDragEnd.bind(this.dragging),
+            })
             this.dragging.disable();
             this.dragging.enable();
         }
@@ -99,21 +102,23 @@ L.Marker.include({
 
     _setPos: function(pos) {
 
-        // TODO: use markerProto._setPos
+        /** @TODO use markerProto._setPos */
         if (this._map._rotate) {
             pos = this._map.rotatedPointToMapPanePoint(pos);
         }
 
-        // TODO: use markerProto._setPos
+        /** @TODO use markerProto._setPos */
         var bearing = this.options.rotation || 0;
         if (this.options.rotateWithView) {
             bearing += this._map._bearing;
         }
 
-        // TODO: use markerProto._setPos
-        L.DomUtil.setPosition(this._icon, pos, bearing, pos);
+        /** @TODO use markerProto._setPos */
+        if (this._icon) {
+            L.DomUtil.setPosition(this._icon, pos, bearing, pos);
+        }
 
-        // TODO: use markerProto._setPos
+        /** @TODO use markerProto._setPos */
         if (this._shadow) {
             L.DomUtil.setPosition(this._shadow, pos, bearing, pos);
         }

package/src/layer/tile/GridLayer.js

@@ -1,6 +1,9 @@
 /**
- * L.GridLayer
+ * @external L.GridLayer
+ * 
+ * @see https://github.com/Leaflet/Leaflet/tree/v1.9.3/src/layer/tile/GridLayer.js
  */
+
 const gridLayerProto = L.extend({}, L.GridLayer.prototype);
 
 L.GridLayer.include({
@@ -21,19 +24,7 @@ L.GridLayer.include({
             return gridLayerProto._getTiledPixelBounds.call(this, center);
         }
 
-        var map = this._map,
-            mapZoom = map._animatingZoom ? Math.max(map._animateToZoom, map.getZoom()) : map.getZoom(),
-            scale = map.getZoomScale(mapZoom, this._tileZoom),
-            pixelCenter = map.project(center, this._tileZoom).floor(),
-            size = map.getSize(),
-            halfSize = new L.Bounds([
-                map.containerPointToLayerPoint([0, 0]).floor(),
-                map.containerPointToLayerPoint([size.x, 0]).floor(),
-                map.containerPointToLayerPoint([0, size.y]).floor(),
-                map.containerPointToLayerPoint([size.x, size.y]).floor()
-            ]).getSize().divideBy(scale * 2);
-
-        return new L.Bounds(pixelCenter.subtract(halfSize), pixelCenter.add(halfSize));
+        return this._map._getNewPixelBounds(center, this._tileZoom);
     },
 
 });

package/src/layer/vector/Canvas.js

@@ -1,25 +1,28 @@
 /**
- * L.Canvas
+ * @external L.Canvas
+ * 
+ * @see https://github.com/Leaflet/Leaflet/tree/v1.9.3/src/layer/vector/Canvas.js
  */
+
 const canvasProto = L.extend({}, L.Canvas.prototype);
 
 L.Canvas.include({
 
-    onAdd: function() {
-        canvasProto.onAdd.call(this);
-        // When rotating the canvas itself, it is cleared by some weird reason, so redraw.
-        this._map.on('rotate', this._redraw, this);
-    },
+    // onAdd: function() {
+    //     canvasProto.onAdd.call(this);
+    //     // When rotating the canvas itself, it is cleared by some weird reason, so redraw.
+    //     this._map.on('rotate', this._redraw, this);
+    // },
 
-    onRemove: function() {
-        canvasProto.onRemove.call(this);
-        this._map.off('rotate', this._redraw, this);
-    },
+    // onRemove: function() {
+    //     canvasProto.onRemove.call(this);
+    //     this._map.off('rotate', this._redraw, this);
+    // },
 
-    _update: function() {
-        canvasProto._update.call(this);
-        // Tell paths to redraw themselves
-        this.fire('update')
-    },
+    // _update: function() {
+    //     canvasProto._update.call(this);
+    //     // Tell paths to redraw themselves
+    //     this.fire('update')
+    // },
 
 });

package/src/layer/vector/Renderer.js

@@ -1,20 +1,28 @@
 /**
- * L.Renderer
+ * @external L.Renderer
+ * 
+ * @see https://github.com/Leaflet/Leaflet/tree/v1.9.3/src/layer/vector/Renderer.js
  */
+
 const rendererProto = L.extend({}, L.Renderer.prototype);
 
 L.Renderer.include({
 
-    onAdd: function() {
-        rendererProto.onAdd.call(this);
-        // this._map.on('rotate', this._update, this);
-    },
-
-    onRemove: function() {
-        rendererProto.onRemove.call(this);
-        // this._map.off('rotate', this._update, this);
-    },
-
+    // onAdd: function() {
+    //     rendererProto.onAdd.call(this);
+    //     // this._map.on('rotate', this._update, this);
+    // },
+
+    // onRemove: function() {
+    //     rendererProto.onRemove.call(this);
+    //     // this._map.off('rotate', this._update, this);
+    // },
+
+    /**
+     * @TODO rechek this changes from leaflet@v1.9.3
+     * 
+     * @see https://github.com/Leaflet/Leaflet/compare/v1.7.0...v1.9.3
+     */
     _updateTransform: function(center, zoom) {
         if (!this._map._rotate) {
             return rendererProto._updateTransform.call(this, center, zoom);
@@ -34,25 +42,8 @@ L.Renderer.include({
         }
         // Update pixel bounds of renderer container (for positioning/sizing/clipping later)
         // Subclasses are responsible of firing the 'update' event.
-        var p = this.options.padding,
-            map = this._map,
-            size = this._map.getSize(),
-            padMin = size.multiplyBy(-p),
-            padMax = size.multiplyBy(1 + p),
-            //// TODO: Somehow refactor this out into map.something() - the code is
-            ////   pretty much the same as in GridLayer.
-            clip = new L.Bounds([
-                map.containerPointToLayerPoint([padMin.x, padMin.y]).floor(),
-                map.containerPointToLayerPoint([padMin.x, padMax.y]).floor(),
-                map.containerPointToLayerPoint([padMax.x, padMin.y]).floor(),
-                map.containerPointToLayerPoint([padMax.x, padMax.y]).floor()
-            ]);
-        //min = this._map.containerPointToLayerPoint(size.multiplyBy(-p)).round();
-
-        this._bounds = clip;
-        // this._topLeft = clip.min;
-        this._topLeft = this._map.layerPointToLatLng(clip.min);
-
+        this._bounds = this._map._getPaddedPixelBounds(this.options.padding);
+        this._topLeft = this._map.layerPointToLatLng(this._bounds.min);
         this._center = this._map.getCenter();
         this._zoom = this._map.getZoom();
     },

package/src/layer/vector/SVG.js

@@ -1,15 +1,18 @@
 /**
- * L.SVG
+ * @external L.SVG
+ * 
+ * @see https://github.com/Leaflet/Leaflet/tree/v1.9.3/src/layer/vector/SVG.js
  */
+
 const svgProto = L.extend({}, L.SVG.prototype);
 
 L.SVG.include({
 
-    _update: function() {
-        svgProto._update.call(this);
-        if (this._map._rotate) {
-            this.fire('update');
-        }
-    },
+    // _update: function() {
+    //     svgProto._update.call(this);
+    //     if (this._map._rotate) {
+    //         this.fire('update');
+    //     }
+    // },
 
 });