'<circle r="'+r+'" style="'+style+'" />' +
'</svg>';
return {
- className: 'leafet-control-locate-location',
+ className: 'leaflet-control-locate-location',
svg: svg,
w: s2,
h: s2
'<path d="'+path+'" style="'+style+'" />'+
'</svg>';
return {
- className: 'leafet-control-locate-heading',
+ className: 'leaflet-control-locate-heading',
svg: svg,
w: w,
h: h
setView: 'untilPanOrZoom',
/** Keep the current map zoom level when setting the view and only pan. */
keepCurrentZoomLevel: false,
+ /** After activating the plugin by clicking on the icon, zoom to the selected zoom level, even when keepCurrentZoomLevel is true. Set to 'false' to disable this feature. */
+ initialZoomLevel: false,
+ /**
+ * This callback can be used to override the viewport tracking
+ * This function should return a LatLngBounds object.
+ *
+ * For example to extend the viewport to ensure that a particular LatLng is visible:
+ *
+ * getLocationBounds: function(locationEvent) {
+ * return locationEvent.bounds.extend([-33.873085, 151.219273]);
+ * },
+ */
+ getLocationBounds: function (locationEvent) {
+ return locationEvent.bounds;
+ },
/** Smooth pan and zoom to the location of the marker. Only works in Leaflet 1.0+. */
flyTo: false,
/**
inView: 'stop',
/** What should happen if the user clicks on the control while the location is outside the current view. */
outOfView: 'setView',
+ /**
+ * What should happen if the user clicks on the control while the location is within the current view
+ * and we could be following but are not. Defaults to a special value which inherits from 'inView';
+ */
+ inViewNotFollowing: 'inView',
},
/**
* If set, save the map bounds just before centering to the user's
*/
_onClick: function() {
this._justClicked = true;
+ var wasFollowing = this._isFollowing();
this._userPanned = false;
this._userZoomed = false;
// click while requesting
this.stop();
} else if (this._active && this._event !== undefined) {
- var behavior = this._map.getBounds().contains(this._event.latlng) ?
- this.options.clickBehavior.inView : this.options.clickBehavior.outOfView;
+ var behaviors = this.options.clickBehavior;
+ var behavior = behaviors.outOfView;
+ if (this._map.getBounds().contains(this._event.latlng)) {
+ behavior = wasFollowing ? behaviors.inView : behaviors.inViewNotFollowing;
+ }
+
+ // Allow inheriting from another behavior
+ if (behaviors[behavior]) {
+ behavior = behaviors[behavior];
+ }
+
switch (behavior) {
case 'setView':
this.setView();
this._removeMarker();
},
+ /**
+ * Keep the control active but stop following the location
+ */
+ stopFollowing: function() {
+ this._userPanned = true;
+ this._updateContainerStyle();
+ this._drawMarker();
+ },
+
/**
* This method launches the location engine.
* It is called before the marker is updated,
this._map.on('zoomstart', this._onZoom, this);
this._map.on('zoomend', this._onZoomEnd, this);
if (this.options.showCompass) {
- if ('ondeviceorientationabsolute' in window) {
- L.DomEvent.on(window, 'deviceorientationabsolute', this._onDeviceOrientation, this);
- } else if ('ondeviceorientation' in window) {
- L.DomEvent.on(window, 'deviceorientation', this._onDeviceOrientation, this);
+ var oriAbs = 'ondeviceorientationabsolute' in window;
+ if (oriAbs || ('ondeviceorientation' in window)) {
+ var _this = this;
+ var deviceorientation = function () {
+ L.DomEvent.on(window, oriAbs ? 'deviceorientationabsolute' : 'deviceorientation', _this._onDeviceOrientation, _this);
+ };
+ if (DeviceOrientationEvent && typeof DeviceOrientationEvent.requestPermission === 'function') {
+ DeviceOrientationEvent.requestPermission().then(function (permissionState) {
+ if (permissionState === 'granted') {
+ deviceorientation();
+ }
+ })
+ } else {
+ deviceorientation();
+ }
}
}
}
this._event = undefined; // clear the current location so we can get back into the bounds
this.options.onLocationOutsideMapBounds(this);
} else {
+ if (this._justClicked && this.options.initialZoomLevel !== false) {
+ var f = this.options.flyTo ? this._map.flyTo : this._map.setView;
+ f.bind(this._map)([this._event.latitude, this._event.longitude], this.options.initialZoomLevel);
+ } else
if (this.options.keepCurrentZoomLevel) {
var f = this.options.flyTo ? this._map.flyTo : this._map.panTo;
f.bind(this._map)([this._event.latitude, this._event.longitude]);
} else {
var f = this.options.flyTo ? this._map.flyToBounds : this._map.fitBounds;
- f.bind(this._map)(this._event.bounds, {
+ // Ignore zoom events while setting the viewport as these would stop following
+ this._ignoreEvent = true;
+ f.bind(this._map)(this.options.getLocationBounds(this._event), {
padding: this.options.circlePadding,
maxZoom: this.options.locateOptions.maxZoom
});
+ L.Util.requestAnimFrame(function(){
+ // Wait until after the next animFrame because the flyTo can be async
+ this._ignoreEvent = false;
+ }, this);
+
}
}
},
*
*/
_drawCompass: function() {
+ if (!this._event) {
+ return;
+ }
+
var latlng = this._event.latlng;
if (this.options.showCompass && latlng && this._compassHeading !== null) {
this._drawCompass();
var t = this.options.strings.popup;
+ function getPopupText() {
+ if (typeof t === 'string') {
+ return L.Util.template(t, {distance: distance, unit: unit});
+ } else if (typeof t === 'function') {
+ return t({distance: distance, unit: unit});
+ } else {
+ return t;
+ }
+ }
if (this.options.showPopup && t && this._marker) {
this._marker
- .bindPopup(L.Util.template(t, {distance: distance, unit: unit}))
+ .bindPopup(getPopupText())
._popup.setLatLng(latlng);
}
if (this.options.showPopup && t && this._compass) {
this._compass
- .bindPopup(L.Util.template(t, {distance: distance, unit: unit}))
+ .bindPopup(getPopupText())
._popup.setLatLng(latlng);
}
},
*/
_onDrag: function() {
// only react to drags once we have a location
- if (this._event) {
+ if (this._event && !this._ignoreEvent) {
this._userPanned = true;
this._updateContainerStyle();
this._drawMarker();
*/
_onZoom: function() {
// only react to drags once we have a location
- if (this._event) {
+ if (this._event && !this._ignoreEvent) {
this._userZoomed = true;
this._updateContainerStyle();
this._drawMarker();
},
/**
- * After a zoom ends update the compass
+ * After a zoom ends update the compass and handle sideways zooms
*/
_onZoomEnd: function() {
if (this._event) {
this._drawCompass();
}
+
+ if (this._event && !this._ignoreEvent) {
+ // If we have zoomed in and out and ended up sideways treat it as a pan
+ if (this._marker && !this._map.getBounds().pad(-.3).contains(this._marker.getLatLng())) {
+ this._userPanned = true;
+ this._updateContainerStyle();
+ this._drawMarker();
+ }
+ }
},
/**
projects / rails.git / blobdiff