X-Git-Url: https://git.openstreetmap.org./rails.git/blobdiff_plain/cec2253b82b3a3861e8e5875f256d6ec10835160..359d030a5b19de5e28460d5c9b2d0e1a59ed2fd3:/vendor/assets/leaflet/leaflet.js?ds=sidebyside diff --git a/vendor/assets/leaflet/leaflet.js b/vendor/assets/leaflet/leaflet.js index 0795a7de9..d3d563574 100644 --- a/vendor/assets/leaflet/leaflet.js +++ b/vendor/assets/leaflet/leaflet.js @@ -7,7 +7,7 @@ var oldL = window.L, L = {}; -L.version = '0.6'; +L.version = '0.7.7'; // define Leaflet for Node module pattern loaders, including Browserify if (typeof module === 'object' && typeof module.exports === 'object') { @@ -134,7 +134,6 @@ L.Util = { } return ((!existingUrl || existingUrl.indexOf('?') === -1) ? '?' : '&') + params.join('&'); }, - template: function (str, data) { return str.replace(/\{ *([\w_]+) *\}/g, function (str, key) { var value = data[key]; @@ -147,7 +146,7 @@ L.Util = { }); }, - isArray: function (obj) { + isArray: Array.isArray || function (obj) { return (Object.prototype.toString.call(obj) === '[object Array]'); }, @@ -337,7 +336,7 @@ L.Mixin.Events = { if (L.Util.invokeEach(types, this.addEventListener, this, fn, context)) { return this; } var events = this[eventsKey] = this[eventsKey] || {}, - contextId = context && L.stamp(context), + contextId = context && context !== this && L.stamp(context), i, len, event, type, indexKey, indexLenKey, typeIndex; // types can be a string of space-separated words @@ -350,7 +349,7 @@ L.Mixin.Events = { }; type = types[i]; - if (context) { + if (contextId) { // store listeners of a particular context in a separate hash (if it has an id) // gives a major performance boost when removing thousands of map layers @@ -397,7 +396,7 @@ L.Mixin.Events = { if (L.Util.invokeEach(types, this.removeEventListener, this, fn, context)) { return this; } var events = this[eventsKey], - contextId = context && L.stamp(context), + contextId = context && context !== this && L.stamp(context), i, len, type, listeners, j, indexKey, indexLenKey, typeIndex, removed; types = L.Util.splitWords(types); @@ -413,9 +412,10 @@ L.Mixin.Events = { // clear all listeners for a type if function isn't specified delete events[type]; delete events[indexKey]; + delete events[indexLenKey]; } else { - listeners = context && typeIndex ? typeIndex[contextId] : events[type]; + listeners = contextId && typeIndex ? typeIndex[contextId] : events[type]; if (listeners) { for (j = listeners.length - 1; j >= 0; j--) { @@ -458,7 +458,7 @@ L.Mixin.Events = { listeners = events[type].slice(); for (i = 0, len = listeners.length; i < len; i++) { - listeners[i].action.call(listeners[i].context || this, event); + listeners[i].action.call(listeners[i].context, event); } } @@ -470,7 +470,7 @@ L.Mixin.Events = { if (listeners) { for (i = 0, len = listeners.length; i < len; i++) { - listeners[i].action.call(listeners[i].context || this, event); + listeners[i].action.call(listeners[i].context, event); } } } @@ -506,9 +506,7 @@ L.Mixin.Events.fire = L.Mixin.Events.fireEvent; (function () { - var ie = !!window.ActiveXObject, - ie6 = ie && !window.XMLHttpRequest, - ie7 = ie && !document.querySelector, + var ie = 'ActiveXObject' in window, ielt9 = ie && !document.addEventListener, // terrible browser detection to work around Safari / iOS / Android browser bugs @@ -518,60 +516,31 @@ L.Mixin.Events.fire = L.Mixin.Events.fireEvent; phantomjs = ua.indexOf('phantom') !== -1, android = ua.indexOf('android') !== -1, android23 = ua.search('android [23]') !== -1, + gecko = ua.indexOf('gecko') !== -1, mobile = typeof orientation !== undefined + '', - msTouch = window.navigator && window.navigator.msPointerEnabled && - window.navigator.msMaxTouchPoints, + msPointer = !window.PointerEvent && window.MSPointerEvent, + pointer = (window.PointerEvent && window.navigator.pointerEnabled) || + msPointer, retina = ('devicePixelRatio' in window && window.devicePixelRatio > 1) || ('matchMedia' in window && window.matchMedia('(min-resolution:144dpi)') && window.matchMedia('(min-resolution:144dpi)').matches), doc = document.documentElement, ie3d = ie && ('transition' in doc.style), - webkit3d = ('WebKitCSSMatrix' in window) && ('m11' in new window.WebKitCSSMatrix()), + webkit3d = ('WebKitCSSMatrix' in window) && ('m11' in new window.WebKitCSSMatrix()) && !android23, gecko3d = 'MozPerspective' in doc.style, opera3d = 'OTransition' in doc.style, any3d = !window.L_DISABLE_3D && (ie3d || webkit3d || gecko3d || opera3d) && !phantomjs; - - // PhantomJS has 'ontouchstart' in document.documentElement, but doesn't actually support touch. - // https://github.com/Leaflet/Leaflet/pull/1434#issuecomment-13843151 - - var touch = !window.L_NO_TOUCH && !phantomjs && (function () { - - var startName = 'ontouchstart'; - - // IE10+ (We simulate these into touch* events in L.DomEvent and L.DomEvent.MsTouch) or WebKit, etc. - if (msTouch || (startName in doc)) { - return true; - } - - // Firefox/Gecko - var div = document.createElement('div'), - supported = false; - - if (!div.setAttribute) { - return false; - } - div.setAttribute(startName, 'return;'); - - if (typeof div[startName] === 'function') { - supported = true; - } - - div.removeAttribute(startName); - div = null; - - return supported; - }()); - + var touch = !window.L_NO_TOUCH && !phantomjs && (pointer || 'ontouchstart' in window || + (window.DocumentTouch && document instanceof window.DocumentTouch)); L.Browser = { ie: ie, - ie6: ie6, - ie7: ie7, ielt9: ielt9, webkit: webkit, + gecko: gecko && !webkit && !window.opera && !ie, android: android, android23: android23, @@ -590,7 +559,8 @@ L.Mixin.Events.fire = L.Mixin.Events.fireEvent; mobileOpera: mobile && window.opera, touch: touch, - msTouch: msTouch, + msPointer: msPointer, + pointer: pointer, retina: retina }; @@ -881,8 +851,7 @@ L.DomUtil = { el = element, docBody = document.body, docEl = document.documentElement, - pos, - ie7 = L.Browser.ie7; + pos; do { top += el.offsetTop || 0; @@ -929,19 +898,6 @@ L.DomUtil = { top -= el.scrollTop || 0; left -= el.scrollLeft || 0; - // webkit (and ie <= 7) handles RTL scrollLeft different to everyone else - // https://code.google.com/p/closure-library/source/browse/trunk/closure/goog/style/bidi.js - if (!L.DomUtil.documentIsLtr() && (L.Browser.webkit || ie7)) { - left += el.scrollWidth - el.clientWidth; - - // ie7 shows the scrollbar by default and provides clientWidth counting it, so we - // need to add it back in if it is visible; scrollbar is on the left as we are RTL - if (ie7 && L.DomUtil.getStyle(el, 'overflow-y') !== 'hidden' && - L.DomUtil.getStyle(el, 'overflow') !== 'hidden') { - left += 17; - } - } - el = el.parentNode; } while (el); @@ -969,18 +925,44 @@ L.DomUtil = { }, hasClass: function (el, name) { - return (el.className.length > 0) && - new RegExp('(^|\\s)' + name + '(\\s|$)').test(el.className); + if (el.classList !== undefined) { + return el.classList.contains(name); + } + var className = L.DomUtil._getClass(el); + return className.length > 0 && new RegExp('(^|\\s)' + name + '(\\s|$)').test(className); }, addClass: function (el, name) { - if (!L.DomUtil.hasClass(el, name)) { - el.className += (el.className ? ' ' : '') + name; + if (el.classList !== undefined) { + var classes = L.Util.splitWords(name); + for (var i = 0, len = classes.length; i < len; i++) { + el.classList.add(classes[i]); + } + } else if (!L.DomUtil.hasClass(el, name)) { + var className = L.DomUtil._getClass(el); + L.DomUtil._setClass(el, (className ? className + ' ' : '') + name); } }, removeClass: function (el, name) { - el.className = L.Util.trim((' ' + el.className + ' ').replace(' ' + name + ' ', ' ')); + if (el.classList !== undefined) { + el.classList.remove(name); + } else { + L.DomUtil._setClass(el, L.Util.trim((' ' + L.DomUtil._getClass(el) + ' ').replace(' ' + name + ' ', ' '))); + } + }, + + _setClass: function (el, name) { + if (el.className.baseVal === undefined) { + el.className = name; + } else { + // in case of SVG element + el.className.baseVal = name; + } + }, + + _getClass: function (el) { + return el.className.baseVal === undefined ? el.className : el.className.baseVal; }, setOpacity: function (el, value) { @@ -1052,11 +1034,6 @@ L.DomUtil = { if (!disable3D && L.Browser.any3d) { el.style[L.DomUtil.TRANSFORM] = L.DomUtil.getTranslateString(point); - - // workaround for Android 2/3 stability (https://github.com/CloudMade/Leaflet/issues/69) - if (L.Browser.mobileWebkit3d) { - el.style.WebkitBackfaceVisibility = 'hidden'; - } } else { el.style.left = point.x + 'px'; el.style.top = point.y + 'px'; @@ -1089,49 +1066,45 @@ L.DomUtil.TRANSITION_END = L.DomUtil.TRANSITION + 'End' : 'transitionend'; (function () { - var userSelectProperty = L.DomUtil.testProp( - ['userSelect', 'WebkitUserSelect', 'OUserSelect', 'MozUserSelect', 'msUserSelect']); - - var userDragProperty = L.DomUtil.testProp( - ['userDrag', 'WebkitUserDrag', 'OUserDrag', 'MozUserDrag', 'msUserDrag']); + if ('onselectstart' in document) { + L.extend(L.DomUtil, { + disableTextSelection: function () { + L.DomEvent.on(window, 'selectstart', L.DomEvent.preventDefault); + }, + + enableTextSelection: function () { + L.DomEvent.off(window, 'selectstart', L.DomEvent.preventDefault); + } + }); + } else { + var userSelectProperty = L.DomUtil.testProp( + ['userSelect', 'WebkitUserSelect', 'OUserSelect', 'MozUserSelect', 'msUserSelect']); + + L.extend(L.DomUtil, { + disableTextSelection: function () { + if (userSelectProperty) { + var style = document.documentElement.style; + this._userSelect = style[userSelectProperty]; + style[userSelectProperty] = 'none'; + } + }, + + enableTextSelection: function () { + if (userSelectProperty) { + document.documentElement.style[userSelectProperty] = this._userSelect; + delete this._userSelect; + } + } + }); + } L.extend(L.DomUtil, { - disableTextSelection: function () { - if (userSelectProperty) { - var style = document.documentElement.style; - this._userSelect = style[userSelectProperty]; - style[userSelectProperty] = 'none'; - } else { - L.DomEvent.on(window, 'selectstart', L.DomEvent.stop); - } - }, - - enableTextSelection: function () { - if (userSelectProperty) { - document.documentElement.style[userSelectProperty] = this._userSelect; - delete this._userSelect; - } else { - L.DomEvent.off(window, 'selectstart', L.DomEvent.stop); - } - }, - disableImageDrag: function () { - if (userDragProperty) { - var style = document.documentElement.style; - this._userDrag = style[userDragProperty]; - style[userDragProperty] = 'none'; - } else { - L.DomEvent.on(window, 'dragstart', L.DomEvent.stop); - } + L.DomEvent.on(window, 'dragstart', L.DomEvent.preventDefault); }, enableImageDrag: function () { - if (userDragProperty) { - document.documentElement.style[userDragProperty] = this._userDrag; - delete this._userDrag; - } else { - L.DomEvent.off(window, 'dragstart', L.DomEvent.stop); - } + L.DomEvent.off(window, 'dragstart', L.DomEvent.preventDefault); } }); })(); @@ -1141,16 +1114,20 @@ L.DomUtil.TRANSITION_END = * L.LatLng represents a geographical point with latitude and longitude coordinates. */ -L.LatLng = function (rawLat, rawLng) { // (Number, Number) - var lat = parseFloat(rawLat), - lng = parseFloat(rawLng); +L.LatLng = function (lat, lng, alt) { // (Number, Number, Number) + lat = parseFloat(lat); + lng = parseFloat(lng); if (isNaN(lat) || isNaN(lng)) { - throw new Error('Invalid LatLng object: (' + rawLat + ', ' + rawLng + ')'); + throw new Error('Invalid LatLng object: (' + lat + ', ' + lng + ')'); } this.lat = lat; this.lng = lng; + + if (alt !== undefined) { + this.alt = parseFloat(alt); + } }; L.extend(L.LatLng, { @@ -1214,7 +1191,11 @@ L.latLng = function (a, b) { // (LatLng) or ([Number, Number]) or (Number, Numbe return a; } if (L.Util.isArray(a)) { - return new L.LatLng(a[0], a[1]); + if (typeof a[0] === 'number' || typeof a[0] === 'string') { + return new L.LatLng(a[0], a[1], a[2]); + } else { + return null; + } } if (a === undefined || a === null) { return a; @@ -1222,6 +1203,9 @@ L.latLng = function (a, b) { // (LatLng) or ([Number, Number]) or (Number, Numbe if (typeof a === 'object' && 'lat' in a) { return new L.LatLng(a.lat, 'lng' in a ? a.lng : a.lon); } + if (b === undefined) { + return null; + } return new L.LatLng(a, b); }; @@ -1246,8 +1230,9 @@ L.LatLngBounds.prototype = { extend: function (obj) { // (LatLng) or (LatLngBounds) if (!obj) { return this; } - if (typeof obj[0] === 'number' || typeof obj[0] === 'string' || obj instanceof L.LatLng) { - obj = L.latLng(obj); + var latLng = L.latLng(obj); + if (latLng !== null) { + obj = latLng; } else { obj = L.latLngBounds(obj); } @@ -1460,6 +1445,11 @@ L.CRS = { scale: function (zoom) { return 256 * Math.pow(2, zoom); + }, + + getSize: function (zoom) { + var s = this.scale(zoom); + return L.point(s, s); } }; @@ -1538,8 +1528,13 @@ L.Map = L.Class.extend({ initialize: function (id, options) { // (HTMLElement or String, Object) options = L.setOptions(this, options); + this._initContainer(id); this._initLayout(); + + // hack for https://github.com/Leaflet/Leaflet/issues/1980 + this._onResize = L.bind(this._onResize, this); + this._initEvents(); if (options.maxBounds) { @@ -1566,11 +1561,16 @@ L.Map = L.Class.extend({ // replaced by animation-powered implementation in Map.PanAnimation.js setView: function (center, zoom) { + zoom = zoom === undefined ? this.getZoom() : zoom; this._resetView(L.latLng(center), this._limitZoom(zoom)); return this; }, setZoom: function (zoom, options) { + if (!this._loaded) { + this._zoom = this._limitZoom(zoom); + return this; + } return this.setView(this.getCenter(), zoom, {zoom: options}); }, @@ -1601,8 +1601,11 @@ L.Map = L.Class.extend({ var paddingTL = L.point(options.paddingTopLeft || options.padding || [0, 0]), paddingBR = L.point(options.paddingBottomRight || options.padding || [0, 0]), - zoom = this.getBoundsZoom(bounds, false, paddingTL.add(paddingBR)), - paddingOffset = paddingBR.subtract(paddingTL).divideBy(2), + zoom = this.getBoundsZoom(bounds, false, paddingTL.add(paddingBR)); + + zoom = (options.maxZoom) ? Math.min(options.maxZoom, zoom) : zoom; + + var paddingOffset = paddingBR.subtract(paddingTL).divideBy(2), swPoint = this.project(bounds.getSouthWest(), zoom), nePoint = this.project(bounds.getNorthEast(), zoom), @@ -1620,7 +1623,7 @@ L.Map = L.Class.extend({ }, panBy: function (offset) { // (Point) - // replaced with animated panBy in Map.Animation.js + // replaced with animated panBy in Map.PanAnimation.js this.fire('movestart'); this._rawPanBy(L.point(offset)); @@ -1635,57 +1638,23 @@ L.Map = L.Class.extend({ this.options.maxBounds = bounds; if (!bounds) { - this._boundsMinZoom = null; - this.off('moveend', this._panInsideMaxBounds, this); - return this; + return this.off('moveend', this._panInsideMaxBounds, this); } - var minZoom = this.getBoundsZoom(bounds, true); - - this._boundsMinZoom = minZoom; - if (this._loaded) { - if (this._zoom < minZoom) { - this.setView(bounds.getCenter(), minZoom); - } else { - this.panInsideBounds(bounds); - } + this._panInsideMaxBounds(); } - this.on('moveend', this._panInsideMaxBounds, this); - - return this; + return this.on('moveend', this._panInsideMaxBounds, this); }, - panInsideBounds: function (bounds) { - bounds = L.latLngBounds(bounds); - - var viewBounds = this.getPixelBounds(), - viewSw = viewBounds.getBottomLeft(), - viewNe = viewBounds.getTopRight(), - sw = this.project(bounds.getSouthWest()), - ne = this.project(bounds.getNorthEast()), - dx = 0, - dy = 0; - - if (viewNe.y < ne.y) { // north - dy = Math.ceil(ne.y - viewNe.y); - } - if (viewNe.x > ne.x) { // east - dx = Math.floor(ne.x - viewNe.x); - } - if (viewSw.y > sw.y) { // south - dy = Math.floor(sw.y - viewSw.y); - } - if (viewSw.x < sw.x) { // west - dx = Math.ceil(sw.x - viewSw.x); - } + panInsideBounds: function (bounds, options) { + var center = this.getCenter(), + newCenter = this._limitCenter(center, this._zoom, bounds); - if (dx || dy) { - return this.panBy([dx, dy]); - } + if (center.equals(newCenter)) { return this; } - return this; + return this.panTo(newCenter, options); }, addLayer: function (layer) { @@ -1720,14 +1689,18 @@ L.Map = L.Class.extend({ removeLayer: function (layer) { var id = L.stamp(layer); - if (!this._layers[id]) { return; } + if (!this._layers[id]) { return this; } if (this._loaded) { layer.onRemove(this); - this.fire('layerremove', {layer: layer}); } delete this._layers[id]; + + if (this._loaded) { + this.fire('layerremove', {layer: layer}); + } + if (this._zoomBoundLayers[id]) { delete this._zoomBoundLayers[id]; this._updateZoomLevels(); @@ -1757,6 +1730,8 @@ L.Map = L.Class.extend({ }, invalidateSize: function (options) { + if (!this._loaded) { return this; } + options = L.extend({ animate: false, pan: true @@ -1764,15 +1739,12 @@ L.Map = L.Class.extend({ var oldSize = this.getSize(); this._sizeChanged = true; - - if (this.options.maxBounds) { - this.setMaxBounds(this.options.maxBounds); - } - - if (!this._loaded) { return this; } + this._initialCenter = null; var newSize = this.getSize(), - offset = oldSize.subtract(newSize).divideBy(2).round(); + oldCenter = oldSize.divideBy(2).round(), + newCenter = newSize.divideBy(2).round(), + offset = oldCenter.subtract(newCenter); if (!offset.x && !offset.y) { return this; } @@ -1786,9 +1758,12 @@ L.Map = L.Class.extend({ this.fire('move'); - // make sure moveend is not fired too often on resize - clearTimeout(this._sizeTimer); - this._sizeTimer = setTimeout(L.bind(this.fire, this, 'moveend'), 200); + if (options.debounceMoveend) { + clearTimeout(this._sizeTimer); + this._sizeTimer = setTimeout(L.bind(this.fire, this, 'moveend'), 200); + } else { + this.fire('moveend'); + } } return this.fire('resize', { @@ -1799,7 +1774,7 @@ L.Map = L.Class.extend({ // TODO handler.addTo addHandler: function (name, HandlerClass) { - if (!HandlerClass) { return; } + if (!HandlerClass) { return this; } var handler = this[name] = new HandlerClass(this); @@ -1819,7 +1794,12 @@ L.Map = L.Class.extend({ this._initEvents('off'); - delete this._container._leaflet; + try { + // throws error in IE6-8 + delete this._container._leaflet; + } catch (e) { + this._container._leaflet = undefined; + } this._clearPanes(); if (this._clearControlPos) { @@ -1837,7 +1817,7 @@ L.Map = L.Class.extend({ getCenter: function () { // (Boolean) -> LatLng this._checkIfLoaded(); - if (!this._moved()) { + if (this._initialCenter && !this._moved()) { return this._initialCenter; } return this.layerPointToLatLng(this._getCenterLayerPoint()); @@ -1856,18 +1836,15 @@ L.Map = L.Class.extend({ }, getMinZoom: function () { - var z1 = this.options.minZoom || 0, - z2 = this._layersMinZoom || 0, - z3 = this._boundsMinZoom || 0; - - return Math.max(z1, z2, z3); + return this.options.minZoom === undefined ? + (this._layersMinZoom === undefined ? 0 : this._layersMinZoom) : + this.options.minZoom; }, getMaxZoom: function () { - var z1 = this.options.maxZoom === undefined ? Infinity : this.options.maxZoom, - z2 = this._layersMaxZoom === undefined ? Infinity : this._layersMaxZoom; - - return Math.min(z1, z2); + return this.options.maxZoom === undefined ? + (this._layersMaxZoom === undefined ? Infinity : this._layersMaxZoom) : + this.options.maxZoom; }, getBoundsZoom: function (bounds, inside, padding) { // (LatLngBounds[, Boolean, Point]) -> Number @@ -2013,6 +1990,7 @@ L.Map = L.Class.extend({ L.DomUtil.addClass(container, 'leaflet-container' + (L.Browser.touch ? ' leaflet-touch' : '') + (L.Browser.retina ? ' leaflet-retina' : '') + + (L.Browser.ielt9 ? ' leaflet-oldie' : '') + (this.options.fadeAnimation ? ' leaflet-fade-anim' : '')); var position = L.DomUtil.getStyle(container, 'position'); @@ -2096,13 +2074,13 @@ L.Map = L.Class.extend({ var loading = !this._loaded; this._loaded = true; + this.fire('viewreset', {hard: !preserveMapOffset}); + if (loading) { this.fire('load'); this.eachLayer(this._layerAdd, this); } - this.fire('viewreset', {hard: !preserveMapOffset}); - this.fire('move'); if (zoomChanged || afterZoomAnim) { @@ -2183,20 +2161,21 @@ L.Map = L.Class.extend({ _onResize: function () { L.Util.cancelAnimFrame(this._resizeRequest); this._resizeRequest = L.Util.requestAnimFrame( - this.invalidateSize, this, false, this._container); + function () { this.invalidateSize({debounceMoveend: true}); }, this, false, this._container); }, _onMouseClick: function (e) { - // jshint camelcase: false - if (!this._loaded || (!e._simulated && this.dragging && this.dragging.moved()) || e._leaflet_stop) { return; } + if (!this._loaded || (!e._simulated && + ((this.dragging && this.dragging.moved()) || + (this.boxZoom && this.boxZoom.moved()))) || + L.DomEvent._skipped(e)) { return; } this.fire('preclick'); this._fireMouseEvent(e); }, _fireMouseEvent: function (e) { - // jshint camelcase: false - if (!this._loaded || e._leaflet_stop) { return; } + if (!this._loaded || L.DomEvent._skipped(e)) { return; } var type = e.type; @@ -2284,6 +2263,46 @@ L.Map = L.Class.extend({ return this.latLngToLayerPoint(latlng).subtract(this._getCenterLayerPoint()); }, + // adjust center for view to get inside bounds + _limitCenter: function (center, zoom, bounds) { + + if (!bounds) { return center; } + + var centerPoint = this.project(center, zoom), + viewHalf = this.getSize().divideBy(2), + viewBounds = new L.Bounds(centerPoint.subtract(viewHalf), centerPoint.add(viewHalf)), + offset = this._getBoundsOffset(viewBounds, bounds, zoom); + + return this.unproject(centerPoint.add(offset), zoom); + }, + + // adjust offset for view to get inside bounds + _limitOffset: function (offset, bounds) { + if (!bounds) { return offset; } + + var viewBounds = this.getPixelBounds(), + newBounds = new L.Bounds(viewBounds.min.add(offset), viewBounds.max.add(offset)); + + return offset.add(this._getBoundsOffset(newBounds, bounds)); + }, + + // returns offset needed for pxBounds to get inside maxBounds at a specified zoom + _getBoundsOffset: function (pxBounds, maxBounds, zoom) { + var nwOffset = this.project(maxBounds.getNorthWest(), zoom).subtract(pxBounds.min), + seOffset = this.project(maxBounds.getSouthEast(), zoom).subtract(pxBounds.max), + + dx = this._rebound(nwOffset.x, -seOffset.x), + dy = this._rebound(nwOffset.y, -seOffset.y); + + return new L.Point(dx, dy); + }, + + _rebound: function (left, right) { + return left + right > 0 ? + Math.round(left - right) / 2 : + Math.max(0, Math.ceil(left)) - Math.max(0, Math.floor(right)); + }, + _limitZoom: function (zoom) { var min = this.getMinZoom(), max = this.getMaxZoom(); @@ -2335,7 +2354,7 @@ L.Projection.Mercator = { lng = point.x * d / r, tmp = r2 / r, eccent = Math.sqrt(1 - (tmp * tmp)), - ts = Math.exp(- point.y / r2), + ts = Math.exp(- point.y / r), phi = (Math.PI / 2) - 2 * Math.atan(ts), numIter = 15, tol = 1e-7, @@ -2364,9 +2383,9 @@ L.CRS.EPSG3395 = L.extend({}, L.CRS, { transformation: (function () { var m = L.Projection.Mercator, r = m.R_MAJOR, - r2 = m.R_MINOR; + scale = 0.5 / (Math.PI * r); - return new L.Transformation(0.5 / (Math.PI * r), 0.5, -0.5 / (Math.PI * r2), 0.5); + return new L.Transformation(scale, 0.5, -scale, 0.5); }()) }); @@ -2387,7 +2406,8 @@ L.TileLayer = L.Class.extend({ attribution: '', zoomOffset: 0, opacity: 1, - /* (undefined works too) + /* + maxNativeZoom: null, zIndex: null, tms: false, continuousWorld: false, @@ -2436,9 +2456,6 @@ L.TileLayer = L.Class.extend({ // create a container div for tiles this._initContainer(); - // create an image to clone for tiles - this._createTileProto(); - // set up events map.on({ 'viewreset': this._reset, @@ -2603,13 +2620,10 @@ L.TileLayer = L.Class.extend({ this._updateZIndex(); if (this._animated) { - var className = 'leaflet-tile-container leaflet-zoom-animated'; + var className = 'leaflet-tile-container'; this._bgBuffer = L.DomUtil.create('div', className, this._container); - this._bgBuffer.style.zIndex = 1; - this._tileContainer = L.DomUtil.create('div', className, this._container); - this._tileContainer.style.zIndex = 2; } else { this._tileContainer = this._container; @@ -2644,13 +2658,27 @@ L.TileLayer = L.Class.extend({ this._initContainer(); }, + _getTileSize: function () { + var map = this._map, + zoom = map.getZoom() + this.options.zoomOffset, + zoomN = this.options.maxNativeZoom, + tileSize = this.options.tileSize; + + if (zoomN && zoom > zoomN) { + tileSize = Math.round(map.getZoomScale(zoom) / map.getZoomScale(zoomN) * tileSize); + } + + return tileSize; + }, + _update: function () { if (!this._map) { return; } - var bounds = this._map.getPixelBounds(), - zoom = this._map.getZoom(), - tileSize = this.options.tileSize; + var map = this._map, + bounds = map.getPixelBounds(), + zoom = map.getZoom(), + tileSize = this._getTileSize(); if (zoom > this.options.maxZoom || zoom < this.options.minZoom) { return; @@ -2719,12 +2747,12 @@ L.TileLayer = L.Class.extend({ var limit = this._getWrapTileNum(); // don't load if exceeds world bounds - if ((options.noWrap && (tilePoint.x < 0 || tilePoint.x >= limit)) || - tilePoint.y < 0 || tilePoint.y >= limit) { return false; } + if ((options.noWrap && (tilePoint.x < 0 || tilePoint.x >= limit.x)) || + tilePoint.y < 0 || tilePoint.y >= limit.y) { return false; } } if (options.bounds) { - var tileSize = options.tileSize, + var tileSize = this._getTileSize(), nwPoint = tilePoint.multiplyBy(tileSize), sePoint = nwPoint.add([tileSize, tileSize]), nw = this._map.unproject(nwPoint), @@ -2789,11 +2817,9 @@ L.TileLayer = L.Class.extend({ /* Chrome 20 layouts much faster with top/left (verify with timeline, frames) Android 4 browser has display issues with top/left and requires transform instead - Android 2 browser requires top/left or tiles disappear on load or first drag - (reappear after zoom) https://github.com/CloudMade/Leaflet/issues/866 (other browsers don't currently care) - see debug/hacks/jitter.html for an example */ - L.DomUtil.setPosition(tile, tilePos, L.Browser.chrome || L.Browser.android23); + L.DomUtil.setPosition(tile, tilePos, L.Browser.chrome); this._tiles[tilePoint.x + ':' + tilePoint.y] = tile; @@ -2813,12 +2839,14 @@ L.TileLayer = L.Class.extend({ zoom = options.maxZoom - zoom; } - return zoom + options.zoomOffset; + zoom += options.zoomOffset; + + return options.maxNativeZoom ? Math.min(zoom, options.maxNativeZoom) : zoom; }, _getTilePos: function (tilePoint) { var origin = this._map.getPixelOrigin(), - tileSize = this.options.tileSize; + tileSize = this._getTileSize(); return tilePoint.multiplyBy(tileSize).subtract(origin); }, @@ -2835,8 +2863,9 @@ L.TileLayer = L.Class.extend({ }, _getWrapTileNum: function () { - // TODO refactor, limit is not valid for non-standard projections - return Math.pow(2, this._getZoomForUrl()); + var crs = this._map.options.crs, + size = crs.getSize(this._map.getZoom()); + return size.divideBy(this._getTileSize())._floor(); }, _adjustTilePoint: function (tilePoint) { @@ -2845,11 +2874,11 @@ L.TileLayer = L.Class.extend({ // wrap tile coordinates if (!this.options.continuousWorld && !this.options.noWrap) { - tilePoint.x = ((tilePoint.x % limit) + limit) % limit; + tilePoint.x = ((tilePoint.x % limit.x) + limit.x) % limit.x; } if (this.options.tms) { - tilePoint.y = limit - tilePoint.y - 1; + tilePoint.y = limit.y - tilePoint.y - 1; } tilePoint.z = this._getZoomForUrl(); @@ -2860,12 +2889,6 @@ L.TileLayer = L.Class.extend({ return this.options.subdomains[index]; }, - _createTileProto: function () { - var img = this._tileImg = L.DomUtil.create('img', 'leaflet-tile'); - img.style.width = img.style.height = this.options.tileSize + 'px'; - img.galleryimg = 'no'; - }, - _getTile: function () { if (this.options.reuseTiles && this._unusedTiles.length > 0) { var tile = this._unusedTiles.pop(); @@ -2879,12 +2902,20 @@ L.TileLayer = L.Class.extend({ _resetTile: function (/*tile*/) {}, _createTile: function () { - var tile = this._tileImg.cloneNode(false); + var tile = L.DomUtil.create('img', 'leaflet-tile'); + tile.style.width = tile.style.height = this._getTileSize() + 'px'; + tile.galleryimg = 'no'; + tile.onselectstart = tile.onmousemove = L.Util.falseFn; if (L.Browser.ielt9 && this.options.opacity !== undefined) { L.DomUtil.setOpacity(tile, this.options.opacity); } + // without this hack, tiles disappear after zoom on Chrome for Android + // https://github.com/Leaflet/Leaflet/issues/2078 + if (L.Browser.mobileWebkit3d) { + tile.style.WebkitBackfaceVisibility = 'hidden'; + } return tile; }, @@ -2895,10 +2926,20 @@ L.TileLayer = L.Class.extend({ this._adjustTilePoint(tilePoint); tile.src = this.getTileUrl(tilePoint); + + this.fire('tileloadstart', { + tile: tile, + url: tile.src + }); }, _tileLoaded: function () { this._tilesToLoad--; + + if (this._animated) { + L.DomUtil.addClass(this._tileContainer, 'leaflet-zoom-animated'); + } + if (!this._tilesToLoad) { this.fire('load'); @@ -2993,13 +3034,15 @@ L.TileLayer.WMS = L.TileLayer.extend({ this._crs = this.options.crs || map.options.crs; - var projectionKey = parseFloat(this.wmsParams.version) >= 1.3 ? 'crs' : 'srs'; + this._wmsVersion = parseFloat(this.wmsParams.version); + + var projectionKey = this._wmsVersion >= 1.3 ? 'crs' : 'srs'; this.wmsParams[projectionKey] = this._crs.code; L.TileLayer.prototype.onAdd.call(this, map); }, - getTileUrl: function (tilePoint, zoom) { // (Point, Number) -> String + getTileUrl: function (tilePoint) { // (Point, Number) -> String var map = this._map, tileSize = this.options.tileSize, @@ -3007,10 +3050,11 @@ L.TileLayer.WMS = L.TileLayer.extend({ nwPoint = tilePoint.multiplyBy(tileSize), sePoint = nwPoint.add([tileSize, tileSize]), - nw = this._crs.project(map.unproject(nwPoint, zoom)), - se = this._crs.project(map.unproject(sePoint, zoom)), - - bbox = [nw.x, se.y, se.x, nw.y].join(','), + nw = this._crs.project(map.unproject(nwPoint, tilePoint.z)), + se = this._crs.project(map.unproject(sePoint, tilePoint.z)), + bbox = this._wmsVersion >= 1.3 && this._crs === L.CRS.EPSG4326 ? + [se.y, nw.x, nw.y, se.x].join(',') : + [nw.x, se.y, se.x, nw.y].join(','), url = L.Util.template(this._url, {s: this._getSubdomain(tilePoint)}); @@ -3049,6 +3093,11 @@ L.TileLayer.Canvas = L.TileLayer.extend({ }, redraw: function () { + if (this._map) { + this._reset({hard: true}); + this._update(); + } + for (var i in this._tiles) { this._redrawTile(this._tiles[i]); } @@ -3059,13 +3108,9 @@ L.TileLayer.Canvas = L.TileLayer.extend({ this.drawTile(tile, tile._tilePoint, this._map._zoom); }, - _createTileProto: function () { - var proto = this._canvasProto = L.DomUtil.create('canvas', 'leaflet-tile'); - proto.width = proto.height = this.options.tileSize; - }, - _createTile: function () { - var tile = this._canvasProto.cloneNode(false); + var tile = L.DomUtil.create('canvas', 'leaflet-tile'); + tile.width = tile.height = this.options.tileSize; tile.onselectstart = tile.onmousemove = L.Util.falseFn; return tile; }, @@ -3169,6 +3214,15 @@ L.ImageOverlay = L.Class.extend({ return this; }, + setUrl: function (url) { + this._url = url; + this._image.src = this._url; + }, + + getAttribution: function () { + return this.options.attribution; + }, + _initImage: function () { this._image = L.DomUtil.create('img', 'leaflet-image-layer'); @@ -3312,19 +3366,8 @@ L.Icon = L.Class.extend({ }, _createImg: function (src, el) { - - if (!L.Browser.ie6) { - if (!el) { - el = document.createElement('img'); - } - el.src = src; - } else { - if (!el) { - el = document.createElement('div'); - } - el.style.filter = - 'progid:DXImageTransform.Microsoft.AlphaImageLoader(src="' + src + '")'; - } + el = el || document.createElement('img'); + el.src = src; return el; }, @@ -3405,6 +3448,7 @@ L.Marker = L.Class.extend({ options: { icon: new L.Icon.Default(), title: '', + alt: '', clickable: true, draggable: false, keyboard: true, @@ -3426,6 +3470,7 @@ L.Marker = L.Class.extend({ this._initIcon(); this.update(); + this.fire('add'); if (map.options.zoomAnimation && map.options.markerZoomAnimation) { map.on('zoomanim', this._animateZoom, this); @@ -3483,15 +3528,17 @@ L.Marker = L.Class.extend({ this.update(); } + if (this._popup) { + this.bindPopup(this._popup); + } + return this; }, update: function () { if (this._icon) { - var pos = this._map.latLngToLayerPoint(this._latlng).round(); - this._setPos(pos); + this._setPos(this._map.latLngToLayerPoint(this._latlng).round()); } - return this; }, @@ -3514,6 +3561,10 @@ L.Marker = L.Class.extend({ if (options.title) { icon.title = options.title; } + + if (options.alt) { + icon.alt = options.alt; + } } L.DomUtil.addClass(icon, classToAdd); @@ -3538,10 +3589,10 @@ L.Marker = L.Class.extend({ if (newShadow !== this._shadow) { this._removeShadow(); addShadow = true; + } - if (newShadow) { - L.DomUtil.addClass(newShadow, classToAdd); - } + if (newShadow) { + L.DomUtil.addClass(newShadow, classToAdd); } this._shadow = newShadow; @@ -3598,7 +3649,7 @@ L.Marker = L.Class.extend({ }, _animateZoom: function (opt) { - var pos = this._map._latLngToNewLayerPoint(this._latlng, opt.zoom, opt.center); + var pos = this._map._latLngToNewLayerPoint(this._latlng, opt.zoom, opt.center).round(); this._setPos(pos); }, @@ -3679,6 +3730,8 @@ L.Marker = L.Class.extend({ if (this._map) { this._updateOpacity(); } + + return this; }, _updateOpacity: function () { @@ -3763,11 +3816,13 @@ L.Popup = L.Class.extend({ options: { minWidth: 50, maxWidth: 300, - maxHeight: null, + // maxHeight: null, autoPan: true, closeButton: true, offset: [0, 7], autoPanPadding: [5, 5], + // autoPanPaddingTopLeft: null, + // autoPanPaddingBottomRight: null, keepInView: false, className: '', zoomAnimation: true @@ -3787,7 +3842,6 @@ L.Popup = L.Class.extend({ if (!this._container) { this._initLayout(); } - this._updateContent(); var animFade = map.options.fadeAnimation; @@ -3798,7 +3852,7 @@ L.Popup = L.Class.extend({ map.on(this._getEvents(), this); - this._update(); + this.update(); if (animFade) { L.DomUtil.setOpacity(this._container, 1); @@ -3845,18 +3899,43 @@ L.Popup = L.Class.extend({ } }, + getLatLng: function () { + return this._latlng; + }, + setLatLng: function (latlng) { this._latlng = L.latLng(latlng); - this._update(); + if (this._map) { + this._updatePosition(); + this._adjustPan(); + } return this; }, + getContent: function () { + return this._content; + }, + setContent: function (content) { this._content = content; - this._update(); + this.update(); return this; }, + update: function () { + if (!this._map) { return; } + + this._container.style.visibility = 'hidden'; + + this._updateContent(); + this._updateLayout(); + this._updatePosition(); + + this._container.style.visibility = ''; + + this._adjustPan(); + }, + _getEvents: function () { var events = { viewreset: this._updatePosition @@ -3903,26 +3982,14 @@ L.Popup = L.Class.extend({ L.DomEvent.disableClickPropagation(wrapper); this._contentNode = L.DomUtil.create('div', prefix + '-content', wrapper); - L.DomEvent.on(this._contentNode, 'wheel', L.DomEvent.stopPropagation); + + L.DomEvent.disableScrollPropagation(this._contentNode); L.DomEvent.on(wrapper, 'contextmenu', L.DomEvent.stopPropagation); + this._tipContainer = L.DomUtil.create('div', prefix + '-tip-container', container); this._tip = L.DomUtil.create('div', prefix + '-tip', this._tipContainer); }, - _update: function () { - if (!this._map) { return; } - - this._container.style.visibility = 'hidden'; - - this._updateContent(); - this._updateLayout(); - this._updatePosition(); - - this._container.style.visibility = ''; - - this._adjustPan(); - }, - _updateContent: function () { if (!this._content) { return; } @@ -4007,21 +4074,23 @@ L.Popup = L.Class.extend({ var containerPos = map.layerPointToContainerPoint(layerPos), padding = L.point(this.options.autoPanPadding), + paddingTL = L.point(this.options.autoPanPaddingTopLeft || padding), + paddingBR = L.point(this.options.autoPanPaddingBottomRight || padding), size = map.getSize(), dx = 0, dy = 0; - if (containerPos.x + containerWidth > size.x) { // right - dx = containerPos.x + containerWidth - size.x + padding.x; + if (containerPos.x + containerWidth + paddingBR.x > size.x) { // right + dx = containerPos.x + containerWidth - size.x + paddingBR.x; } - if (containerPos.x - dx < 0) { // left - dx = containerPos.x - padding.x; + if (containerPos.x - dx - paddingTL.x < 0) { // left + dx = containerPos.x - paddingTL.x; } - if (containerPos.y + containerHeight > size.y) { // bottom - dy = containerPos.y + containerHeight - size.y + padding.y; + if (containerPos.y + containerHeight + paddingBR.y > size.y) { // bottom + dy = containerPos.y + containerHeight - size.y + paddingBR.y; } - if (containerPos.y - dy < 0) { // top - dy = containerPos.y - padding.y; + if (containerPos.y - dy - paddingTL.y < 0) { // top + dy = containerPos.y - paddingTL.y; } if (dx || dy) { @@ -4116,16 +4185,18 @@ L.Marker.include({ options = L.extend({offset: anchor}, options); - if (!this._popup) { + if (!this._popupHandlersAdded) { this .on('click', this.togglePopup, this) .on('remove', this.closePopup, this) .on('move', this._movePopup, this); + this._popupHandlersAdded = true; } if (content instanceof L.Popup) { L.setOptions(content, options); this._popup = content; + content._source = this; } else { this._popup = new L.Popup(options, this) .setContent(content); @@ -4145,13 +4216,18 @@ L.Marker.include({ if (this._popup) { this._popup = null; this - .off('click', this.togglePopup) - .off('remove', this.closePopup) - .off('move', this._movePopup); + .off('click', this.togglePopup, this) + .off('remove', this.closePopup, this) + .off('move', this._movePopup, this); + this._popupHandlersAdded = false; } return this; }, + getPopup: function () { + return this._popup; + }, + _movePopup: function (e) { this._popup.setLatLng(e.latlng); } @@ -4292,7 +4368,9 @@ L.FeatureGroup = L.LayerGroup.extend({ return this; } - layer.on(L.FeatureGroup.EVENTS, this._propagateEvent, this); + if ('on' in layer) { + layer.on(L.FeatureGroup.EVENTS, this._propagateEvent, this); + } L.LayerGroup.prototype.addLayer.call(this, layer); @@ -4304,11 +4382,16 @@ L.FeatureGroup = L.LayerGroup.extend({ }, removeLayer: function (layer) { + if (!this.hasLayer(layer)) { + return this; + } if (layer in this._layers) { layer = this._layers[layer]; } - layer.off(L.FeatureGroup.EVENTS, this._propagateEvent, this); + if ('off' in layer) { + layer.off(L.FeatureGroup.EVENTS, this._propagateEvent, this); + } L.LayerGroup.prototype.removeLayer.call(this, layer); @@ -4325,6 +4408,15 @@ L.FeatureGroup = L.LayerGroup.extend({ return this.invoke('bindPopup', content, options); }, + openPopup: function (latlng) { + // open popup on the first layer + for (var id in this._layers) { + this._layers[id].openPopup(latlng); + break; + } + return this; + }, + setStyle: function (style) { return this.invoke('setStyle', style); }, @@ -4348,11 +4440,10 @@ L.FeatureGroup = L.LayerGroup.extend({ }, _propagateEvent: function (e) { - if (!e.layer) { - e.layer = e.target; - } - e.target = this; - + e = L.extend({ + layer: e.target, + target: this + }, e); this.fire(e.type, e); } }); @@ -4373,15 +4464,19 @@ L.Path = L.Class.extend({ // how much to extend the clip area around the map view // (relative to its size, e.g. 0.5 is half the screen in each direction) // set it so that SVG element doesn't exceed 1280px (vectors flicker on dragend if it is) - CLIP_PADDING: L.Browser.mobile ? - Math.max(0, Math.min(0.5, - (1280 / Math.max(window.innerWidth, window.innerHeight) - 1) / 2)) : 0.5 + CLIP_PADDING: (function () { + var max = L.Browser.mobile ? 1280 : 2000, + target = (max / Math.max(window.outerWidth, window.outerHeight) - 1) / 2; + return Math.max(0, Math.min(0.5, target)); + })() }, options: { stroke: true, color: '#0033ff', dashArray: null, + lineCap: null, + lineJoin: null, weight: 5, opacity: 0.5, @@ -4531,6 +4626,11 @@ L.Path = L.Path.extend({ this._container = this._createElement('g'); this._path = this._createElement('path'); + + if (this.options.className) { + L.DomUtil.addClass(this._path, this.options.className); + } + this._container.appendChild(this._path); }, @@ -4561,6 +4661,12 @@ L.Path = L.Path.extend({ } else { this._path.removeAttribute('stroke-dasharray'); } + if (this.options.lineCap) { + this._path.setAttribute('stroke-linecap', this.options.lineCap); + } + if (this.options.lineJoin) { + this._path.setAttribute('stroke-linejoin', this.options.lineJoin); + } } else { this._path.setAttribute('stroke', 'none'); } @@ -4585,7 +4691,7 @@ L.Path = L.Path.extend({ _initEvents: function () { if (this.options.clickable) { if (L.Browser.svg || !L.Browser.vml) { - this._path.setAttribute('class', 'leaflet-clickable'); + L.DomUtil.addClass(this._path, 'leaflet-clickable'); } L.DomEvent.on(this._container, 'click', this._onMouseClick, this); @@ -4605,7 +4711,7 @@ L.Path = L.Path.extend({ }, _fireMouseEvent: function (e) { - if (!this.hasEventListeners(e.type)) { return; } + if (!this._map || !this.hasEventListeners(e.type)) { return; } var map = this._map, containerPoint = map.mouseEventToContainerPoint(e), @@ -4635,14 +4741,14 @@ L.Map.include({ this._panes.overlayPane.appendChild(this._pathRoot); if (this.options.zoomAnimation && L.Browser.any3d) { - this._pathRoot.setAttribute('class', ' leaflet-zoom-animated'); + L.DomUtil.addClass(this._pathRoot, 'leaflet-zoom-animated'); this.on({ 'zoomanim': this._animatePathZoom, 'zoomend': this._endPathZoom }); } else { - this._pathRoot.setAttribute('class', ' leaflet-zoom-hide'); + L.DomUtil.addClass(this._pathRoot, 'leaflet-zoom-hide'); } this.on('moveend', this._updateSvgViewport); @@ -4809,10 +4915,14 @@ L.Path = L.Browser.svg || !L.Browser.vml ? L.Path : L.Path.extend({ _initPath: function () { var container = this._container = this._createElement('shape'); - L.DomUtil.addClass(container, 'leaflet-vml-shape'); + + L.DomUtil.addClass(container, 'leaflet-vml-shape' + + (this.options.className ? ' ' + this.options.className : '')); + if (this.options.clickable) { L.DomUtil.addClass(container, 'leaflet-clickable'); } + container.coordsize = '1 1'; this._path = this._createElement('path'); @@ -4845,12 +4955,18 @@ L.Path = L.Browser.svg || !L.Browser.vml ? L.Path : L.Path.extend({ stroke.opacity = options.opacity; if (options.dashArray) { - stroke.dashStyle = options.dashArray instanceof Array ? + stroke.dashStyle = L.Util.isArray(options.dashArray) ? options.dashArray.join(' ') : options.dashArray.replace(/( *, *)/g, ' '); } else { stroke.dashStyle = ''; } + if (options.lineCap) { + stroke.endcap = options.lineCap.replace('butt', 'flat'); + } + if (options.lineJoin) { + stroke.joinstyle = options.lineJoin; + } } else if (stroke) { container.removeChild(stroke); @@ -4938,7 +5054,8 @@ L.Path = (L.Path.SVG && !window.L_PREFER_CANVAS) || !L.Browser.canvas ? L.Path : } this._requestUpdate(); - + + this.fire('remove'); this._map = null; }, @@ -4968,6 +5085,13 @@ L.Path = (L.Path.SVG && !window.L_PREFER_CANVAS) || !L.Browser.canvas ? L.Path : if (options.fill) { this._ctx.fillStyle = options.fillColor || options.color; } + + if (options.lineCap) { + this._ctx.lineCap = options.lineCap; + } + if (options.lineJoin) { + this._ctx.lineJoin = options.lineJoin; + } }, _drawPath: function () { @@ -5005,7 +5129,7 @@ L.Path = (L.Path.SVG && !window.L_PREFER_CANVAS) || !L.Browser.canvas ? L.Path : if (options.fill) { ctx.globalAlpha = options.fillOpacity; - ctx.fill(); + ctx.fill(options.fillRule || 'evenodd'); } if (options.stroke) { @@ -5020,15 +5144,14 @@ L.Path = (L.Path.SVG && !window.L_PREFER_CANVAS) || !L.Browser.canvas ? L.Path : _initEvents: function () { if (this.options.clickable) { - // TODO dblclick this._map.on('mousemove', this._onMouseMove, this); - this._map.on('click', this._onClick, this); + this._map.on('click dblclick contextmenu', this._fireMouseEvent, this); } }, - _onClick: function (e) { + _fireMouseEvent: function (e) { if (this._containsPoint(e.layerPoint)) { - this.fire('click', e); + this.fire(e.type, e); } }, @@ -5098,7 +5221,7 @@ L.Map.include((L.Path.SVG && !window.L_PREFER_CANVAS) || !L.Browser.canvas ? {} * and polylines (clipping, simplification, distances, etc.) */ -/*jshint bitwise:false */ // allow bitwise oprations for this file +/*jshint bitwise:false */ // allow bitwise operations for this file L.LineUtil = { @@ -5530,10 +5653,12 @@ L.Polygon = L.Polyline.extend({ }, initialize: function (latlngs, options) { - var i, len, hole; - L.Polyline.prototype.initialize.call(this, latlngs, options); + this._initWithHoles(latlngs); + }, + _initWithHoles: function (latlngs) { + var i, len, hole; if (latlngs && L.Util.isArray(latlngs[0]) && (typeof latlngs[0][0] !== 'number')) { this._latlngs = this._convertLatLngs(latlngs[0]); this._holes = latlngs.slice(1); @@ -5574,6 +5699,15 @@ L.Polygon = L.Polyline.extend({ } }, + setLatLngs: function (latlngs) { + if (latlngs && L.Util.isArray(latlngs[0]) && (typeof latlngs[0][0] !== 'number')) { + this._initWithHoles(latlngs); + return this.redraw(); + } else { + return L.Polyline.prototype.setLatLngs.call(this, latlngs); + } + }, + _clipPoints: function () { var points = this._originalPoints, newParts = []; @@ -5635,6 +5769,16 @@ L.polygon = function (latlngs, options) { } return this; + }, + + getLatLngs: function () { + var latlngs = []; + + this.eachLayer(function (layer) { + latlngs.push(layer.getLatLngs()); + }); + + return latlngs; } }); } @@ -5805,9 +5949,21 @@ L.CircleMarker = L.Circle.extend({ this.setRadius(this.options.radius); }, + setLatLng: function (latlng) { + L.Circle.prototype.setLatLng.call(this, latlng); + if (this._popup && this._popup._isOpen) { + this._popup.setLatLng(latlng); + } + return this; + }, + setRadius: function (radius) { this.options.radius = this._radius = radius; return this.redraw(); + }, + + getRadius: function () { + return this._radius; } }); @@ -5936,12 +6092,13 @@ L.GeoJSON = L.FeatureGroup.extend({ addData: function (geojson) { var features = L.Util.isArray(geojson) ? geojson : geojson.features, - i, len; + i, len, feature; if (features) { for (i = 0, len = features.length; i < len; i++) { // Only add this if geometry or geometries are set and not null - if (features[i].geometries || features[i].geometry || features[i].features) { + feature = features[i]; + if (feature.geometries || feature.geometry || feature.features || feature.coordinates) { this.addData(features[i]); } } @@ -5952,7 +6109,7 @@ L.GeoJSON = L.FeatureGroup.extend({ if (options.filter && !options.filter(geojson)) { return; } - var layer = L.GeoJSON.geometryToLayer(geojson, options.pointToLayer, options.coordsToLatLng); + var layer = L.GeoJSON.geometryToLayer(geojson, options.pointToLayer, options.coordsToLatLng, options); layer.feature = L.GeoJSON.asFeature(geojson); layer.defaultOptions = layer.options; @@ -5992,11 +6149,11 @@ L.GeoJSON = L.FeatureGroup.extend({ }); L.extend(L.GeoJSON, { - geometryToLayer: function (geojson, pointToLayer, coordsToLatLng) { + geometryToLayer: function (geojson, pointToLayer, coordsToLatLng, vectorOptions) { var geometry = geojson.type === 'Feature' ? geojson.geometry : geojson, coords = geometry.coordinates, layers = [], - latlng, latlngs, i, len, layer; + latlng, latlngs, i, len; coordsToLatLng = coordsToLatLng || this.coordsToLatLng; @@ -6008,37 +6165,37 @@ L.extend(L.GeoJSON, { case 'MultiPoint': for (i = 0, len = coords.length; i < len; i++) { latlng = coordsToLatLng(coords[i]); - layer = pointToLayer ? pointToLayer(geojson, latlng) : new L.Marker(latlng); - layers.push(layer); + layers.push(pointToLayer ? pointToLayer(geojson, latlng) : new L.Marker(latlng)); } return new L.FeatureGroup(layers); case 'LineString': latlngs = this.coordsToLatLngs(coords, 0, coordsToLatLng); - return new L.Polyline(latlngs); + return new L.Polyline(latlngs, vectorOptions); case 'Polygon': + if (coords.length === 2 && !coords[1].length) { + throw new Error('Invalid GeoJSON object.'); + } latlngs = this.coordsToLatLngs(coords, 1, coordsToLatLng); - return new L.Polygon(latlngs); + return new L.Polygon(latlngs, vectorOptions); case 'MultiLineString': latlngs = this.coordsToLatLngs(coords, 1, coordsToLatLng); - return new L.MultiPolyline(latlngs); + return new L.MultiPolyline(latlngs, vectorOptions); case 'MultiPolygon': latlngs = this.coordsToLatLngs(coords, 2, coordsToLatLng); - return new L.MultiPolygon(latlngs); + return new L.MultiPolygon(latlngs, vectorOptions); case 'GeometryCollection': for (i = 0, len = geometry.geometries.length; i < len; i++) { - layer = this.geometryToLayer({ + layers.push(this.geometryToLayer({ geometry: geometry.geometries[i], type: 'Feature', properties: geojson.properties - }, pointToLayer, coordsToLatLng); - - layers.push(layer); + }, pointToLayer, coordsToLatLng, vectorOptions)); } return new L.FeatureGroup(layers); @@ -6048,7 +6205,7 @@ L.extend(L.GeoJSON, { }, coordsToLatLng: function (coords) { // (Array[, Boolean]) -> LatLng - return new L.LatLng(coords[1], coords[0]); + return new L.LatLng(coords[1], coords[0], coords[2]); }, coordsToLatLngs: function (coords, levelsDeep, coordsToLatLng) { // (Array[, Number, Function]) -> Array @@ -6066,8 +6223,13 @@ L.extend(L.GeoJSON, { return latlngs; }, - latLngToCoords: function (latLng) { - return [latLng.lng, latLng.lat]; + latLngToCoords: function (latlng) { + var coords = [latlng.lng, latlng.lat]; + + if (latlng.alt !== undefined) { + coords.push(latlng.alt); + } + return coords; }, latLngsToCoords: function (latLngs) { @@ -6142,43 +6304,58 @@ L.Polygon.include({ }); (function () { - function includeMulti(Klass, type) { - Klass.include({ - toGeoJSON: function () { - var coords = []; + function multiToGeoJSON(type) { + return function () { + var coords = []; - this.eachLayer(function (layer) { - coords.push(layer.toGeoJSON().geometry.coordinates); - }); + this.eachLayer(function (layer) { + coords.push(layer.toGeoJSON().geometry.coordinates); + }); - return L.GeoJSON.getFeature(this, { - type: type, - coordinates: coords - }); - } - }); + return L.GeoJSON.getFeature(this, { + type: type, + coordinates: coords + }); + }; } - includeMulti(L.MultiPolyline, 'MultiLineString'); - includeMulti(L.MultiPolygon, 'MultiPolygon'); -}()); + L.MultiPolyline.include({toGeoJSON: multiToGeoJSON('MultiLineString')}); + L.MultiPolygon.include({toGeoJSON: multiToGeoJSON('MultiPolygon')}); -L.LayerGroup.include({ - toGeoJSON: function () { - var features = []; + L.LayerGroup.include({ + toGeoJSON: function () { - this.eachLayer(function (layer) { - if (layer.toGeoJSON) { - features.push(L.GeoJSON.asFeature(layer.toGeoJSON())); + var geometry = this.feature && this.feature.geometry, + jsons = [], + json; + + if (geometry && geometry.type === 'MultiPoint') { + return multiToGeoJSON('MultiPoint').call(this); } - }); - return { - type: 'FeatureCollection', - features: features - }; - } -}); + var isGeometryCollection = geometry && geometry.type === 'GeometryCollection'; + + this.eachLayer(function (layer) { + if (layer.toGeoJSON) { + json = layer.toGeoJSON(); + jsons.push(isGeometryCollection ? json.geometry : L.GeoJSON.asFeature(json)); + } + }); + + if (isGeometryCollection) { + return L.GeoJSON.getFeature(this, { + geometries: jsons, + type: 'GeometryCollection' + }); + } + + return { + type: 'FeatureCollection', + features: jsons + }; + } + }); +}()); L.geoJson = function (geojson, options) { return new L.GeoJSON(geojson, options); @@ -6190,11 +6367,6 @@ L.geoJson = function (geojson, options) { */ L.DomEvent = { - WHEEL: - 'onwheel' in document ? 'wheel' : - 'onmousewheel' in document ? 'mousewheel' : - 'MozMousePixelScroll', - /* inspired by John Resig, Dean Edwards and YUI addEvent implementations */ addListener: function (obj, type, fn, context) { // (HTMLElement, String, Function[, Object]) @@ -6208,20 +6380,20 @@ L.DomEvent = { return fn.call(context || obj, e || L.DomEvent._getEvent()); }; - if (L.Browser.msTouch && type.indexOf('touch') === 0) { - return this.addMsTouchListener(obj, type, handler, id); + if (L.Browser.pointer && type.indexOf('touch') === 0) { + return this.addPointerListener(obj, type, handler, id); } if (L.Browser.touch && (type === 'dblclick') && this.addDoubleTapListener) { this.addDoubleTapListener(obj, handler, id); } - if (type === 'wheel' || type === 'mousewheel') { - type = L.DomEvent.WHEEL; - } - if ('addEventListener' in obj) { - if ((type === 'mouseenter') || (type === 'mouseleave')) { + if (type === 'mousewheel') { + obj.addEventListener('DOMMouseScroll', handler, false); + obj.addEventListener(type, handler, false); + + } else if ((type === 'mouseenter') || (type === 'mouseleave')) { originalHandler = handler; newType = (type === 'mouseenter' ? 'mouseover' : 'mouseout'); @@ -6261,18 +6433,18 @@ L.DomEvent = { if (!handler) { return this; } - if (type === 'wheel' || type === 'mousewheel') { - type = L.DomEvent.WHEEL; - } - - if (L.Browser.msTouch && type.indexOf('touch') === 0) { - this.removeMsTouchListener(obj, type, id); + if (L.Browser.pointer && type.indexOf('touch') === 0) { + this.removePointerListener(obj, type, id); } else if (L.Browser.touch && (type === 'dblclick') && this.removeDoubleTapListener) { this.removeDoubleTapListener(obj, id); } else if ('removeEventListener' in obj) { - if ((type === 'mouseenter') || (type === 'mouseleave')) { + if (type === 'mousewheel') { + obj.removeEventListener('DOMMouseScroll', handler, false); + obj.removeEventListener(type, handler, false); + + } else if ((type === 'mouseenter') || (type === 'mouseleave')) { obj.removeEventListener((type === 'mouseenter' ? 'mouseover' : 'mouseout'), handler, false); } else { obj.removeEventListener(type, handler, false); @@ -6293,19 +6465,29 @@ L.DomEvent = { } else { e.cancelBubble = true; } + L.DomEvent._skipped(e); + return this; }, + disableScrollPropagation: function (el) { + var stop = L.DomEvent.stopPropagation; + + return L.DomEvent + .on(el, 'mousewheel', stop) + .on(el, 'MozMousePixelScroll', stop); + }, + disableClickPropagation: function (el) { var stop = L.DomEvent.stopPropagation; for (var i = L.Draggable.START.length - 1; i >= 0; i--) { - L.DomEvent.addListener(el, L.Draggable.START[i], stop); + L.DomEvent.on(el, L.Draggable.START[i], stop); } return L.DomEvent - .addListener(el, 'click', L.DomEvent._fakeStop) - .addListener(el, 'dblclick', stop); + .on(el, 'click', L.DomEvent._fakeStop) + .on(el, 'dblclick', stop); }, preventDefault: function (e) { @@ -6319,38 +6501,48 @@ L.DomEvent = { }, stop: function (e) { - return L.DomEvent.preventDefault(e).stopPropagation(e); + return L.DomEvent + .preventDefault(e) + .stopPropagation(e); }, getMousePosition: function (e, container) { + if (!container) { + return new L.Point(e.clientX, e.clientY); + } - var body = document.body, - docEl = document.documentElement, - x = e.pageX ? e.pageX : e.clientX + body.scrollLeft + docEl.scrollLeft, - y = e.pageY ? e.pageY : e.clientY + body.scrollTop + docEl.scrollTop, - pos = new L.Point(x, y); + var rect = container.getBoundingClientRect(); - return (container ? pos._subtract(L.DomUtil.getViewportOffset(container)) : pos); + return new L.Point( + e.clientX - rect.left - container.clientLeft, + e.clientY - rect.top - container.clientTop); }, getWheelDelta: function (e) { + var delta = 0; - if (e.type === 'wheel') { - delta = -e.deltaY / (e.deltaMode ? 1 : 120); - } else if (e.type === 'mousewheel') { + if (e.wheelDelta) { delta = e.wheelDelta / 120; - } else if (e.type === 'MozMousePixelScroll') { - delta = -e.detail; } - + if (e.detail) { + delta = -e.detail / 3; + } return delta; }, - _fakeStop: function stop(e) { - // fakes stopPropagation by setting a special event flag checked in Map mouse events handler - // jshint camelcase: false - e._leaflet_stop = true; + _skipEvents: {}, + + _fakeStop: function (e) { + // fakes stopPropagation by setting a special event flag, checked/reset with L.DomEvent._skipped(e) + L.DomEvent._skipEvents[e.type] = true; + }, + + _skipped: function (e) { + var skipped = this._skipEvents[e.type]; + // reset when checking, as it's only used in map container and propagates outside of the map + this._skipEvents[e.type] = false; + return skipped; }, // check if element really left/entered the event target (for mouseenter/mouseleave) @@ -6391,12 +6583,12 @@ L.DomEvent = { var timeStamp = (e.timeStamp || e.originalEvent.timeStamp), elapsed = L.DomEvent._lastClick && (timeStamp - L.DomEvent._lastClick); - // are they closer together than 1000ms yet more than 100ms? + // are they closer together than 500ms yet more than 100ms? // Android typically triggers them ~300ms apart while multiple listeners // on the same event should be triggered far faster; // or check if click is simulated on the element, and if it is, reject any non-simulated events - if ((elapsed && elapsed > 100 && elapsed < 1000) || (e.target._simulatedClick && !e._simulated)) { + if ((elapsed && elapsed > 100 && elapsed < 500) || (e.target._simulatedClick && !e._simulated)) { L.DomEvent.stop(e); return; } @@ -6422,11 +6614,13 @@ L.Draggable = L.Class.extend({ END: { mousedown: 'mouseup', touchstart: 'touchend', + pointerdown: 'touchend', MSPointerDown: 'touchend' }, MOVE: { mousedown: 'mousemove', touchstart: 'touchmove', + pointerdown: 'touchmove', MSPointerDown: 'touchmove' } }, @@ -6458,27 +6652,21 @@ L.Draggable = L.Class.extend({ }, _onDown: function (e) { + this._moved = false; + if (e.shiftKey || ((e.which !== 1) && (e.button !== 1) && !e.touches)) { return; } - L.DomEvent - .stopPropagation(e); + L.DomEvent.stopPropagation(e); if (L.Draggable._disabled) { return; } L.DomUtil.disableImageDrag(); - - var first = e.touches ? e.touches[0] : e, - el = first.target; - - // if touching a link, highlight it - if (L.Browser.touch && el.tagName.toLowerCase() === 'a') { - L.DomUtil.addClass(el, 'leaflet-active'); - } - - this._moved = false; + L.DomUtil.disableTextSelection(); if (this._moving) { return; } + var first = e.touches ? e.touches[0] : e; + this._startPoint = new L.Point(first.clientX, first.clientY); this._startPos = this._newPos = L.DomUtil.getPosition(this._element); @@ -6488,13 +6676,17 @@ L.Draggable = L.Class.extend({ }, _onMove: function (e) { - if (e.touches && e.touches.length > 1) { return; } + if (e.touches && e.touches.length > 1) { + this._moved = true; + return; + } var first = (e.touches && e.touches.length === 1 ? e.touches[0] : e), newPoint = new L.Point(first.clientX, first.clientY), offset = newPoint.subtract(this._startPoint); if (!offset.x && !offset.y) { return; } + if (L.Browser.touch && Math.abs(offset.x) + Math.abs(offset.y) < 3) { return; } L.DomEvent.preventDefault(e); @@ -6504,10 +6696,9 @@ L.Draggable = L.Class.extend({ this._moved = true; this._startPos = L.DomUtil.getPosition(this._element).subtract(offset); - if (!L.Browser.touch) { - L.DomUtil.disableTextSelection(); - L.DomUtil.addClass(document.body, 'leaflet-dragging'); - } + L.DomUtil.addClass(document.body, 'leaflet-dragging'); + this._lastTarget = e.target || e.srcElement; + L.DomUtil.addClass(this._lastTarget, 'leaflet-drag-target'); } this._newPos = this._startPos.add(offset); @@ -6524,9 +6715,11 @@ L.Draggable = L.Class.extend({ }, _onUp: function () { - if (!L.Browser.touch) { - L.DomUtil.enableTextSelection(); - L.DomUtil.removeClass(document.body, 'leaflet-dragging'); + L.DomUtil.removeClass(document.body, 'leaflet-dragging'); + + if (this._lastTarget) { + L.DomUtil.removeClass(this._lastTarget, 'leaflet-drag-target'); + this._lastTarget = null; } for (var i in L.Draggable.MOVE) { @@ -6536,12 +6729,15 @@ L.Draggable = L.Class.extend({ } L.DomUtil.enableImageDrag(); + L.DomUtil.enableTextSelection(); - if (this._moved) { + if (this._moved && this._moving) { // ensure drag is not fired after dragend L.Util.cancelAnimFrame(this._animRequest); - this.fire('dragend'); + this.fire('dragend', { + distance: this._newPos.distanceTo(this._startPos) + }); } this._moving = false; @@ -6612,6 +6808,8 @@ L.Map.Drag = L.Handler.extend({ if (map.options.worldCopyJump) { this._draggable.on('predrag', this._onPreDrag, this); map.on('viewreset', this._onViewReset, this); + + map.whenReady(this._onViewReset, this); } } this._draggable.enable(); @@ -6683,14 +6881,14 @@ L.Map.Drag = L.Handler.extend({ this._draggable._newPos.x = newX; }, - _onDragEnd: function () { + _onDragEnd: function (e) { var map = this._map, options = map.options, delay = +new Date() - this._lastTime, noInertia = !options.inertia || delay > options.inertiaThreshold || !this._positions[0]; - map.fire('dragend'); + map.fire('dragend', e); if (noInertia) { map.fire('moveend'); @@ -6714,6 +6912,8 @@ L.Map.Drag = L.Handler.extend({ map.fire('moveend'); } else { + offset = map._limitOffset(offset, map.options.maxBounds); + L.Util.requestAnimFrame(function () { map.panBy(offset, { duration: decelerationDuration, @@ -6739,15 +6939,22 @@ L.Map.mergeOptions({ L.Map.DoubleClickZoom = L.Handler.extend({ addHooks: function () { - this._map.on('dblclick', this._onDoubleClick); + this._map.on('dblclick', this._onDoubleClick, this); }, removeHooks: function () { - this._map.off('dblclick', this._onDoubleClick); + this._map.off('dblclick', this._onDoubleClick, this); }, _onDoubleClick: function (e) { - this.setZoomAround(e.containerPoint, this._zoom + 1); + var map = this._map, + zoom = map.getZoom() + (e.originalEvent.shiftKey ? -1 : 1); + + if (map.options.doubleClickZoom === 'center') { + map.setZoom(zoom); + } else { + map.setZoomAround(e.containerPoint, zoom); + } } }); @@ -6764,12 +6971,14 @@ L.Map.mergeOptions({ L.Map.ScrollWheelZoom = L.Handler.extend({ addHooks: function () { - L.DomEvent.on(this._map._container, 'wheel', this._onWheelScroll, this); + L.DomEvent.on(this._map._container, 'mousewheel', this._onWheelScroll, this); + L.DomEvent.on(this._map._container, 'MozMousePixelScroll', L.DomEvent.preventDefault); this._delta = 0; }, removeHooks: function () { - L.DomEvent.off(this._map._container, 'wheel', this._onWheelScroll); + L.DomEvent.off(this._map._container, 'mousewheel', this._onWheelScroll); + L.DomEvent.off(this._map._container, 'MozMousePixelScroll', L.DomEvent.preventDefault); }, _onWheelScroll: function (e) { @@ -6805,7 +7014,11 @@ L.Map.ScrollWheelZoom = L.Handler.extend({ if (!delta) { return; } - map.setZoomAround(this._lastMousePos, zoom + delta); + if (map.options.scrollWheelZoom === 'center') { + map.setZoom(zoom + delta); + } else { + map.setZoomAround(this._lastMousePos, zoom + delta); + } } }); @@ -6818,8 +7031,8 @@ L.Map.addInitHook('addHandler', 'scrollWheelZoom', L.Map.ScrollWheelZoom); L.extend(L.DomEvent, { - _touchstart: L.Browser.msTouch ? 'MSPointerDown' : 'touchstart', - _touchend: L.Browser.msTouch ? 'MSPointerUp' : 'touchend', + _touchstart: L.Browser.msPointer ? 'MSPointerDown' : L.Browser.pointer ? 'pointerdown' : 'touchstart', + _touchend: L.Browser.msPointer ? 'MSPointerUp' : L.Browser.pointer ? 'pointerup' : 'touchend', // inspired by Zepto touch code by Thomas Fuchs addDoubleTapListener: function (obj, handler, id) { @@ -6835,7 +7048,7 @@ L.extend(L.DomEvent, { function onTouchStart(e) { var count; - if (L.Browser.msTouch) { + if (L.Browser.pointer) { trackedTouches.push(e.pointerId); count = trackedTouches.length; } else { @@ -6854,7 +7067,7 @@ L.extend(L.DomEvent, { } function onTouchEnd(e) { - if (L.Browser.msTouch) { + if (L.Browser.pointer) { var idx = trackedTouches.indexOf(e.pointerId); if (idx === -1) { return; @@ -6863,7 +7076,7 @@ L.extend(L.DomEvent, { } if (doubleTap) { - if (L.Browser.msTouch) { + if (L.Browser.pointer) { // work around .type being readonly with MSPointer* events var newTouch = { }, prop; @@ -6887,15 +7100,15 @@ L.extend(L.DomEvent, { obj[pre + touchstart + id] = onTouchStart; obj[pre + touchend + id] = onTouchEnd; - // on msTouch we need to listen on the document, otherwise a drag starting on the map and moving off screen + // on pointer we need to listen on the document, otherwise a drag starting on the map and moving off screen // will not come through to us, so we will lose track of how many touches are ongoing - var endElement = L.Browser.msTouch ? document.documentElement : obj; + var endElement = L.Browser.pointer ? document.documentElement : obj; obj.addEventListener(touchstart, onTouchStart, false); endElement.addEventListener(touchend, onTouchEnd, false); - if (L.Browser.msTouch) { - endElement.addEventListener('MSPointerCancel', onTouchEnd, false); + if (L.Browser.pointer) { + endElement.addEventListener(L.DomEvent.POINTER_CANCEL, onTouchEnd, false); } return this; @@ -6905,11 +7118,12 @@ L.extend(L.DomEvent, { var pre = '_leaflet_'; obj.removeEventListener(this._touchstart, obj[pre + this._touchstart + id], false); - (L.Browser.msTouch ? document.documentElement : obj).removeEventListener( + (L.Browser.pointer ? document.documentElement : obj).removeEventListener( this._touchend, obj[pre + this._touchend + id], false); - if (L.Browser.msTouch) { - document.documentElement.removeEventListener('MSPointerCancel', obj[pre + this._touchend + id], false); + if (L.Browser.pointer) { + document.documentElement.removeEventListener(L.DomEvent.POINTER_CANCEL, obj[pre + this._touchend + id], + false); } return this; @@ -6923,81 +7137,91 @@ L.extend(L.DomEvent, { L.extend(L.DomEvent, { - _msTouches: [], - _msDocumentListener: false, + //static + POINTER_DOWN: L.Browser.msPointer ? 'MSPointerDown' : 'pointerdown', + POINTER_MOVE: L.Browser.msPointer ? 'MSPointerMove' : 'pointermove', + POINTER_UP: L.Browser.msPointer ? 'MSPointerUp' : 'pointerup', + POINTER_CANCEL: L.Browser.msPointer ? 'MSPointerCancel' : 'pointercancel', - // Provides a touch events wrapper for msPointer events. + _pointers: [], + _pointerDocumentListener: false, + + // Provides a touch events wrapper for (ms)pointer events. // Based on changes by veproza https://github.com/CloudMade/Leaflet/pull/1019 + //ref http://www.w3.org/TR/pointerevents/ https://www.w3.org/Bugs/Public/show_bug.cgi?id=22890 - addMsTouchListener: function (obj, type, handler, id) { + addPointerListener: function (obj, type, handler, id) { switch (type) { case 'touchstart': - return this.addMsTouchListenerStart(obj, type, handler, id); + return this.addPointerListenerStart(obj, type, handler, id); case 'touchend': - return this.addMsTouchListenerEnd(obj, type, handler, id); + return this.addPointerListenerEnd(obj, type, handler, id); case 'touchmove': - return this.addMsTouchListenerMove(obj, type, handler, id); + return this.addPointerListenerMove(obj, type, handler, id); default: throw 'Unknown touch event type'; } }, - addMsTouchListenerStart: function (obj, type, handler, id) { + addPointerListenerStart: function (obj, type, handler, id) { var pre = '_leaflet_', - touches = this._msTouches; + pointers = this._pointers; var cb = function (e) { + if (e.pointerType !== 'mouse' && e.pointerType !== e.MSPOINTER_TYPE_MOUSE) { + L.DomEvent.preventDefault(e); + } var alreadyInArray = false; - for (var i = 0; i < touches.length; i++) { - if (touches[i].pointerId === e.pointerId) { + for (var i = 0; i < pointers.length; i++) { + if (pointers[i].pointerId === e.pointerId) { alreadyInArray = true; break; } } if (!alreadyInArray) { - touches.push(e); + pointers.push(e); } - e.touches = touches.slice(); + e.touches = pointers.slice(); e.changedTouches = [e]; handler(e); }; obj[pre + 'touchstart' + id] = cb; - obj.addEventListener('MSPointerDown', cb, false); + obj.addEventListener(this.POINTER_DOWN, cb, false); - // need to also listen for end events to keep the _msTouches list accurate + // need to also listen for end events to keep the _pointers list accurate // this needs to be on the body and never go away - if (!this._msDocumentListener) { + if (!this._pointerDocumentListener) { var internalCb = function (e) { - for (var i = 0; i < touches.length; i++) { - if (touches[i].pointerId === e.pointerId) { - touches.splice(i, 1); + for (var i = 0; i < pointers.length; i++) { + if (pointers[i].pointerId === e.pointerId) { + pointers.splice(i, 1); break; } } }; //We listen on the documentElement as any drags that end by moving the touch off the screen get fired there - document.documentElement.addEventListener('MSPointerUp', internalCb, false); - document.documentElement.addEventListener('MSPointerCancel', internalCb, false); + document.documentElement.addEventListener(this.POINTER_UP, internalCb, false); + document.documentElement.addEventListener(this.POINTER_CANCEL, internalCb, false); - this._msDocumentListener = true; + this._pointerDocumentListener = true; } return this; }, - addMsTouchListenerMove: function (obj, type, handler, id) { + addPointerListenerMove: function (obj, type, handler, id) { var pre = '_leaflet_', - touches = this._msTouches; + touches = this._pointers; function cb(e) { // don't fire touch moves when mouse isn't down - if (e.pointerType === e.MSPOINTER_TYPE_MOUSE && e.buttons === 0) { return; } + if ((e.pointerType === e.MSPOINTER_TYPE_MOUSE || e.pointerType === 'mouse') && e.buttons === 0) { return; } for (var i = 0; i < touches.length; i++) { if (touches[i].pointerId === e.pointerId) { @@ -7013,14 +7237,14 @@ L.extend(L.DomEvent, { } obj[pre + 'touchmove' + id] = cb; - obj.addEventListener('MSPointerMove', cb, false); + obj.addEventListener(this.POINTER_MOVE, cb, false); return this; }, - addMsTouchListenerEnd: function (obj, type, handler, id) { + addPointerListenerEnd: function (obj, type, handler, id) { var pre = '_leaflet_', - touches = this._msTouches; + touches = this._pointers; var cb = function (e) { for (var i = 0; i < touches.length; i++) { @@ -7037,26 +7261,26 @@ L.extend(L.DomEvent, { }; obj[pre + 'touchend' + id] = cb; - obj.addEventListener('MSPointerUp', cb, false); - obj.addEventListener('MSPointerCancel', cb, false); + obj.addEventListener(this.POINTER_UP, cb, false); + obj.addEventListener(this.POINTER_CANCEL, cb, false); return this; }, - removeMsTouchListener: function (obj, type, id) { + removePointerListener: function (obj, type, id) { var pre = '_leaflet_', cb = obj[pre + type + id]; switch (type) { case 'touchstart': - obj.removeEventListener('MSPointerDown', cb, false); + obj.removeEventListener(this.POINTER_DOWN, cb, false); break; case 'touchmove': - obj.removeEventListener('MSPointerMove', cb, false); + obj.removeEventListener(this.POINTER_MOVE, cb, false); break; case 'touchend': - obj.removeEventListener('MSPointerUp', cb, false); - obj.removeEventListener('MSPointerCancel', cb, false); + obj.removeEventListener(this.POINTER_UP, cb, false); + obj.removeEventListener(this.POINTER_CANCEL, cb, false); break; } @@ -7070,7 +7294,8 @@ L.extend(L.DomEvent, { */ L.Map.mergeOptions({ - touchZoom: L.Browser.touch && !L.Browser.android23 + touchZoom: L.Browser.touch && !L.Browser.android23, + bounceAtZoomLimits: true }); L.Map.TouchZoom = L.Handler.extend({ @@ -7123,6 +7348,11 @@ L.Map.TouchZoom = L.Handler.extend({ if (this._scale === 1) { return; } + if (!map.options.bounceAtZoomLimits) { + if ((map.getZoom() === map.getMinZoom() && this._scale < 1) || + (map.getZoom() === map.getMaxZoom() && this._scale > 1)) { return; } + } + if (!this._moved) { L.DomUtil.addClass(map._mapPane, 'leaflet-touching'); @@ -7146,7 +7376,7 @@ L.Map.TouchZoom = L.Handler.extend({ center = map.layerPointToLatLng(origin), zoom = map.getScaleZoom(this._scale); - map._animateZoom(center, zoom, this._startCenter, this._scale, this._delta); + map._animateZoom(center, zoom, this._startCenter, this._scale, this._delta, false, true); }, _onTouchEnd: function () { @@ -7226,7 +7456,7 @@ L.Map.Tap = L.Handler.extend({ this._startPos = this._newPos = new L.Point(first.clientX, first.clientY); // if touching a link, highlight it - if (el.tagName.toLowerCase() === 'a') { + if (el.tagName && el.tagName.toLowerCase() === 'a') { L.DomUtil.addClass(el, 'leaflet-active'); } @@ -7256,7 +7486,7 @@ L.Map.Tap = L.Handler.extend({ var first = e.changedTouches[0], el = first.target; - if (el.tagName.toLowerCase() === 'a') { + if (el && el.tagName && el.tagName.toLowerCase() === 'a') { L.DomUtil.removeClass(el, 'leaflet-active'); } @@ -7292,7 +7522,7 @@ L.Map.Tap = L.Handler.extend({ } }); -if (L.Browser.touch && !L.Browser.msTouch) { +if (L.Browser.touch && !L.Browser.pointer) { L.Map.addInitHook('addHandler', 'tap', L.Map.Tap); } @@ -7311,6 +7541,7 @@ L.Map.BoxZoom = L.Handler.extend({ this._map = map; this._container = map._container; this._pane = map._panes.overlayPane; + this._moved = false; }, addHooks: function () { @@ -7319,9 +7550,16 @@ L.Map.BoxZoom = L.Handler.extend({ removeHooks: function () { L.DomEvent.off(this._container, 'mousedown', this._onMouseDown); + this._moved = false; + }, + + moved: function () { + return this._moved; }, _onMouseDown: function (e) { + this._moved = false; + if (!e.shiftKey || ((e.which !== 1) && (e.button !== 1))) { return false; } L.DomUtil.disableTextSelection(); @@ -7329,21 +7567,22 @@ L.Map.BoxZoom = L.Handler.extend({ this._startLayerPoint = this._map.mouseEventToLayerPoint(e); - this._box = L.DomUtil.create('div', 'leaflet-zoom-box', this._pane); - L.DomUtil.setPosition(this._box, this._startLayerPoint); - - //TODO refactor: move cursor to styles - this._container.style.cursor = 'crosshair'; - L.DomEvent .on(document, 'mousemove', this._onMouseMove, this) .on(document, 'mouseup', this._onMouseUp, this) .on(document, 'keydown', this._onKeyDown, this); - - this._map.fire('boxzoomstart'); }, _onMouseMove: function (e) { + if (!this._moved) { + this._box = L.DomUtil.create('div', 'leaflet-zoom-box', this._pane); + L.DomUtil.setPosition(this._box, this._startLayerPoint); + + //TODO refactor: move cursor to styles + this._container.style.cursor = 'crosshair'; + this._map.fire('boxzoomstart'); + } + var startPoint = this._startLayerPoint, box = this._box, @@ -7356,14 +7595,18 @@ L.Map.BoxZoom = L.Handler.extend({ L.DomUtil.setPosition(box, newPos); + this._moved = true; + // TODO refactor: remove hardcoded 4 pixels box.style.width = (Math.max(0, Math.abs(offset.x) - 4)) + 'px'; box.style.height = (Math.max(0, Math.abs(offset.y) - 4)) + 'px'; }, _finish: function () { - this._pane.removeChild(this._box); - this._container.style.cursor = ''; + if (this._moved) { + this._pane.removeChild(this._box); + this._container.style.cursor = ''; + } L.DomUtil.enableTextSelection(); L.DomUtil.enableImageDrag(); @@ -7421,7 +7664,7 @@ L.Map.Keyboard = L.Handler.extend({ right: [39], down: [40], up: [38], - zoomIn: [187, 107, 61], + zoomIn: [187, 107, 61, 171], zoomOut: [189, 109, 173] }, @@ -7471,7 +7714,7 @@ L.Map.Keyboard = L.Handler.extend({ var body = document.body, docEl = document.documentElement, top = body.scrollTop || docEl.scrollTop, - left = body.scrollTop || docEl.scrollLeft; + left = body.scrollLeft || docEl.scrollLeft; this._map._container.focus(); @@ -7576,6 +7819,7 @@ L.Handler.MarkerDrag = L.Handler.extend({ .on('drag', this._onDrag, this) .on('dragend', this._onDragEnd, this); this._draggable.enable(); + L.DomUtil.addClass(this._marker._icon, 'leaflet-marker-draggable'); }, removeHooks: function () { @@ -7585,6 +7829,7 @@ L.Handler.MarkerDrag = L.Handler.extend({ .off('dragend', this._onDragEnd, this); this._draggable.disable(); + L.DomUtil.removeClass(this._marker._icon, 'leaflet-marker-draggable'); }, moved: function () { @@ -7616,10 +7861,10 @@ L.Handler.MarkerDrag = L.Handler.extend({ .fire('drag'); }, - _onDragEnd: function () { + _onDragEnd: function (e) { this._marker .fire('moveend') - .fire('dragend'); + .fire('dragend', e); } }); @@ -7692,6 +7937,12 @@ L.Control = L.Class.extend({ } return this; + }, + + _refocusOnMap: function () { + if (this._map) { + this._map.getContainer().focus(); + } } }); @@ -7743,7 +7994,11 @@ L.Map.include({ L.Control.Zoom = L.Control.extend({ options: { - position: 'topleft' + position: 'topleft', + zoomInText: '+', + zoomInTitle: 'Zoom in', + zoomOutText: '-', + zoomOutTitle: 'Zoom out' }, onAdd: function (map) { @@ -7753,10 +8008,13 @@ L.Control.Zoom = L.Control.extend({ this._map = map; this._zoomInButton = this._createButton( - '+', 'Zoom in', zoomName + '-in', container, this._zoomIn, this); + this.options.zoomInText, this.options.zoomInTitle, + zoomName + '-in', container, this._zoomIn, this); this._zoomOutButton = this._createButton( - '-', 'Zoom out', zoomName + '-out', container, this._zoomOut, this); + this.options.zoomOutText, this.options.zoomOutTitle, + zoomName + '-out', container, this._zoomOut, this); + this._updateDisabled(); map.on('zoomend zoomlevelschange', this._updateDisabled, this); return container; @@ -7787,7 +8045,8 @@ L.Control.Zoom = L.Control.extend({ .on(link, 'mousedown', stop) .on(link, 'dblclick', stop) .on(link, 'click', L.DomEvent.preventDefault) - .on(link, 'click', fn, context); + .on(link, 'click', fn, context) + .on(link, 'click', this._refocusOnMap, context); return link; }, @@ -7845,6 +8104,12 @@ L.Control.Attribution = L.Control.extend({ this._container = L.DomUtil.create('div', 'leaflet-control-attribution'); L.DomEvent.disableClickPropagation(this._container); + for (var i in map._layers) { + if (map._layers[i].getAttribution) { + this.addAttribution(map._layers[i].getAttribution()); + } + } + map .on('layeradd', this._onLayerAdd, this) .on('layerremove', this._onLayerRemove, this); @@ -8096,8 +8361,8 @@ L.Control.Layers = L.Control.extend({ onRemove: function (map) { map - .off('layeradd', this._onLayerChange) - .off('layerremove', this._onLayerChange); + .off('layeradd', this._onLayerChange, this) + .off('layerremove', this._onLayerChange, this); }, addBaseLayer: function (layer, name) { @@ -8127,8 +8392,9 @@ L.Control.Layers = L.Control.extend({ container.setAttribute('aria-haspopup', true); if (!L.Browser.touch) { - L.DomEvent.disableClickPropagation(container); - L.DomEvent.on(container, 'wheel', L.DomEvent.stopPropagation); + L.DomEvent + .disableClickPropagation(container) + .disableScrollPropagation(container); } else { L.DomEvent.on(container, 'click', L.DomEvent.stopPropagation); } @@ -8153,6 +8419,10 @@ L.Control.Layers = L.Control.extend({ else { L.DomEvent.on(link, 'focus', this._expand, this); } + //Work around for Firefox android issue https://github.com/Leaflet/Leaflet/issues/2033 + L.DomEvent.on(form, 'click', function () { + setTimeout(L.bind(this._onInputClick, this), 0); + }, this); this._map.on('click', this._collapse, this); // TODO keyboard accessibility @@ -8287,6 +8557,8 @@ L.Control.Layers = L.Control.extend({ } this._handlingClick = false; + + this._refocusOnMap(); }, _expand: function () { @@ -8344,9 +8616,14 @@ L.PosAnimation = L.Class.extend({ }, _onStep: function () { + var stepPos = this._getPos(); + if (!stepPos) { + this._onTransitionEnd(); + return; + } // jshint camelcase: false // make L.DomUtil.getPosition return intermediate position value during animation - this._el._leaflet_pos = this._getPos(); + this._el._leaflet_pos = stepPos; this.fire('step'); }, @@ -8363,8 +8640,9 @@ L.PosAnimation = L.Class.extend({ if (L.Browser.any3d) { matches = style[L.DomUtil.TRANSFORM].match(this._transformRe); - left = matches ? parseFloat(matches[1]) : 0; - top = matches ? parseFloat(matches[2]) : 0; + if (!matches) { return; } + left = parseFloat(matches[1]); + top = parseFloat(matches[2]); } else { left = parseFloat(style.left); top = parseFloat(style.top); @@ -8401,8 +8679,8 @@ L.Map.include({ setView: function (center, zoom, options) { - zoom = this._limitZoom(zoom); - center = L.latLng(center); + zoom = zoom === undefined ? this._zoom : this._limitZoom(zoom); + center = this._limitCenter(L.latLng(center), zoom, this.options.maxBounds); options = options || {}; if (this._panAnim) { @@ -8588,12 +8866,16 @@ if (L.DomUtil.TRANSITION) { L.Map.include(!L.DomUtil.TRANSITION ? {} : { - _catchTransitionEnd: function () { - if (this._animatingZoom) { + _catchTransitionEnd: function (e) { + if (this._animatingZoom && e.propertyName.indexOf('transform') >= 0) { this._onZoomTransitionEnd(); } }, + _nothingToAnimate: function () { + return !this._container.getElementsByClassName('leaflet-zoom-animated').length; + }, + _tryAnimatedZoom: function (center, zoom, options) { if (this._animatingZoom) { return true; } @@ -8601,7 +8883,7 @@ L.Map.include(!L.DomUtil.TRANSITION ? {} : { options = options || {}; // don't animate if disabled, not supported or zoom difference is too large - if (!this._zoomAnimated || options.animate === false || + if (!this._zoomAnimated || options.animate === false || this._nothingToAnimate() || Math.abs(zoom - this._zoom) > this.options.zoomAnimationThreshold) { return false; } // offset is the pixel coords of the zoom origin relative to the current center @@ -8621,9 +8903,11 @@ L.Map.include(!L.DomUtil.TRANSITION ? {} : { return true; }, - _animateZoom: function (center, zoom, origin, scale, delta, backwards) { + _animateZoom: function (center, zoom, origin, scale, delta, backwards, forTouchZoom) { - this._animatingZoom = true; + if (!forTouchZoom) { + this._animatingZoom = true; + } // put transform transition on all layers with leaflet-zoom-animated class L.DomUtil.addClass(this._mapPane, 'leaflet-zoom-anim'); @@ -8637,27 +8921,34 @@ L.Map.include(!L.DomUtil.TRANSITION ? {} : { L.Draggable._disabled = true; } - this.fire('zoomanim', { - center: center, - zoom: zoom, - origin: origin, - scale: scale, - delta: delta, - backwards: backwards - }); + L.Util.requestAnimFrame(function () { + this.fire('zoomanim', { + center: center, + zoom: zoom, + origin: origin, + scale: scale, + delta: delta, + backwards: backwards + }); + // horrible hack to work around a Chrome bug https://github.com/Leaflet/Leaflet/issues/3689 + setTimeout(L.bind(this._onZoomTransitionEnd, this), 250); + }, this); }, _onZoomTransitionEnd: function () { + if (!this._animatingZoom) { return; } this._animatingZoom = false; L.DomUtil.removeClass(this._mapPane, 'leaflet-zoom-anim'); - this._resetView(this._animateToCenter, this._animateToZoom, true, true); + L.Util.requestAnimFrame(function () { + this._resetView(this._animateToCenter, this._animateToZoom, true, true); - if (L.Draggable) { - L.Draggable._disabled = false; - } + if (L.Draggable) { + L.Draggable._disabled = false; + } + }, this); } }); @@ -8668,28 +8959,13 @@ L.Map.include(!L.DomUtil.TRANSITION ? {} : { L.TileLayer.include({ _animateZoom: function (e) { - var firstFrame = false; - if (!this._animating) { this._animating = true; - firstFrame = true; - } - - if (firstFrame) { this._prepareBgBuffer(); } - var bg = this._bgBuffer; - - if (firstFrame) { - //prevent bg buffer from clearing right after zoom - clearTimeout(this._clearBgBufferTimer); - - // hack to make sure transform is updated before running animation - L.Util.falseFn(bg.offsetWidth); - } - - var transform = L.DomUtil.TRANSFORM, + var bg = this._bgBuffer, + transform = L.DomUtil.TRANSFORM, initialTransform = e.delta ? L.DomUtil.getTranslateString(e.delta) : bg.style[transform], scaleStr = L.DomUtil.getScaleString(e.scale, e.origin); @@ -8703,13 +8979,16 @@ L.TileLayer.include({ bg = this._bgBuffer; front.style.visibility = ''; - front.style.zIndex = 2; - - bg.style.zIndex = 1; + front.parentNode.appendChild(front); // Bring to fore // force reflow L.Util.falseFn(bg.offsetWidth); + var zoom = this._map.getZoom(); + if (zoom > this.options.maxZoom || zoom < this.options.minZoom) { + this._clearBgBuffer(); + } + this._animating = false; }, @@ -8749,6 +9028,9 @@ L.TileLayer.include({ bg = this._bgBuffer = front; this._stopLoadingImages(bg); + + //prevent bg buffer from clearing right after zoom + clearTimeout(this._clearBgBufferTimer); }, _getLoadedTilesPercentage: function (container) { @@ -8869,6 +9151,7 @@ L.Map.include({ var data = { latlng: latlng, bounds: bounds, + timestamp: pos.timestamp }; for (var i in pos.coords) {