Update leaflet to 1.0.0

This commit is contained in:
Tom Hughes 2016-09-27 18:14:32 +01:00
parent e5d81734f2
commit f4a4632b45
11 changed files with 9053 additions and 4810 deletions

View file

@ -11,13 +11,13 @@ folder 'vendor/assets' do
end
folder 'leaflet' do
file 'leaflet.js', 'http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet-src.js'
file 'leaflet.css', 'http://cdn.leafletjs.com/leaflet/v0.7.7/leaflet.css'
file 'leaflet.js', 'https://unpkg.com/leaflet@1.0.0/dist/leaflet-src.js'
file 'leaflet.css', 'https://unpkg.com/leaflet@1.0.0/dist/leaflet.css'
[ 'layers.png', 'layers-2x.png',
'marker-icon.png', 'marker-icon-2x.png',
'marker-shadow.png' ].each do |image|
file "images/#{image}", "http://cdn.leafletjs.com/leaflet/v0.7.7/images/#{image}"
file "images/#{image}", "https://unpkg.com/leaflet@1.0.0/dist/images/#{image}"
end
from 'git://github.com/kajic/leaflet-locationfilter.git' do
@ -26,7 +26,7 @@ folder 'vendor/assets' do
folder 'img', 'src/img'
end
from 'git://github.com/domoritz/leaflet-locatecontrol.git' do
from 'git://github.com/domoritz/leaflet-locatecontrol.git', :tag => 'v0.54.0' do
file 'leaflet.locate.js', 'src/L.Control.Locate.js'
end
@ -34,7 +34,7 @@ folder 'vendor/assets' do
file 'leaflet.osm.js', 'leaflet-osm.js'
end
from 'git://github.com/jieter/Leaflet.encoded.git' do
from 'git://github.com/jieter/Leaflet.encoded.git', :tag => '0.0.8' do
file 'leaflet.polyline.js', 'Polyline.encoded.js'
end
end

View file

