leaflet-rotate 0.1.4 → 0.2.1

package/src/layer/DivOverlay.js

@@ -1,37 +1,29 @@
 /**
- * L.DivOverlay
+ * @external L.DivOverlay
+ * 
+ * @see https://github.com/Leaflet/Leaflet/tree/v1.9.3/src/layer/DivOverlay.js
  */
+
 const divOverlayProto = L.extend({}, L.DivOverlay.prototype);
 
 L.DivOverlay.include({
 
     getEvents: function() {
-        return L.extend(divOverlayProto.getEvents.call(this), { rotate: this._updatePosition });
+        return L.extend(divOverlayProto.getEvents.apply(this, arguments), { rotate: this._updatePosition });
     },
 
     _updatePosition: function() {
-        if (!this._map) { return; }
-
-        var pos = this._map.latLngToLayerPoint(this._latlng),
-            offset = L.point(this.options.offset),
-            anchor = this._getAnchor();
-
-        if (this._zoomAnimated) {
-            // TODO: use divOverlayProto._updatePosition
-            if (this._map._rotate) {
-                pos = this._map.rotatedPointToMapPanePoint(pos);
-            }
-            L.DomUtil.setPosition(this._container, pos.add(anchor));
-        } else {
-            offset = offset.add(pos).add(anchor);
+        // 0. update anchor (leaflet v1.9.3)
+        divOverlayProto._updatePosition.apply(this, arguments);
+        // 1. subtract anchor
+        // 2. rotate element
+        // 3. restore anchor
+        if (this._map && this._map._rotate && this._zoomAnimated) {
+            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 bottom = this._containerBottom = -offset.y,
-            left = this._containerLeft = -Math.round(this._containerWidth / 2) + offset.x;
-
-        // bottom position the popup in case the height of the popup changes (images loading etc)
-        this._container.style.bottom = bottom + 'px';
-        this._container.style.left = left + 'px';
     },
 
 });

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.apply(this, arguments);
+        // 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.apply(this, arguments);
         }
-        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.apply(this, arguments);
         }
-        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,53 @@
 /**
- * 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,
+
+    // @option scale: Number = undefined
+    // Scale of the marker icon
+    scale: undefined,
+
+});
+
+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.apply(this, arguments);
+    //     }
+    //     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 +58,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.
 
@@ -50,47 +72,32 @@ var MarkerDrag = {
         if (this._marker._map._rotate) {
             this._marker.update();
         }
-        markerDragProto._onDragEnd.call(this, e);
+        markerDragProto._onDragEnd.apply(this, arguments);
     },
 
 };
 
-/**
- * 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() {
-        return L.extend(markerProto.getEvents.call(this), { rotate: this.update });
+        return L.extend(markerProto.getEvents.apply(this, arguments), { rotate: this.update });
     },
 
     onAdd: function(map) {
-        markerProto.onAdd.call(this, map);
+        markerProto.onAdd.apply(this, arguments);
         map.on('rotate', this.update, this);
     },
 
     _initInteraction: function() {
-        var ret = markerProto._initInteraction.call(this);
+        var ret = markerProto._initInteraction.apply(this, arguments);
         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,23 +106,25 @@ 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, this.options.scale);
+        }
 
-        // TODO: use markerProto._setPos
+        /** @TODO use markerProto._setPos */
         if (this._shadow) {
-            L.DomUtil.setPosition(this._shadow, pos, bearing, pos);
+            L.DomUtil.setPosition(this._shadow, pos, bearing, pos, this.options.scale);
         }
 
         this._zIndex = pos.y + this.options.zIndexOffset;
@@ -125,7 +134,7 @@ L.Marker.include({
 
     _updateZIndex: function(offset) {
         if (!this._map._rotate) {
-            return markerProto._updateZIndex.call(this, offset)
+            return markerProto._updateZIndex.apply(this, arguments);
         }
         this._icon.style.zIndex = Math.round(this._zIndex + offset);
     },

package/src/layer/tile/GridLayer.js

@@ -1,12 +1,15 @@
 /**
- * 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({
 
     getEvents: function() {
-        var events = gridLayerProto.getEvents.call(this);
+        var events = gridLayerProto.getEvents.apply(this, arguments);
         if (this._map._rotate && !this.options.updateWhenIdle) {
             if (!this._onRotate) {
                 this._onRotate = L.Util.throttle(this._onMoveEnd, this.options.updateInterval, this);
@@ -18,22 +21,10 @@ L.GridLayer.include({
 
     _getTiledPixelBounds: function(center) {
         if (!this._map._rotate) {
-            return gridLayerProto._getTiledPixelBounds.call(this, center);
+            return gridLayerProto._getTiledPixelBounds.apply(this, arguments);
         }
 
-        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.apply(this, arguments);
+    //     // 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.apply(this, arguments);
+    //     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.apply(this, arguments);
+    //     // Tell paths to redraw themselves
+    //     this.fire('update')
+    // },
 
 });

package/src/layer/vector/Renderer.js

@@ -1,23 +1,31 @@
 /**
- * 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.apply(this, arguments);
+    //     // this._map.on('rotate', this._update, this);
+    // },
+
+    // onRemove: function() {
+    //     rendererProto.onRemove.apply(this, arguments);
+    //     // 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);
+            return rendererProto._updateTransform.apply(this, arguments);
         }
         var scale = this._map.getZoomScale(zoom, this._zoom),
             offset = this._map._latLngToNewLayerPoint(this._topLeft, zoom, center);
@@ -30,29 +38,12 @@ L.Renderer.include({
 
     _update: function() {
         if (!this._map._rotate) {
-            return rendererProto._update.call(this);
+            return rendererProto._update.apply(this, arguments);
         }
         // 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.apply(this, arguments);
+    //     if (this._map._rotate) {
+    //         this.fire('update');
+    //     }
+    // },
 
 });