From ff470d586150fbc6e51e1b99662d80e6864985f0 Mon Sep 17 00:00:00 2001 From: Patrick Arlt Date: Mon, 29 Dec 2014 12:14:33 -0800 Subject: [PATCH] popup improvements for FeatureGroup --- debug/map/popup.html | 101 +++++++++++++++++++++++++++++++ src/layer/FeatureGroup.js | 43 +++++++------ src/layer/Layer.Popup.js | 15 ++++- src/layer/Popup.js | 7 ++- src/layer/marker/Marker.Popup.js | 13 +--- 5 files changed, 147 insertions(+), 32 deletions(-) create mode 100644 debug/map/popup.html diff --git a/debug/map/popup.html b/debug/map/popup.html new file mode 100644 index 00000000..38511c2f --- /dev/null +++ b/debug/map/popup.html @@ -0,0 +1,101 @@ + + + + Leaflet debug page + + + + + + + + + + + + +
+ + + + + + + + + + + + diff --git a/src/layer/FeatureGroup.js b/src/layer/FeatureGroup.js index 2fe9e2c9..fcc0d2d2 100644 --- a/src/layer/FeatureGroup.js +++ b/src/layer/FeatureGroup.js @@ -14,10 +14,6 @@ L.FeatureGroup = L.LayerGroup.extend({ L.LayerGroup.prototype.addLayer.call(this, layer); - if (this._popupContent && layer.bindPopup) { - layer.bindPopup(this._popupContent, this._popupOptions); - } - return this.fire('layeradd', {layer: layer}); }, @@ -33,24 +29,37 @@ L.FeatureGroup = L.LayerGroup.extend({ L.LayerGroup.prototype.removeLayer.call(this, layer); - if (this._popupContent) { - this.invoke('unbindPopup'); - } - return this.fire('layerremove', {layer: layer}); }, - bindPopup: function (content, options) { - this._popupContent = content; - this._popupOptions = options; - return this.invoke('bindPopup', content, options); + openPopup: function (layerid) { + if(layerid){ + layer = this.getLayer(layerid); + } else { + // open popup on the first layer + for (var id in this._layers) { + layer = this._layers[id]; + break; + } + } + + if (this._popup && this._map) { + this._popup.options.offset = this._popupAnchor(layer); + this._popup._source = layer; + this._popup.update(); + this._map.openPopup(this._popup, layer._latlng || layer.getCenter()); + } + + return this; }, - openPopup: function (latlng) { - // open popup on the first layer - for (var id in this._layers) { - this._layers[id].openPopup(latlng); - break; + togglePopup: function(layerid){ + if (this._popup) { + if (this._popup._map) { + this.closePopup(); + } else { + this.openPopup(layerid); + } } return this; }, diff --git a/src/layer/Layer.Popup.js b/src/layer/Layer.Popup.js index 5b276772..2f663e43 100644 --- a/src/layer/Layer.Popup.js +++ b/src/layer/Layer.Popup.js @@ -43,7 +43,8 @@ L.Layer.include({ openPopup: function (latlng) { if (this._popup && this._map) { - this._map.openPopup(this._popup, latlng || this._latlng || this.getCenter()); + this._popup.options.offset = this._popupAnchor(this); + this._map.openPopup(this._popup, latlng || this._latlng || this.getCenter()); } return this; }, @@ -78,10 +79,20 @@ L.Layer.include({ }, _openPopup: function (e) { + this._popup.options.offset = this._popupAnchor(e.layer); + if(typeof this._popup._content === 'function') { + this._popup._source = e.layer; + this._popup.update(); + } this._map.openPopup(this._popup, e.latlng); }, + _popupAnchor: function(layer){ + var anchor = layer._getPopupAnchor ? layer._getPopupAnchor() : [0,0]; + return L.point(anchor).add(L.Popup.prototype.options.offset); + }, + _movePopup: function (e) { this._popup.setLatLng(e.latlng); } -}); +}); \ No newline at end of file diff --git a/src/layer/Popup.js b/src/layer/Popup.js index 3a702971..19d18cd1 100644 --- a/src/layer/Popup.js +++ b/src/layer/Popup.js @@ -132,7 +132,7 @@ L.Popup = L.Layer.extend({ } return events; }, - + isOpen: function () { return !!this._map && this._map.hasLayer(this); }, @@ -173,8 +173,9 @@ L.Popup = L.Layer.extend({ if (!this._content) { return; } var node = this._contentNode; - - if (typeof this._content === 'string') { + if (typeof this._content === 'function') { + node.innerHTML = this._content(this._source || this); + } else if (typeof this._content === 'string') { node.innerHTML = this._content; } else { while (node.hasChildNodes()) { diff --git a/src/layer/marker/Marker.Popup.js b/src/layer/marker/Marker.Popup.js index f19fb5f4..fcd52516 100644 --- a/src/layer/marker/Marker.Popup.js +++ b/src/layer/marker/Marker.Popup.js @@ -3,14 +3,7 @@ */ L.Marker.include({ - bindPopup: function (content, options) { - var anchor = L.point(this.options.icon.options.popupAnchor || [0, 0]) - .add(L.Popup.prototype.options.offset); - - options = L.extend({offset: anchor}, options); - - return L.Layer.prototype.bindPopup.call(this, content, options); - }, - - _openPopup: L.Layer.prototype.togglePopup + _getPopupAnchor: function(){ + return this.options.icon.options.popupAnchor || [0, 0]; + } });