Fix error and inconsistencies INSTALL.md

[rails.git] / vendor / assets / leaflet / leaflet.locate.js

diff --git a/vendor/assets/leaflet/leaflet.locate.js b/vendor/assets/leaflet/leaflet.locate.js
index 89b4e8ce431a3c31d27ebf5c6c28fb42cad55ecd..822b24da23daa0490be3a2bd62bee181f09da3c5 100644 (file)
--- a/vendor/assets/leaflet/leaflet.locate.js
+++ b/vendor/assets/leaflet/leaflet.locate.js
@@ -1,16 +1,23 @@
+/*
+Copyright (c) 2014 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
 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: {
         // range circle
         circleStyle: {

-                color: '#136AEC',
-                fillColor: '#136AEC',
-                fillOpacity: 0.15,
-                weight: 2,
-                opacity: 0.5
-            },
+            color: '#136AEC',
+            fillColor: '#136AEC',
+            fillOpacity: 0.15,
+            weight: 2,
+            opacity: 0.5
+        },

         // inner marker
         markerStyle: {
             color: '#136AEC',
         // inner marker
         markerStyle: {
             color: '#136AEC',


@@ -18,106 +25,183 @@ L.Control.Locate = L.Control.extend({
             fillOpacity: 0.7,
             weight: 2,
             opacity: 0.9,
             fillOpacity: 0.7,
             weight: 2,
             opacity: 0.9,

-            radius: 4
+            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,
         metric: true,

-        debug: false,

         onLocationError: function(err) {
         onLocationError: function(err) {

+            // this event is called in case of any location error
+            // that is not a time out error.

             alert(err.message);
         },
             alert(err.message);
         },

-        title: "Show me where I am",
-        popupText: ["You are within ", " from this point"],
+        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
         setView: true, // automatically sets the map view to the user's location

-        locateOptions: {}
+        // 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
+        }

     },
 
     onAdd: function (map) {
     },
 
     onAdd: function (map) {

-        var className = 'leaflet-control-locate',
-            classNames = className + ' leaflet-control-zoom leaflet-bar leaflet-control',
-            container = L.DomUtil.create('div', classNames);
+        var container = L.DomUtil.create('div', 'control-locate');

 
         var self = this;
         this._layer = new L.LayerGroup();
         this._layer.addTo(map);
         this._event = undefined;
 
         var self = this;
         this._layer = new L.LayerGroup();
         this._layer.addTo(map);
         this._event = undefined;

-        // nested extend so that the first can overwrite the second
-        // and the second can overwrite the third
-        this._locateOptions = L.extend(L.extend({
-            'setView': false // have to set this to false because we have to
-                             // do setView manually
-        }, this.options.locateOptions), {
-            'watch': true  // if you overwrite this, visualization cannot be updated
+
+        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

         });
 
         });
 

-        var link = L.DomUtil.create('a', 'leaflet-bar-part leaflet-bar-part-single', container);
-        link.href = '#';
-        link.title = this.options.title;
+        // 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 _log = function(data) {
-            if (self.options.debug) {
-                console.log(data);
-            }
-        };
+        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() {
 
         L.DomEvent
             .on(link, 'click', L.DomEvent.stopPropagation)
             .on(link, 'click', L.DomEvent.preventDefault)
             .on(link, 'click', function() {

-                if (self._active && (map.getBounds().contains(self._event.latlng) || !self.options.setView)) {
+                if (self._active && (self._event === undefined || map.getBounds().contains(self._event.latlng) || !self.options.setView ||
+                    isOutsideMapBounds())) {

                     stopLocate();
                 } else {
                     stopLocate();
                 } else {

-                    if (self.options.setView) {
-                        self._locateOnNextLocationFound = true;
-                    }
-                    if(!self._active) {
-                        map.locate(self._locateOptions);
-                    }
-                    self._active = true;
-                    if (!self._event) {
-                        self._container.className = classNames + " requesting";
-                    } else {
-                        visualizeLocation();
-                    }
+                    locate();

                 }
             })
             .on(link, 'dblclick', L.DomEvent.stopPropagation);
 
                 }
             })
             .on(link, 'dblclick', L.DomEvent.stopPropagation);
 

-        var onLocationFound = function (e) {
-            _log('onLocationFound');
-
+        var locate = function () {
+            if (self.options.setView) {
+                self._locateOnNextLocationFound = true;
+            }
+            if(!self._active) {
+                map.locate(self._locateOptions);
+            }

             self._active = true;
             self._active = true;

+            if (self.options.follow) {
+                startFollowing();
+            }
+            if (!self._event) {
+                setClasses('requesting');
+            } else {
+                visualizeLocation();
+            }
+        };

 
 

+        var onLocationFound = function (e) {
+            // no need to do anything if the location has not changed

             if (self._event &&
             if (self._event &&

-                (self._event.latlng.lat != e.latlng.lat ||
-                 self._event.latlng.lng != e.latlng.lng)) {
-                _log('location has changed');
+                (self._event.latlng.lat === e.latlng.lat &&
+                 self._event.latlng.lng === e.latlng.lng &&
+                 self._event.accuracy === e.accuracy)) {
+                return;
+            }
+
+            if (!self._active) {
+                return;

             }
 
             self._event = e;
 
             }
 
             self._event = e;
 

-            if (self.options.follow) {
+            if (self.options.follow && self._following) {

                 self._locateOnNextLocationFound = true;
             }
 
             visualizeLocation();
         };
 
                 self._locateOnNextLocationFound = true;
             }
 
             visualizeLocation();
         };
 

-        var visualizeLocation = function() {
-            _log('visualizeLocation,' + 'setView:' + self._locateOnNextLocationFound);
+        var startFollowing = function() {
+            map.fire('startfollowing', self);
+            self._following = true;
+            if (self.options.stopFollowingOnDrag) {
+                map.on('dragstart', stopFollowing);
+            }
+        };

 
 

-            var radius = self._event.accuracy / 2;
+        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 (self._locateOnNextLocationFound) {

-                map.fitBounds(self._event.bounds);
+                if (isOutsideMapBounds()) {
+                    self.options.onLocationOutsideMapBounds(self);
+                } else {
+                    map.fitBounds(self._event.bounds, {
+                        padding: self.options.circlePadding,
+                        maxZoom: self.options.keepCurrentZoomLevel ? map.getZoom() : self._locateOptions.maxZoom
+                    });
+                }

                 self._locateOnNextLocationFound = false;
             }
 
                 self._locateOnNextLocationFound = false;
             }
 

-            self._layer.clearLayers();
-

             // circle with the radius of the location's accuracy
             // circle with the radius of the location's accuracy

+            var style, o;

             if (self.options.drawCircle) {
             if (self.options.drawCircle) {

-                L.circle(self._event.latlng, radius, self.options.circleStyle)
-                    .addTo(self._layer);
+                if (self._following) {
+                    style = self.options.followCircleStyle;
+                } else {
+                    style = self.options.circleStyle;
+                }
+
+                if (!self._circle) {
+                    self._circle = L.circle(self._event.latlng, radius, style)
+                        .addTo(self._layer);
+                } else {
+                    self._circle.setLatLng(self._event.latlng).setRadius(radius);
+                    for (o in style) {
+                        self._circle.options[o] = style[o];
+                    }
+                }

             }
 
             var distance, unit;
             }
 
             var distance, unit;


@@ -130,39 +214,86 @@ L.Control.Locate = L.Control.extend({
             }
 
             // small inner marker
             }
 
             // small inner marker

-            var t = self.options.popupText;
-            L.circleMarker(self._event.latlng, self.options.markerStyle)
-                .bindPopup(t[0] + distance + " " + unit  + t[1])
-                .addTo(self._layer);
+            var mStyle;
+            if (self._following) {
+                mStyle = self.options.followMarkerStyle;
+            } else {
+                mStyle = self.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 (!self._container)
                 return;
 
             if (!self._container)
                 return;

-            self._container.className = classNames + " active";
+            if (self._following) {
+                setClasses('following');
+            } else {
+                setClasses('active');
+            }

         };
 
         };
 

+        var setClasses = function(state) {
+            if (state == 'requesting') {
+                L.DomUtil.removeClasses(self._container, "active following");
+                L.DomUtil.addClasses(self._container, "requesting");
+
+                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");
+
+                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;
         var resetVariables = function() {
             self._active = false;

-            self._locateOnNextLocationFound = true;
+            self._locateOnNextLocationFound = self.options.setView;
+            self._following = false;

         };
 
         resetVariables();
 
         var stopLocate = function() {
         };
 
         resetVariables();
 
         var stopLocate = function() {

-            _log('stopLocate');

             map.stopLocate();
             map.stopLocate();

+            map.off('dragstart', stopFollowing);
+            if (self.options.follow && self._following) {
+                stopFollowing();
+            }

 
 

-            self._container.className = classNames;
+            L.DomUtil.removeClass(self._container, "requesting");
+            L.DomUtil.removeClass(self._container, "active");
+            L.DomUtil.removeClass(self._container, "following");

             resetVariables();
 
             self._layer.clearLayers();
             resetVariables();
 
             self._layer.clearLayers();

+            self._circleMarker = undefined;
+            self._circle = undefined;

         };
 
         };
 

-

         var onLocationError = function (err) {
         var onLocationError = function (err) {

-            _log('onLocationError');
-
-            // ignore timeout error if the location is watched
-            if (err.code==3 && this._locateOptions.watch) {
+            // ignore time out error if the location is watched
+            if (err.code == 3 && self._locateOptions.watch) {

                 return;
             }
 
                 return;
             }
 


@@ -174,6 +305,11 @@ L.Control.Locate = L.Control.extend({
         map.on('locationfound', onLocationFound, self);
         map.on('locationerror', onLocationError, self);
 
         map.on('locationfound', onLocationFound, self);
         map.on('locationerror', onLocationError, self);
 

+        // make locate functions available to outside world
+        this.locate = locate;
+        this.stopLocate = stopLocate;
+        this.stopFollowing = stopFollowing;
+

         return container;
     }
 });
         return container;
     }
 });


@@ -188,3 +324,17 @@ L.Map.addInitHook(function () {
 L.control.locate = function (options) {
     return new L.Control.Locate(options);
 };
 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); }
+})();