@ -277,7 +277,7 @@ L.OSM.Map = L.Map.extend({
}
});
L.Icon.Default.imagePath = "/images";
L.Icon.Default.imagePath = "/images/";
L.Icon.Default.imageUrls = {
"/images/marker-icon.png": OSM.MARKER_ICON,

Binary file not shown.

Before

Width:  |  Height:  |  Size: 2.8 KiB

After

Width:  |  Height:  |  Size: 1.2 KiB

Before After
Before After

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.5 KiB

After

Width:  |  Height:  |  Size: 696 B

Before After
Before After

Binary file not shown.

Before

Width:  |  Height:  |  Size: 3.9 KiB

After

Width:  |  Height:  |  Size: 2.5 KiB

Before After
Before After

Binary file not shown.

Before

Width:  |  Height:  |  Size: 1.7 KiB

After

Width:  |  Height:  |  Size: 1.4 KiB

Before After
Before After

Binary file not shown.

Before

Width:  |  Height:  |  Size: 797 B

After

Width:  |  Height:  |  Size: 618 B

Before After
Before After

View file

@ -1,16 +1,12 @@
/* required styles */
.leaflet-map-pane,
.leaflet-pane,
.leaflet-tile,
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-tile-pane,
.leaflet-tile-container,
.leaflet-overlay-pane,
.leaflet-shadow-pane,
.leaflet-marker-pane,
.leaflet-popup-pane,
.leaflet-overlay-pane svg,
.leaflet-map-pane svg,
.leaflet-map-pane canvas,
.leaflet-zoom-box,
.leaflet-image-layer,
.leaflet-layer {
@ -20,8 +16,6 @@
}
.leaflet-container {
overflow: hidden;
-ms-touch-action: none;
touch-action: none;
}
.leaflet-tile,
.leaflet-marker-icon,
@ -29,20 +23,42 @@
-webkit-user-select: none;
-moz-user-select: none;
user-select: none;
-webkit-user-drag: none;
-webkit-user-drag: none;
}
/* Safari renders non-retina tile on retina better with this, but Chrome is worse */
.leaflet-safari .leaflet-tile {
image-rendering: -webkit-optimize-contrast;
}
/* hack that prevents hw layers "stretching" when loading new tiles */
.leaflet-safari .leaflet-tile-container {
width: 1600px;
height: 1600px;
-webkit-transform-origin: 0 0;
}
.leaflet-marker-icon,
.leaflet-marker-shadow {
display: block;
}
/* map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container img {
/* .leaflet-container svg: reset svg max-width decleration shipped in Joomla! (joomla.org) 3.x */
/* .leaflet-container img: map is broken in FF if you have max-width: 100% on tiles */
.leaflet-container .leaflet-overlay-pane svg,
.leaflet-container .leaflet-marker-pane img,
.leaflet-container .leaflet-tile-pane img,
.leaflet-container img.leaflet-image-layer {
max-width: none !important;
}
/* stupid Android 2 doesn't understand "max-width: none" properly */
.leaflet-container img.leaflet-image-layer {
max-width: 15000px !important;
.leaflet-container.leaflet-touch-zoom {
-ms-touch-action: pan-x pan-y;
touch-action: pan-x pan-y;
}
.leaflet-container.leaflet-touch-drag {
-ms-touch-action: pinch-zoom;
}
.leaflet-container.leaflet-touch-drag.leaflet-touch-drag {
-ms-touch-action: none;
touch-action: none;
}
.leaflet-tile {
filter: inherit;
visibility: hidden;
@ -53,18 +69,26 @@
.leaflet-zoom-box {
width: 0;
height: 0;
-moz-box-sizing: border-box;
box-sizing: border-box;
z-index: 800;
}
/* workaround for https://bugzilla.mozilla.org/show_bug.cgi?id=888319 */
.leaflet-overlay-pane svg {
-moz-user-select: none;
}
.leaflet-tile-pane { z-index: 2; }
.leaflet-objects-pane { z-index: 3; }
.leaflet-overlay-pane { z-index: 4; }
.leaflet-shadow-pane { z-index: 5; }
.leaflet-marker-pane { z-index: 6; }
.leaflet-popup-pane { z-index: 7; }
.leaflet-pane { z-index: 400; }
.leaflet-tile-pane { z-index: 200; }
.leaflet-overlay-pane { z-index: 400; }
.leaflet-shadow-pane { z-index: 500; }
.leaflet-marker-pane { z-index: 600; }
.leaflet-tooltip-pane { z-index: 650; }
.leaflet-popup-pane { z-index: 700; }
.leaflet-map-pane canvas { z-index: 100; }
.leaflet-map-pane svg { z-index: 200; }
.leaflet-vml-shape {
width: 1px;
@ -81,7 +105,8 @@
.leaflet-control {
position: relative;
z-index: 7;
z-index: 800;
pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
pointer-events: auto;
}
.leaflet-top,
@ -125,7 +150,9 @@
/* zoom and fade animations */
.leaflet-fade-anim .leaflet-tile,
.leaflet-fade-anim .leaflet-tile {
will-change: opacity;
}
.leaflet-fade-anim .leaflet-popup {
opacity: 0;
-webkit-transition: opacity 0.2s linear;
@ -133,11 +160,17 @@
-o-transition: opacity 0.2s linear;
transition: opacity 0.2s linear;
}
.leaflet-fade-anim .leaflet-tile-loaded,
.leaflet-fade-anim .leaflet-map-pane .leaflet-popup {
opacity: 1;
}
.leaflet-zoom-animated {
-webkit-transform-origin: 0 0;
-ms-transform-origin: 0 0;
transform-origin: 0 0;
}
.leaflet-zoom-anim .leaflet-zoom-animated {
will-change: transform;
}
.leaflet-zoom-anim .leaflet-zoom-animated {
-webkit-transition: -webkit-transform 0.25s cubic-bezier(0,0,0.25,1);
-moz-transition: -moz-transform 0.25s cubic-bezier(0,0,0.25,1);
@ -145,8 +178,7 @@
transition: transform 0.25s cubic-bezier(0,0,0.25,1);
}
.leaflet-zoom-anim .leaflet-tile,
.leaflet-pan-anim .leaflet-tile,
.leaflet-touching .leaflet-zoom-animated {
.leaflet-pan-anim .leaflet-tile {
-webkit-transition: none;
-moz-transition: none;
-o-transition: none;
@ -160,24 +192,44 @@
/* cursors */
.leaflet-clickable {
.leaflet-interactive {
cursor: pointer;
}
.leaflet-container {
.leaflet-grab {
cursor: -webkit-grab;
cursor: -moz-grab;
}
.leaflet-crosshair,
.leaflet-crosshair .leaflet-interactive {
cursor: crosshair;
}
.leaflet-popup-pane,
.leaflet-control {
cursor: auto;
}
.leaflet-dragging .leaflet-container,
.leaflet-dragging .leaflet-clickable {
.leaflet-dragging .leaflet-grab,
.leaflet-dragging .leaflet-grab .leaflet-interactive,
.leaflet-dragging .leaflet-marker-draggable {
cursor: move;
cursor: -webkit-grabbing;
cursor: -moz-grabbing;
}
/* marker & overlays interactivity */
.leaflet-marker-icon,
.leaflet-marker-shadow,
.leaflet-image-layer,
.leaflet-pane > svg path,
.leaflet-tile-container {
pointer-events: none;
}
.leaflet-marker-icon.leaflet-interactive,
.leaflet-image-layer.leaflet-interactive,
.leaflet-pane > svg path.leaflet-interactive {
pointer-events: visiblePainted; /* IE 9-10 doesn't have auto */
pointer-events: auto;
}
/* visual tweaks */
@ -304,6 +356,10 @@
color: #333;
background: #fff;
}
.leaflet-control-layers-scrollbar {
overflow-y: scroll;
padding-right: 5px;
}
.leaflet-control-layers-selector {
margin-top: 2px;
position: relative;
@ -318,6 +374,11 @@
margin: 5px -10px 5px -6px;
}
/* Default icon URLs */
.leaflet-default-icon-path {
background-image: url(images/);
}
/* attribution and scale controls */
@ -355,8 +416,8 @@
font-size: 11px;
white-space: nowrap;
overflow: hidden;
-moz-box-sizing: content-box;
box-sizing: content-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
background: #fff;
background: rgba(255, 255, 255, 0.5);
@ -387,6 +448,7 @@
.leaflet-popup {
position: absolute;
text-align: center;
margin-bottom: 20px;
}
.leaflet-popup-content-wrapper {
padding: 1px;
@ -401,11 +463,13 @@
margin: 18px 0;
}
.leaflet-popup-tip-container {
margin: 0 auto;
width: 40px;
height: 20px;
position: relative;
position: absolute;
left: 50%;
margin-left: -20px;
overflow: hidden;
pointer-events: none;
}
.leaflet-popup-tip {
width: 17px;
@ -423,7 +487,7 @@
.leaflet-popup-content-wrapper,
.leaflet-popup-tip {
background: white;
color: #333;
box-shadow: 0 3px 14px rgba(0,0,0,0.4);
}
.leaflet-container a.leaflet-popup-close-button {
@ -431,6 +495,7 @@
top: 0;
right: 0;
padding: 4px 4px 0 0;
border: none;
text-align: center;
width: 18px;
height: 14px;
@ -477,3 +542,82 @@
background: #fff;
border: 1px solid #666;
}
/* Tooltip */
/* Base styles for the element that has a tooltip */
.leaflet-tooltip {
position: absolute;
padding: 6px;
background-color: #fff;
border: 1px solid #fff;
border-radius: 3px;
color: #222;
white-space: nowrap;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
pointer-events: none;
box-shadow: 0 1px 3px rgba(0,0,0,0.4);
}
.leaflet-tooltip.leaflet-clickable {
cursor: pointer;
pointer-events: auto;
}
.leaflet-tooltip-top:before,
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
position: absolute;
pointer-events: none;
border: 6px solid transparent;
background: transparent;
content: "";
}
/* Directions */
.leaflet-tooltip-bottom {
margin-top: 6px;
}
.leaflet-tooltip-top {
margin-top: -6px;
}
.leaflet-tooltip-bottom:before,
.leaflet-tooltip-top:before {
left: 50%;
margin-left: -6px;
}
.leaflet-tooltip-top:before {
bottom: 0;
margin-bottom: -12px;
border-top-color: #fff;
}
.leaflet-tooltip-bottom:before {
top: 0;
margin-top: -12px;
margin-left: -6px;
border-bottom-color: #fff;
}
.leaflet-tooltip-left {
margin-left: -6px;
}
.leaflet-tooltip-right {
margin-left: 6px;
}
.leaflet-tooltip-left:before,
.leaflet-tooltip-right:before {
top: 50%;
margin-top: -6px;
}
.leaflet-tooltip-left:before {
right: 0;
margin-right: -12px;
border-left-color: #fff;
}
.leaflet-tooltip-right:before {
left: 0;
margin-left: -12px;
border-right-color: #fff;
}

File diff suppressed because it is too large Load diff

View file

@ -1,340 +1,572 @@
/*
Copyright (c) 2014 Dominik Moritz
/*!
Copyright (c) 2016 Dominik Moritz
This file is part of the leaflet locate control. It is licensed under the MIT license.
You can find the project at: https://github.com/domoritz/leaflet-locatecontrol
*/
L.Control.Locate = L.Control.extend({
options: {
position: 'topleft',
drawCircle: true,
follow: false, // follow with zoom and pan the user's location
stopFollowingOnDrag: false, // if follow is true, stop following when map is dragged (deprecated)
// range circle
circleStyle: {
color: '#136AEC',
fillColor: '#136AEC',
fillOpacity: 0.15,
weight: 2,
opacity: 0.5
},
// inner marker
markerStyle: {
color: '#136AEC',
fillColor: '#2A93EE',
fillOpacity: 0.7,
weight: 2,
opacity: 0.9,
radius: 5
},
// changes to range circle and inner marker while following
// it is only necessary to provide the things that should change
followCircleStyle: {},
followMarkerStyle: {
//color: '#FFA500',
//fillColor: '#FFB000'
},
icon: 'icon-location', // icon-location or icon-direction
iconLoading: 'icon-spinner animate-spin',
circlePadding: [0, 0],
metric: true,
onLocationError: function(err) {
// this event is called in case of any location error
// that is not a time out error.
alert(err.message);
},
onLocationOutsideMapBounds: function(control) {
// this event is repeatedly called when the location changes
control.stopLocate();
alert(context.options.strings.outsideMapBoundsMsg);
},
setView: true, // automatically sets the map view to the user's location
// keep the current map zoom level when displaying the user's location. (if 'false', use maxZoom)
keepCurrentZoomLevel: false,
strings: {
title: "Show me where I am",
popup: "You are within {distance} {unit} from this point",
outsideMapBoundsMsg: "You seem located outside the boundaries of the map"
},
locateOptions: {
maxZoom: Infinity,
watch: true // if you overwrite this, visualization cannot be updated
(function (factory, window) {
// see https://github.com/Leaflet/Leaflet/blob/master/PLUGIN-GUIDE.md#module-loaders
// for details on how to structure a leaflet plugin.
// define an AMD module that relies on 'leaflet'
if (typeof define === 'function' && define.amd) {
define(['leaflet'], factory);
// define a Common JS module that relies on 'leaflet'
} else if (typeof exports === 'object') {
if (typeof window !== 'undefined' && window.L) {
module.exports = factory(L);
} else {
module.exports = factory(require('leaflet'));
}
},
}
onAdd: function (map) {
var container = L.DomUtil.create('div', 'control-locate');
// attach your plugin to the global 'L' variable
if(typeof window !== 'undefined' && window.L){
window.L.Control.Locate = factory(L);
}
} (function (L) {
var LocateControl = L.Control.extend({
options: {
/** Position of the control */
position: 'topleft',
/** The layer that the user's location should be drawn on. By default creates a new layer. */
layer: undefined,
/**
* Automatically sets the map view (zoom and pan) to the user's location as it updates.
* While the map is following the user's location, the control is in the `following` state,
* which changes the style of the control and the circle marker.
*
* Possible values:
* - false: never updates the map view when location changes.
* - 'once': set the view when the location is first determined
* - 'always': always updates the map view when location changes.
* The map view follows the users location.
* - 'untilPan': (default) like 'always', except stops updating the
* view if the user has manually panned the map.
* The map view follows the users location until she pans.
*/
setView: 'untilPan',
/** Keep the current map zoom level when setting the view and only pan. */
keepCurrentZoomLevel: false,
/** Smooth pan and zoom to the location of the marker. Only works in Leaflet 1.0+. */
flyTo: false,
/**
* The user location can be inside and outside the current view when the user clicks on the
* control that is already active. Both cases can be configures separately.
* Possible values are:
* - 'setView': zoom and pan to the current location
* - 'stop': stop locating and remove the location marker
*/
clickBehavior: {
/** What should happen if the user clicks on the control while the location is within the current view. */
inView: 'stop',
/** What should happen if the user clicks on the control while the location is outside the current view. */
outOfView: 'setView',
},
/**
* If set, save the map bounds just before centering to the user's
* location. When control is disabled, set the view back to the
* bounds that were saved.
*/
returnToPrevBounds: false,
/** If set, a circle that shows the location accuracy is drawn. */
drawCircle: true,
/** If set, the marker at the users' location is drawn. */
drawMarker: true,
/** The class to be used to create the marker. For example L.CircleMarker or L.Marker */
markerClass: L.CircleMarker,
/** Accuracy circle style properties. */
circleStyle: {
color: '#136AEC',
fillColor: '#136AEC',
fillOpacity: 0.15,
weight: 2,
opacity: 0.5
},
/** Inner marker style properties. */
markerStyle: {
color: '#136AEC',
fillColor: '#2A93EE',
fillOpacity: 0.7,
weight: 2,
opacity: 0.9,
radius: 5
},
/**
* Changes to accuracy circle and inner marker while following.
* It is only necessary to provide the properties that should change.
*/
followCircleStyle: {},
followMarkerStyle: {
// color: '#FFA500',
// fillColor: '#FFB000'
},
/** The CSS class for the icon. For example fa-location-arrow or fa-map-marker */
icon: 'fa fa-map-marker',
iconLoading: 'fa fa-spinner fa-spin',
/** The element to be created for icons. For example span or i */
iconElementTag: 'span',
/** Padding around the accuracy circle. */
circlePadding: [0, 0],
/** Use metric units. */
metric: true,
/** This event is called in case of any location error that is not a time out error. */
onLocationError: function(err, control) {
alert(err.message);
},
/**
* This even is called when the user's location is outside the bounds set on the map.
* The event is called repeatedly when the location changes.
*/
onLocationOutsideMapBounds: function(control) {
control.stop();
alert(control.options.strings.outsideMapBoundsMsg);
},
/** Display a pop-up when the user click on the inner marker. */
showPopup: true,
strings: {
title: "Show me where I am",
metersUnit: "meters",
feetUnit: "feet",
popup: "You are within {distance} {unit} from this point",
outsideMapBoundsMsg: "You seem located outside the boundaries of the map"
},
/** The default options passed to leaflets locate method. */
locateOptions: {
maxZoom: Infinity,
watch: true, // if you overwrite this, visualization cannot be updated
setView: false // have to set this to false because we have to
// do setView manually
}
},
var self = this;
this._layer = new L.LayerGroup();
this._layer.addTo(map);
this._event = undefined;
this._locateOptions = this.options.locateOptions;
L.extend(this._locateOptions, this.options.locateOptions);
L.extend(this._locateOptions, {
setView: false // have to set this to false because we have to
// do setView manually
});
// extend the follow marker style and circle from the normal style
var tmp = {};
L.extend(tmp, this.options.markerStyle, this.options.followMarkerStyle);
this.options.followMarkerStyle = tmp;
tmp = {};
L.extend(tmp, this.options.circleStyle, this.options.followCircleStyle);
this.options.followCircleStyle = tmp;
var link = L.DomUtil.create('a', 'control-button ' + this.options.icon, container);
link.innerHTML = "<span class='icon geolocate'></span>";
link.href = '#';
link.title = this.options.strings.title;
L.DomEvent
.on(link, 'click', L.DomEvent.stopPropagation)
.on(link, 'click', L.DomEvent.preventDefault)
.on(link, 'click', function() {
if (self._active && (self._event === undefined || map.getBounds().contains(self._event.latlng) || !self.options.setView ||
isOutsideMapBounds())) {
stopLocate();
initialize: function (options) {
// set default options if nothing is set (merge one step deep)
for (var i in options) {
if (typeof this.options[i] === 'object') {
L.extend(this.options[i], options[i]);
} else {
locate();
this.options[i] = options[i];
}
})
.on(link, 'dblclick', L.DomEvent.stopPropagation);
}
var locate = function () {
if (self.options.setView) {
self._locateOnNextLocationFound = true;
}
if(!self._active) {
map.locate(self._locateOptions);
}
self._active = true;
if (self.options.follow) {
startFollowing();
}
if (!self._event) {
setClasses('requesting');
// extend the follow marker style and circle from the normal style
this.options.followMarkerStyle = L.extend({}, this.options.markerStyle, this.options.followMarkerStyle);
this.options.followCircleStyle = L.extend({}, this.options.circleStyle, this.options.followCircleStyle);
},
/**
* Add control to map. Returns the container for the control.
*/
onAdd: function (map) {
var container = L.DomUtil.create('div',
'leaflet-control-locate leaflet-bar leaflet-control');
this._layer = this.options.layer || new L.LayerGroup();
this._layer.addTo(map);
this._event = undefined;
this._link = L.DomUtil.create('a', 'leaflet-bar-part leaflet-bar-part-single', container);
this._link.href = '#';
this._link.title = this.options.strings.title;
this._icon = L.DomUtil.create(this.options.iconElementTag, this.options.icon, this._link);
L.DomEvent
.on(this._link, 'click', L.DomEvent.stopPropagation)
.on(this._link, 'click', L.DomEvent.preventDefault)
.on(this._link, 'click', this._onClick, this)
.on(this._link, 'dblclick', L.DomEvent.stopPropagation);
this._resetVariables();
this._map.on('unload', this._unload, this);
return container;
},
/**
* This method is called when the user clicks on the control.
*/
_onClick: function() {
this._justClicked = true;
this._userPanned = false;
this._prevBounds = null;
if (this._active && !this._event) {
// 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;
switch (behavior) {
case 'setView':
this.setView();
break;
case 'stop':
this.stop();
if (this.options.returnToPrevBounds) {
var f = this.options.flyTo ? this._map.flyToBounds : this._map.fitBounds;
f.bind(this._map)(this._prevBounds);
}
break;
}
} else {
visualizeLocation();
}
};
var onLocationFound = function (e) {
// no need to do anything if the location has not changed
if (self._event &&
(self._event.latlng.lat === e.latlng.lat &&
self._event.latlng.lng === e.latlng.lng &&
self._event.accuracy === e.accuracy)) {
return;
if (this.options.returnToPrevBounds) {
this._prevBounds = this._map.getBounds();
}
this.start();
}
if (!self._active) {
return;
this._updateContainerStyle();
},
/**
* Starts the plugin:
* - activates the engine
* - draws the marker (if coordinates available)
*/
start: function() {
this._activate();
if (this._event) {
this._drawMarker(this._map);
// if we already have a location but the user clicked on the control
if (this.options.setView) {
this.setView();
}
}
this._updateContainerStyle();
},
self._event = e;
/**
* Stops the plugin:
* - deactivates the engine
* - reinitializes the button
* - removes the marker
*/
stop: function() {
this._deactivate();
if (self.options.follow && self._following) {
self._locateOnNextLocationFound = true;
this._cleanClasses();
this._resetVariables();
this._removeMarker();
},
/**
* This method launches the location engine.
* It is called before the marker is updated,
* event if it does not mean that the event will be ready.
*
* Override it if you want to add more functionalities.
* It should set the this._active to true and do nothing if
* this._active is true.
*/
_activate: function() {
if (!this._active) {
this._map.locate(this.options.locateOptions);
this._active = true;
// bind event listeners
this._map.on('locationfound', this._onLocationFound, this);
this._map.on('locationerror', this._onLocationError, this);
this._map.on('dragstart', this._onDrag, this);
}
},
visualizeLocation();
};
/**
* Called to stop the location engine.
*
* Override it to shutdown any functionalities you added on start.
*/
_deactivate: function() {
this._map.stopLocate();
this._active = false;
var startFollowing = function() {
map.fire('startfollowing', self);
self._following = true;
if (self.options.stopFollowingOnDrag) {
map.on('dragstart', stopFollowing);
}
};
// unbind event listeners
this._map.off('locationfound', this._onLocationFound, this);
this._map.off('locationerror', this._onLocationError, this);
this._map.off('dragstart', this._onDrag, this);
},
var stopFollowing = function() {
map.fire('stopfollowing', self);
self._following = false;
if (self.options.stopFollowingOnDrag) {
map.off('dragstart', stopFollowing);
}
visualizeLocation();
};
var isOutsideMapBounds = function () {
if (self._event === undefined)
return false;
return map.options.maxBounds &&
!map.options.maxBounds.contains(self._event.latlng);
};
var visualizeLocation = function() {
if (self._event.accuracy === undefined)
self._event.accuracy = 0;
var radius = self._event.accuracy;
if (self._locateOnNextLocationFound) {
if (isOutsideMapBounds()) {
self.options.onLocationOutsideMapBounds(self);
/**
* Zoom (unless we should keep the zoom level) and an to the current view.
*/
setView: function() {
this._drawMarker();
if (this._isOutsideMapBounds()) {
this.options.onLocationOutsideMapBounds(this);
} 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 {
map.fitBounds(self._event.bounds, {
padding: self.options.circlePadding,
maxZoom: self.options.keepCurrentZoomLevel ? map.getZoom() : self._locateOptions.maxZoom
var f = this.options.flyTo ? this._map.flyToBounds : this._map.fitBounds;
f.bind(this._map)(this._event.bounds, {
padding: this.options.circlePadding,
maxZoom: this.options.locateOptions.maxZoom
});
}
self._locateOnNextLocationFound = false;
}
},
/**
* Draw the marker and accuracy circle on the map.
*
* Uses the event retrieved from onLocationFound from the map.
*/
_drawMarker: function() {
if (this._event.accuracy === undefined) {
this._event.accuracy = 0;
}
// circle with the radius of the location's accuracy
var style, o;
if (self.options.drawCircle) {
if (self._following) {
style = self.options.followCircleStyle;
} else {
style = self.options.circleStyle;
}
var radius = this._event.accuracy;
var latlng = this._event.latlng;
if (!self._circle) {
self._circle = L.circle(self._event.latlng, radius, style)
.addTo(self._layer);
// circle with the radius of the location's accuracy
if (this.options.drawCircle) {
var style = this._isFollowing() ? this.options.followCircleStyle : this.options.circleStyle;
if (!this._circle) {
this._circle = L.circle(latlng, radius, style).addTo(this._layer);
} else {
self._circle.setLatLng(self._event.latlng).setRadius(radius);
for (o in style) {
self._circle.options[o] = style[o];
}
this._circle.setLatLng(latlng).setRadius(radius).setStyle(style);
}
}
var distance, unit;
if (self.options.metric) {
if (this.options.metric) {
distance = radius.toFixed(0);
unit = "meters";
unit = this.options.strings.metersUnit;
} else {
distance = (radius * 3.2808399).toFixed(0);
unit = "feet";
unit = this.options.strings.feetUnit;
}
// small inner marker
var mStyle;
if (self._following) {
mStyle = self.options.followMarkerStyle;
} else {
mStyle = self.options.markerStyle;
}
if (this.options.drawMarker) {
var mStyle = this._isFollowing() ? this.options.followMarkerStyle : this.options.markerStyle;
var t = self.options.strings.popup;
if (!self._circleMarker) {
self._circleMarker = L.circleMarker(self._event.latlng, mStyle)
.bindPopup(L.Util.template(t, {distance: distance, unit: unit}))
.addTo(self._layer);
} else {
self._circleMarker.setLatLng(self._event.latlng)
.bindPopup(L.Util.template(t, {distance: distance, unit: unit}))
._popup.setLatLng(self._event.latlng);
for (o in mStyle) {
self._circleMarker.options[o] = mStyle[o];
if (!this._marker) {
this._marker = new this.options.markerClass(latlng, mStyle).addTo(this._layer);
} else {
this._marker.setLatLng(latlng).setStyle(mStyle);
}
}
if (!self._container)
return;
if (self._following) {
setClasses('following');
} else {
setClasses('active');
var t = this.options.strings.popup;
if (this.options.showPopup && t && this._marker) {
this._marker
.bindPopup(L.Util.template(t, {distance: distance, unit: unit}))
._popup.setLatLng(latlng);
}
};
},
var setClasses = function(state) {
if (state == 'requesting') {
L.DomUtil.removeClasses(self._container, "active following");
L.DomUtil.addClasses(self._container, "requesting");
/**
* Remove the marker from map.
*/
_removeMarker: function() {
this._layer.clearLayers();
this._marker = undefined;
this._circle = undefined;
},
L.DomUtil.removeClasses(link, self.options.icon);
L.DomUtil.addClasses(link, self.options.iconLoading);
} else if (state == 'active') {
L.DomUtil.removeClasses(self._container, "requesting following");
L.DomUtil.addClasses(self._container, "active");
/**
* Unload the plugin and all event listeners.
* Kind of the opposite of onAdd.
*/
_unload: function() {
this.stop();
this._map.off('unload', this._unload, this);
},
L.DomUtil.removeClasses(link, self.options.iconLoading);
L.DomUtil.addClasses(link, self.options.icon);
} else if (state == 'following') {
L.DomUtil.removeClasses(self._container, "requesting");
L.DomUtil.addClasses(self._container, "active following");
L.DomUtil.removeClasses(link, self.options.iconLoading);
L.DomUtil.addClasses(link, self.options.icon);
}
}
var resetVariables = function() {
self._active = false;
self._locateOnNextLocationFound = self.options.setView;
self._following = false;
};
resetVariables();
var stopLocate = function() {
map.stopLocate();
map.off('dragstart', stopFollowing);
if (self.options.follow && self._following) {
stopFollowing();
}
L.DomUtil.removeClass(self._container, "requesting");
L.DomUtil.removeClass(self._container, "active");
L.DomUtil.removeClass(self._container, "following");
resetVariables();
self._layer.clearLayers();
self._circleMarker = undefined;
self._circle = undefined;
};
var onLocationError = function (err) {
/**
* Calls deactivate and dispatches an error.
*/
_onLocationError: function(err) {
// ignore time out error if the location is watched
if (err.code == 3 && self._locateOptions.watch) {
if (err.code == 3 && this.options.locateOptions.watch) {
return;
}
stopLocate();
self.options.onLocationError(err);
};
this.stop();
this.options.onLocationError(err, this);
},
// event hooks
map.on('locationfound', onLocationFound, self);
map.on('locationerror', onLocationError, self);
/**
* Stores the received event and updates the marker.
*/
_onLocationFound: function(e) {
// no need to do anything if the location has not changed
if (this._event &&
(this._event.latlng.lat === e.latlng.lat &&
this._event.latlng.lng === e.latlng.lng &&
this._event.accuracy === e.accuracy)) {
return;
}
// make locate functions available to outside world
this.locate = locate;
this.stopLocate = stopLocate;
this.stopFollowing = stopFollowing;
if (!this._active) {
// we may have a stray event
return;
}
return container;
}
});
this._event = e;
L.Map.addInitHook(function () {
if (this.options.locateControl) {
this.locateControl = L.control.locate();
this.addControl(this.locateControl);
}
});
this._drawMarker();
this._updateContainerStyle();
L.control.locate = function (options) {
return new L.Control.Locate(options);
};
switch (this.options.setView) {
case 'once':
if (this._justClicked) {
this.setView();
}
break;
case 'untilPan':
if (!this._userPanned) {
this.setView();
}
break;
case 'always':
this.setView();
break;
case false:
// don't set the view
break;
}
(function(){
// leaflet.js raises bug when trying to addClass / removeClass multiple classes at once
// Let's create a wrapper on it which fixes it.
var LDomUtilApplyClassesMethod = function(method, element, classNames) {
classNames = classNames.split(' ');
classNames.forEach(function(className) {
L.DomUtil[method].call(this, element, className);
this._justClicked = false;
},
/**
* When the user drags. Need a separate even so we can bind and unbind even listeners.
*/
_onDrag: function() {
// only react to drags once we have a location
if (this._event) {
this._userPanned = true;
this._updateContainerStyle();
this._drawMarker();
}
},
/**
* Compute whether the map is following the user location with pan and zoom.
*/
_isFollowing: function() {
if (!this._active) {
return false;
}
if (this.options.setView === 'always') {
return true;
} else if (this.options.setView === 'untilPan') {
return !this._userPanned;
}
},
/**
* Check if location is in map bounds
*/
_isOutsideMapBounds: function() {
if (this._event === undefined) {
return false;
}
return this._map.options.maxBounds &&
!this._map.options.maxBounds.contains(this._event.latlng);
},
/**
* Toggles button class between following and active.
*/
_updateContainerStyle: function() {
if (!this._container) {
return;
}
if (this._active && !this._event) {
// active but don't have a location yet
this._setClasses('requesting');
} else if (this._isFollowing()) {
this._setClasses('following');
} else if (this._active) {
this._setClasses('active');
} else {
this._cleanClasses();
}
},
/**
* Sets the CSS classes for the state.
*/
_setClasses: function(state) {
if (state == 'requesting') {
L.DomUtil.removeClasses(this._container, "active following");
L.DomUtil.addClasses(this._container, "requesting");
L.DomUtil.removeClasses(this._icon, this.options.icon);
L.DomUtil.addClasses(this._icon, this.options.iconLoading);
} else if (state == 'active') {
L.DomUtil.removeClasses(this._container, "requesting following");
L.DomUtil.addClasses(this._container, "active");
L.DomUtil.removeClasses(this._icon, this.options.iconLoading);
L.DomUtil.addClasses(this._icon, this.options.icon);
} else if (state == 'following') {
L.DomUtil.removeClasses(this._container, "requesting");
L.DomUtil.addClasses(this._container, "active following");
L.DomUtil.removeClasses(this._icon, this.options.iconLoading);
L.DomUtil.addClasses(this._icon, this.options.icon);
}
},
/**
* Removes all classes from button.
*/
_cleanClasses: function() {
L.DomUtil.removeClass(this._container, "requesting");
L.DomUtil.removeClass(this._container, "active");
L.DomUtil.removeClass(this._container, "following");
L.DomUtil.removeClasses(this._icon, this.options.iconLoading);
L.DomUtil.addClasses(this._icon, this.options.icon);
},
/**
* Reinitializes state variables.
*/
_resetVariables: function() {
// whether locate is active or not
this._active = false;
// true if the control was clicked for the first time
// we need this so we can pan and zoom once we have the location
this._justClicked = false;
// true if the user has panned the map after clicking the control
this._userPanned = false;
}
});
};
L.DomUtil.addClasses = function(el, names) { LDomUtilApplyClassesMethod('addClass', el, names); }
L.DomUtil.removeClasses = function(el, names) { LDomUtilApplyClassesMethod('removeClass', el, names); }
})();
L.control.locate = function (options) {
return new L.Control.Locate(options);
};
(function(){
// leaflet.js raises bug when trying to addClass / removeClass multiple classes at once
// Let's create a wrapper on it which fixes it.
var LDomUtilApplyClassesMethod = function(method, element, classNames) {
classNames = classNames.split(' ');
classNames.forEach(function(className) {
L.DomUtil[method].call(this, element, className);
});
};
L.DomUtil.addClasses = function(el, names) { LDomUtilApplyClassesMethod('addClass', el, names); };
L.DomUtil.removeClasses = function(el, names) { LDomUtilApplyClassesMethod('removeClass', el, names); };
})();
return LocateControl;
}, window));

View file

@ -13,225 +13,221 @@
*/
(function () {
'use strict';
'use strict';
var defaultOptions = function (options) {
if (typeof options === 'number') {
// Legacy
options = {
precision: options
};
} else {
options = options || {};
}
var defaultOptions = function (options) {
if (typeof options === 'number') {
// Legacy
options = {
precision: options
};
} else {
options = options || {};
}
options.precision = options.precision || 5;
options.factor = options.factor || Math.pow(10, options.precision);
options.dimension = options.dimension || 2;
return options;
};
options.precision = options.precision || 5;
options.factor = options.factor || Math.pow(10, options.precision);
options.dimension = options.dimension || 2;
return options;
};
var PolylineUtil = {
encode: function (points, options) {
options = defaultOptions(options);
var PolylineUtil = {
encode: function (points, options) {
options = defaultOptions(options);
var flatPoints = [];
for (var i = 0, len = points.length; i < len; ++i) {
var point = points[i];
var flatPoints = [];
for (var i = 0, len = points.length; i < len; ++i) {
var point = points[i];
if (options.dimension === 2) {
flatPoints.push(point.lat || point[0]);
flatPoints.push(point.lng || point[1]);
} else {
for (var dim = 0; dim < options.dimension; ++dim) {
flatPoints.push(point[dim]);
}
}
}
if (options.dimension === 2) {
flatPoints.push(point.lat || point[0]);
flatPoints.push(point.lng || point[1]);
} else {
for (var dim = 0; dim < options.dimension; ++dim) {
flatPoints.push(point[dim]);
}
}
}
return this.encodeDeltas(flatPoints, options);
},
return this.encodeDeltas(flatPoints, options);
},
decode: function (encoded, options) {
options = defaultOptions(options);
decode: function (encoded, options) {
options = defaultOptions(options);
var flatPoints = this.decodeDeltas(encoded, options);
var flatPoints = this.decodeDeltas(encoded, options);
var points = [];
for (var i = 0, len = flatPoints.length; i + (options.dimension - 1) < len;) {
var point = [];
var points = [];
for (var i = 0, len = flatPoints.length; i + (options.dimension - 1) < len;) {
var point = [];
for (var dim = 0; dim < options.dimension; ++dim) {
point.push(flatPoints[i++]);
}
for (var dim = 0; dim < options.dimension; ++dim) {
point.push(flatPoints[i++]);
}
points.push(point);
}
points.push(point);
}
return points;
},
return points;
},
encodeDeltas: function(numbers, options) {
options = defaultOptions(options);
encodeDeltas: function (numbers, options) {
options = defaultOptions(options);
var lastNumbers = [];
var lastNumbers = [];
for (var i = 0, len = numbers.length; i < len;) {
for (var d = 0; d < options.dimension; ++d, ++i) {
var num = numbers[i];
var delta = num - (lastNumbers[d] || 0);
lastNumbers[d] = num;
for (var i = 0, len = numbers.length; i < len;) {
for (var d = 0; d < options.dimension; ++d, ++i) {
var num = numbers[i];
var delta = num - (lastNumbers[d] || 0);
lastNumbers[d] = num;
numbers[i] = delta;
}
}
numbers[i] = delta;
}
}
return this.encodeFloats(numbers, options);
},
return this.encodeFloats(numbers, options);
},
decodeDeltas: function(encoded, options) {
options = defaultOptions(options);
decodeDeltas: function (encoded, options) {
options = defaultOptions(options);
var lastNumbers = [];
var lastNumbers = [];
var numbers = this.decodeFloats(encoded, options);
for (var i = 0, len = numbers.length; i < len;) {
for (var d = 0; d < options.dimension; ++d, ++i) {
numbers[i] = Math.round((lastNumbers[d] = numbers[i] + (lastNumbers[d] || 0)) * options.factor) / options.factor;
}
}
var numbers = this.decodeFloats(encoded, options);
for (var i = 0, len = numbers.length; i < len;) {
for (var d = 0; d < options.dimension; ++d, ++i) {
numbers[i] = Math.round((lastNumbers[d] = numbers[i] + (lastNumbers[d] || 0)) * options.factor) / options.factor;
}
}
return numbers;
},
return numbers;
},
encodeFloats: function(numbers, options) {
options = defaultOptions(options);
encodeFloats: function (numbers, options) {
options = defaultOptions(options);
for (var i = 0, len = numbers.length; i < len; ++i) {
numbers[i] = Math.round(numbers[i] * options.factor);
}
for (var i = 0, len = numbers.length; i < len; ++i) {
numbers[i] = Math.round(numbers[i] * options.factor);
}
return this.encodeSignedIntegers(numbers);
},
return this.encodeSignedIntegers(numbers);
},
decodeFloats: function(encoded, options) {
options = defaultOptions(options);
decodeFloats: function (encoded, options) {
options = defaultOptions(options);
var numbers = this.decodeSignedIntegers(encoded);
for (var i = 0, len = numbers.length; i < len; ++i) {
numbers[i] /= options.factor;
}
var numbers = this.decodeSignedIntegers(encoded);
for (var i = 0, len = numbers.length; i < len; ++i) {
numbers[i] /= options.factor;
}
return numbers;
},
return numbers;
},
/* jshint bitwise:false */
encodeSignedIntegers: function (numbers) {
for (var i = 0, len = numbers.length; i < len; ++i) {
var num = numbers[i];
numbers[i] = (num < 0) ? ~(num << 1) : (num << 1);
}
encodeSignedIntegers: function(numbers) {
for (var i = 0, len = numbers.length; i < len; ++i) {
var num = numbers[i];
numbers[i] = (num < 0) ? ~(num << 1) : (num << 1);
}
return this.encodeUnsignedIntegers(numbers);
},
return this.encodeUnsignedIntegers(numbers);
},
decodeSignedIntegers: function (encoded) {
var numbers = this.decodeUnsignedIntegers(encoded);
decodeSignedIntegers: function(encoded) {
var numbers = this.decodeUnsignedIntegers(encoded);
for (var i = 0, len = numbers.length; i < len; ++i) {
var num = numbers[i];
numbers[i] = (num & 1) ? ~(num >> 1) : (num >> 1);
}
for (var i = 0, len = numbers.length; i < len; ++i) {
var num = numbers[i];
numbers[i] = (num & 1) ? ~(num >> 1) : (num >> 1);
}
return numbers;
},
return numbers;
},
encodeUnsignedIntegers: function (numbers) {
var encoded = '';
for (var i = 0, len = numbers.length; i < len; ++i) {
encoded += this.encodeUnsignedInteger(numbers[i]);
}
return encoded;
},
encodeUnsignedIntegers: function(numbers) {
var encoded = '';
for (var i = 0, len = numbers.length; i < len; ++i) {
encoded += this.encodeUnsignedInteger(numbers[i]);
}
return encoded;
},
decodeUnsignedIntegers: function (encoded) {
var numbers = [];
decodeUnsignedIntegers: function(encoded) {
var numbers = [];
var current = 0;
var shift = 0;
var current = 0;
var shift = 0;
for (var i = 0, len = encoded.length; i < len; ++i) {
var b = encoded.charCodeAt(i) - 63;
for (var i = 0, len = encoded.length; i < len; ++i) {
var b = encoded.charCodeAt(i) - 63;
current |= (b & 0x1f) << shift;
current |= (b & 0x1f) << shift;
if (b < 0x20) {
numbers.push(current);
current = 0;
shift = 0;
} else {
shift += 5;
}
}
if (b < 0x20) {
numbers.push(current);
current = 0;
shift = 0;
} else {
shift += 5;
}
}
return numbers;
},
return numbers;
},
encodeSignedInteger: function (num) {
num = (num < 0) ? ~(num << 1) : (num << 1);
return this.encodeUnsignedInteger(num);
},
encodeSignedInteger: function (num) {
num = (num < 0) ? ~(num << 1) : (num << 1);
return this.encodeUnsignedInteger(num);
},
// This function is very similar to Google's, but I added
// some stuff to deal with the double slash issue.
encodeUnsignedInteger: function (num) {
var value, encoded = '';
while (num >= 0x20) {
value = (0x20 | (num & 0x1f)) + 63;
encoded += (String.fromCharCode(value));
num >>= 5;
}
value = num + 63;
encoded += (String.fromCharCode(value));
// This function is very similar to Google's, but I added
// some stuff to deal with the double slash issue.
encodeUnsignedInteger: function (num) {
var value, encoded = '';
while (num >= 0x20) {
value = (0x20 | (num & 0x1f)) + 63;
encoded += (String.fromCharCode(value));
num >>= 5;
}
value = num + 63;
encoded += (String.fromCharCode(value));
return encoded;
}
};
return encoded;
}
// Export Node module
if (typeof module === 'object' && typeof module.exports === 'object') {
module.exports = PolylineUtil;
}
/* jshint bitwise:true */
};
// Inject functionality into Leaflet
if (typeof L === 'object') {
if (!(L.Polyline.prototype.fromEncoded)) {
L.Polyline.fromEncoded = function (encoded, options) {
return L.polyline(PolylineUtil.decode(encoded), options);
};
}
if (!(L.Polygon.prototype.fromEncoded)) {
L.Polygon.fromEncoded = function (encoded, options) {
return L.polygon(PolylineUtil.decode(encoded), options);
};
}
// Export Node module
if (typeof module === 'object' && typeof module.exports === 'object') {
module.exports = PolylineUtil;
}
var encodeMixin = {
encodePath: function () {
return PolylineUtil.encode(this.getLatLngs());
}
};
// Inject functionality into Leaflet
if (typeof L === 'object') {
if (!(L.Polyline.prototype.fromEncoded)) {
L.Polyline.fromEncoded = function (encoded, options) {
return new L.Polyline(PolylineUtil.decode(encoded), options);
};
}
if (!(L.Polygon.prototype.fromEncoded)) {
L.Polygon.fromEncoded = function (encoded, options) {
return new L.Polygon(PolylineUtil.decode(encoded), options);
};
}
if (!L.Polyline.prototype.encodePath) {
L.Polyline.include(encodeMixin);
}
if (!L.Polygon.prototype.encodePath) {
L.Polygon.include(encodeMixin);
}
var encodeMixin = {
encodePath: function () {
return PolylineUtil.encode(this.getLatLngs());
}
};
if (!L.Polyline.prototype.encodePath) {
L.Polyline.include(encodeMixin);
}
if (!L.Polygon.prototype.encodePath) {
L.Polygon.include(encodeMixin);
}
L.PolylineUtil = PolylineUtil;
}
L.PolylineUtil = PolylineUtil;
}
})();