From c661abb6266db24c25bb9868457ec96ca4f321fa Mon Sep 17 00:00:00 2001
From: David Molineus <david.molineus@netzmacht.de>
Date: Thu, 1 Nov 2018 10:26:38 +0100
Subject: [PATCH] Fix dynamic data loading for new request url.

---
 js/Contao.js                                  | 34 ++++++++++++++++++-
 js/Mixin.GeoJSON.js                           |  2 +-
 .../Resources/public/js/contao-leaflet.js     |  2 +-
 3 files changed, 35 insertions(+), 3 deletions(-)

diff --git a/js/Contao.js b/js/Contao.js
index 69ce015..91368a5 100644
--- a/js/Contao.js
+++ b/js/Contao.js
@@ -139,6 +139,7 @@ L.Contao = L.Evented.extend({
      * @param map         Pass a map object so that the data loading events are passed to the map.
      */
     loadUrl: function (url, type, options, customLayer, map) {
+        url = this.applyFilterToUrl(url, map);
         var layer = omnivore[type](url, options, customLayer);
 
         if (map) {
@@ -147,7 +148,7 @@ L.Contao = L.Evented.extend({
 
             // Add listener for map bounds changes.
             if (map.options.dynamicLoad && layer.options.boundsMode == 'fit') {
-                layer.options.requestHash = hash;
+                layer.options.requestUrl = url;
                 map.on('moveend', layer.refreshData, layer);
 
                 map.on('layerremove', function(e) {
@@ -326,6 +327,37 @@ L.Contao = L.Evented.extend({
         }
 
         return value;
+    },
+
+
+    /**
+     * Apply the filter to a request url.
+     *
+     * @param {string} url The request url.
+     * @param {L.Map}  map The map.
+     *
+     * @returns {string}
+     */
+    applyFilterToUrl: function (url, map) {
+        var value, query, bounds;
+
+        if (!map || !map.options.dynamicLoad) {
+            return url;
+        }
+
+        url = new URL(url);
+        query = new URLSearchParams(url.search);
+
+        bounds = map.getBounds();
+        value  = bounds.getSouth() + ',' + bounds.getWest();
+        value += ',' + bounds.getNorth() + ',' + bounds.getEast();
+
+        query.set('filter', 'bbox');
+        query.set('values', value);
+
+        url.search = query.toString();
+
+        return url.toString();
     }
 });
 
diff --git a/js/Mixin.GeoJSON.js b/js/Mixin.GeoJSON.js
index 21bea31..3e6f4cf 100644
--- a/js/Mixin.GeoJSON.js
+++ b/js/Mixin.GeoJSON.js
@@ -29,6 +29,6 @@ L.GeoJSON.include({
         });
 
         // TODO: Allow other data formats.
-        omnivore.geojson(L.contao.createRequestUrl(this.options.requestHash, e.target), null, dataLayer);
+        omnivore.geojson(L.contao.applyFilterToUrl(this.options.requestUrl, e.target), null, dataLayer);
     }
 });
diff --git a/src/Bundle/Resources/public/js/contao-leaflet.js b/src/Bundle/Resources/public/js/contao-leaflet.js
index 80ce810..cdf4ee8 100644
--- a/src/Bundle/Resources/public/js/contao-leaflet.js
+++ b/src/Bundle/Resources/public/js/contao-leaflet.js
@@ -1 +1 @@
-L.Contao=L.Evented.extend({statics:{ATTRIBUTION:' | <a href="https://netzmacht.de/contao-leaflet" title="Powered by Leaflet extension for Contao CMS developed by netzmacht David Molineus">netzmacht</a>'},maps:{},icons:{},initialize:function(){L.Icon.Default.imagePath="assets/leaflet/libs/leaflet/images/",this.setGeoJsonListeners(L.GeoJSON)},addMap:function(t,o){return this.maps[t]=o,this.fire("map:added",{id:t,map:o}),this},getMap:function(t){return void 0===this.maps[t]?null:this.maps[t]},addIcon:function(t,o){return this.icons[t]=o,this.fire("icon:added",{id:t,icon:o}),this},loadIcons:function(t){for(var o=0;o<t.length;o++){var e;e="extraMarkers.icon"===t[o].type?L.ExtraMarkers.icon(t[o].options):L[t[o].type](t[o].options),this.addIcon(t[o].id,e)}},getIcon:function(t){return void 0===this.icons[t]?null:this.icons[t]},load:function(t,o,e,n,i){var s=this.createRequestUrl(t,i);return this.loadFile(s,o,e,n,i)},loadUrl:function(t,o,e,n,i){var s=omnivore[o](t,e,n);return i&&(L.stamp(s),i.options.dynamicLoad&&"fit"==s.options.boundsMode&&(s.options.requestHash=hash,i.on("moveend",s.refreshData,s),i.on("layerremove",function(t){t.layer===s&&i.off("moveend",s.updateBounds,s)})),i.fire("dataloading",{layer:s}),s.on("ready",function(){i.calculateFeatureBounds(s),i.fire("dataload",{layer:s})}),s.on("error",function(){i.fire("dataload",{layer:s})})),s},loadFile:function(t,o,e,n,i){return this.loadUrl(t,o,e,n,i)},pointToLayer:function(t,o){var e="marker",n=null;if(t.properties&&(t.properties.bounds=!0,t.properties.type&&(e=t.properties.type),t.properties.arguments&&(n=L[e].apply(L[e],t.properties.arguments),L.Util.setOptions(n,t.properties.options))),null===n&&(n=L[e](o,t.properties.options)),t.properties){if(t.properties.radius&&n.setRadius(t.properties.radius),t.properties.icon){var i=this.getIcon(t.properties.icon);i&&n.setIcon(i)}this.bindPopupFromFeature(n,t)}return this.fire("point:added",{marker:n,feature:t,latlng:o,type:e}),n},onEachFeature:function(t,o){t.properties&&(L.Util.setOptions(o,t.properties.options),this.bindPopupFromFeature(o,t),this.fire("feature:added",{feature:t,layer:o}))},bindPopupFromFeature:function(t,o){o.properties&&(o.properties.popup?t.bindPopup(o.properties.popup,o.properties.popupOptions):o.properties.popupContent&&t.bindPopup(o.properties.popupContent,o.properties.popupOptions))},setGeoJsonListeners:function(t){t&&t.prototype&&(t.prototype.options={pointToLayer:this.pointToLayer.bind(this),onEachFeature:this.onEachFeature.bind(this)})},createRequestUrl:function(t,o){var e,n="leaflet",i=document.location.search.substr(1).split("&");if(t=encodeURIComponent(t),""==i)t=document.location.pathname+"?"+[n,t].join("=");else{for(var s,r=i.length;r--;)if((s=i[r].split("="))[0]==n){s[1]=t,i[r]=s.join("=");break}r<0&&(i[i.length]=[n,t].join("=")),t=document.location.pathname+"?"+i.join("&")}return o&&o.options.dynamicLoad&&(t+="&f=bbox&v=",t+=(e=o.getBounds()).getSouth()+","+e.getWest(),t+=","+e.getNorth()+","+e.getEast()),t}}),L.contao=new L.Contao,L.Control.Attribution.addInitHook(function(){this.options.prefix+=L.Contao.ATTRIBUTION}),L.Control.Attribution.include({setPrefix:function(t){return-1===t.indexOf(L.Contao.ATTRIBUTION)&&(t+=L.Contao.ATTRIBUTION),this.options.prefix=t,this._update(),this}}),L.GeoJSON.include({refreshData:function(t){var o=L.geoJson(),e=this;o.on("ready",function(){var t,o=e.getLayers();for(t=0;t<o.length;t++)e.removeLayer(o[t]);for(o=this.getLayers(),t=0;t<o.length;t++)this.removeLayer(o[t]),e.addLayer(o[t])}),omnivore.geojson(L.contao.createRequestUrl(this.options.requestHash,t.target),null,o)}}),L.Map.include({_dynamicBounds:null,calculateFeatureBounds:function(t,o){if(t){if(!this.options.adjustBounds&&!o)return;this._scanForBounds(t)}else this.eachLayer(this._scanForBounds,this);this._dynamicBounds&&this.fitBounds(this._dynamicBounds,this.getBoundsOptions())},getBoundsOptions:function(){return options={},this.options.boundsPadding?options.padding=this.options.boundsPadding:(this.options.boundsPaddingTopLeft&&(options.paddingTopLeft=this.options.boundsPaddingTopLeft),this.options.boundsPaddingBottomRight&&(options.paddingBottomRight=this.options.boundsPaddingBottomRight)),options},_scanForBounds:function(t){var o;!t.feature||t.feature.properties&&t.feature.properties.ignoreForBounds?L.MarkerClusterGroup&&t instanceof L.MarkerClusterGroup&&t.options.boundsMode&&"extend"==t.options.boundsMode?(o=t.getBounds()).isValid()&&(this._dynamicBounds?this._dynamicBounds.extend(o):this._dynamicBounds=L.latLngBounds(o.getSouthWest(),o.getNorthEast())):(!t.options||t.options&&t.options.boundsMode&&!t.options.ignoreForBounds)&&t.eachLayer&&t.eachLayer(this._scanForBounds,this):t.getBounds?(o=t.getBounds()).isValid()&&(this._dynamicBounds?this._dynamicBounds.extend(o):this._dynamicBounds=L.latLngBounds(o.getSouthWest(),o.getNorthEast())):t.getLatLng&&(o=t.getLatLng(),this._dynamicBounds?this._dynamicBounds.extend(o):this._dynamicBounds=L.latLngBounds(o,o))}}),L.LatLngBounds.prototype.toOverpassBBoxString=function(){var t=this._southWest,o=this._northEast;return[t.lat,t.lng,o.lat,o.lng].join(",")},L.OverPassLayer=L.FeatureGroup.extend({options:{minZoom:0,endpoint:"//overpass-api.de/api/",query:"(node(BBOX)[organic];node(BBOX)[second_hand];);out qt;",amenityIcons:{}},initialize:function(t){t.pointToLayer||(t.pointToLayer=this.pointToLayer),t.onEachFeature||(t.onEachFeature=this.onEachFeature),L.Util.setOptions(this,t),this.options.dynamicLoad=!!this.options.query.match(/BBOX/g),this._layer=L.geoJson(),this._layers={},this.addLayer(this._layer)},refreshData:function(){if(!(this._map.getZoom()<this.options.minZoom)){var t=this._map.getBounds().toOverpassBBoxString(),o=this.options.query.replace(/(BBOX)/g,t),e=this.options.endpoint+"interpreter?data=[out:json];"+o;this._map.fire("dataloading",{layer:this}),this.request(e,function(t,o){var e=JSON.parse(o.response),n=osmtogeojson(e),i=L.geoJson(n,{pointToLayer:this.options.pointToLayer.bind(this),onEachFeature:this.options.onEachFeature.bind(this)});if(this.addLayer(i),this.removeLayer(this._layer),this._layer=i,"extend"===this.options.boundsMode&&i.getBounds().isValid()){var s=this._map.getBounds();s=s.extend(i.getBounds()),this._map.fitBounds(s,this._map.getBoundsOptions())}this._map.fire("dataload",{layer:this})}.bind(this))}},onAdd:function(t){"fit"===this.options.boundsMode&&this.options.dynamicLoad&&t.on("moveend",this.refreshData,this),this.refreshData()},pointToLayer:function(t,o){var e=null,n=L.marker(o,t.properties.options);return t.properties&&(t.properties.radius&&n.setRadius(t.properties.radius),t.properties.icon?e=this._map.getIcon(t.properties.icon):t.properties.tags&&t.properties.tags.amenity&&this.options.amenityIcons[t.properties.tags.amenity]&&(e=L.contao.getIcon(this.options.amenityIcons[t.properties.tags.amenity])),e&&n.setIcon(e)),this.options.overpassPopup&&n.bindPopup(this.options.overpassPopup(t,n)),this._map.fire("point:added",{marker:n,feature:t,latlng:o,type:"marker"}),n},onEachFeature:function(t,o){t.properties&&(L.Util.setOptions(o,t.properties.options),this.options.overpassPopup&&o.bindPopup(this.options.overpassPopup(t,o)),this._map.fire("feature:added",{feature:t,layer:o}))},request:function(t,o,e){var n=!1;if(void 0===window.XMLHttpRequest)return o(Error("Browser not supported"));if(void 0===e){var i=t.match(/^\s*https?:\/\/[^\/]*/);e=i&&i[0]!==location.protocol+"//"+location.hostname+(location.port?":"+location.port:"")}var s=new window.XMLHttpRequest;if(e&&!("withCredentials"in s)){s=new window.XDomainRequest;var r=o;o=function(){if(n)r.apply(this,arguments);else{var t=this,o=arguments;setTimeout(function(){r.apply(t,o)},0)}}}function a(){var t;void 0===s.status||(200<=(t=s.status)&&t<300||304===t)?o.call(s,null,s):o.call(s,s,null)}return"onload"in s?s.onload=a:s.onreadystatechange=function(){4===s.readyState&&a()},s.onerror=function(t){o.call(this,t||!0,null),o=function(){}},s.onprogress=function(){},s.ontimeout=function(t){o.call(this,t,null),o=function(){}},s.onabort=function(t){o.call(this,t,null),o=function(){}},s.open("GET",t,!0),s.send(null),n=!0,s}});
\ No newline at end of file
+L.Contao=L.Evented.extend({statics:{ATTRIBUTION:' | <a href="https://netzmacht.de/contao-leaflet" title="Powered by Leaflet extension for Contao CMS developed by netzmacht David Molineus">netzmacht</a>'},maps:{},icons:{},initialize:function(){L.Icon.Default.imagePath="assets/leaflet/libs/leaflet/images/",this.setGeoJsonListeners(L.GeoJSON)},addMap:function(t,o){return this.maps[t]=o,this.fire("map:added",{id:t,map:o}),this},getMap:function(t){return void 0===this.maps[t]?null:this.maps[t]},addIcon:function(t,o){return this.icons[t]=o,this.fire("icon:added",{id:t,icon:o}),this},loadIcons:function(t){for(var o=0;o<t.length;o++){var e;e="extraMarkers.icon"===t[o].type?L.ExtraMarkers.icon(t[o].options):L[t[o].type](t[o].options),this.addIcon(t[o].id,e)}},getIcon:function(t){return void 0===this.icons[t]?null:this.icons[t]},load:function(t,o,e,n,i){var s=this.createRequestUrl(t,i);return this.loadFile(s,o,e,n,i)},loadUrl:function(t,o,e,n,i){t=this.applyFilterToUrl(t,i);var s=omnivore[o](t,e,n);return i&&(L.stamp(s),i.options.dynamicLoad&&"fit"==s.options.boundsMode&&(s.options.requestUrl=t,i.on("moveend",s.refreshData,s),i.on("layerremove",function(t){t.layer===s&&i.off("moveend",s.updateBounds,s)})),i.fire("dataloading",{layer:s}),s.on("ready",function(){i.calculateFeatureBounds(s),i.fire("dataload",{layer:s})}),s.on("error",function(){i.fire("dataload",{layer:s})})),s},loadFile:function(t,o,e,n,i){return this.loadUrl(t,o,e,n,i)},pointToLayer:function(t,o){var e="marker",n=null;if(t.properties&&(t.properties.bounds=!0,t.properties.type&&(e=t.properties.type),t.properties.arguments&&(n=L[e].apply(L[e],t.properties.arguments),L.Util.setOptions(n,t.properties.options))),null===n&&(n=L[e](o,t.properties.options)),t.properties){if(t.properties.radius&&n.setRadius(t.properties.radius),t.properties.icon){var i=this.getIcon(t.properties.icon);i&&n.setIcon(i)}this.bindPopupFromFeature(n,t)}return this.fire("point:added",{marker:n,feature:t,latlng:o,type:e}),n},onEachFeature:function(t,o){t.properties&&(L.Util.setOptions(o,t.properties.options),this.bindPopupFromFeature(o,t),this.fire("feature:added",{feature:t,layer:o}))},bindPopupFromFeature:function(t,o){o.properties&&(o.properties.popup?t.bindPopup(o.properties.popup,o.properties.popupOptions):o.properties.popupContent&&t.bindPopup(o.properties.popupContent,o.properties.popupOptions))},setGeoJsonListeners:function(t){t&&t.prototype&&(t.prototype.options={pointToLayer:this.pointToLayer.bind(this),onEachFeature:this.onEachFeature.bind(this)})},createRequestUrl:function(t,o){var e,n="leaflet",i=document.location.search.substr(1).split("&");if(t=encodeURIComponent(t),""==i)t=document.location.pathname+"?"+[n,t].join("=");else{for(var s,r=i.length;r--;)if((s=i[r].split("="))[0]==n){s[1]=t,i[r]=s.join("=");break}r<0&&(i[i.length]=[n,t].join("=")),t=document.location.pathname+"?"+i.join("&")}return o&&o.options.dynamicLoad&&(t+="&f=bbox&v=",t+=(e=o.getBounds()).getSouth()+","+e.getWest(),t+=","+e.getNorth()+","+e.getEast()),t},applyFilterToUrl:function(t,o){var e,n,i;return o&&o.options.dynamicLoad?(t=new URL(t),n=new URLSearchParams(t.search),e=(i=o.getBounds()).getSouth()+","+i.getWest(),e+=","+i.getNorth()+","+i.getEast(),n.set("filter","bbox"),n.set("values",e),t.search=n.toString(),t.toString()):t}}),L.contao=new L.Contao,L.Control.Attribution.addInitHook(function(){this.options.prefix+=L.Contao.ATTRIBUTION}),L.Control.Attribution.include({setPrefix:function(t){return-1===t.indexOf(L.Contao.ATTRIBUTION)&&(t+=L.Contao.ATTRIBUTION),this.options.prefix=t,this._update(),this}}),L.GeoJSON.include({refreshData:function(t){var o=L.geoJson(),e=this;o.on("ready",function(){var t,o=e.getLayers();for(t=0;t<o.length;t++)e.removeLayer(o[t]);for(o=this.getLayers(),t=0;t<o.length;t++)this.removeLayer(o[t]),e.addLayer(o[t])}),omnivore.geojson(L.contao.applyFilterToUrl(this.options.requestUrl,t.target),null,o)}}),L.Map.include({_dynamicBounds:null,calculateFeatureBounds:function(t,o){if(t){if(!this.options.adjustBounds&&!o)return;this._scanForBounds(t)}else this.eachLayer(this._scanForBounds,this);this._dynamicBounds&&this.fitBounds(this._dynamicBounds,this.getBoundsOptions())},getBoundsOptions:function(){return options={},this.options.boundsPadding?options.padding=this.options.boundsPadding:(this.options.boundsPaddingTopLeft&&(options.paddingTopLeft=this.options.boundsPaddingTopLeft),this.options.boundsPaddingBottomRight&&(options.paddingBottomRight=this.options.boundsPaddingBottomRight)),options},_scanForBounds:function(t){var o;!t.feature||t.feature.properties&&t.feature.properties.ignoreForBounds?L.MarkerClusterGroup&&t instanceof L.MarkerClusterGroup&&t.options.boundsMode&&"extend"==t.options.boundsMode?(o=t.getBounds()).isValid()&&(this._dynamicBounds?this._dynamicBounds.extend(o):this._dynamicBounds=L.latLngBounds(o.getSouthWest(),o.getNorthEast())):(!t.options||t.options&&t.options.boundsMode&&!t.options.ignoreForBounds)&&t.eachLayer&&t.eachLayer(this._scanForBounds,this):t.getBounds?(o=t.getBounds()).isValid()&&(this._dynamicBounds?this._dynamicBounds.extend(o):this._dynamicBounds=L.latLngBounds(o.getSouthWest(),o.getNorthEast())):t.getLatLng&&(o=t.getLatLng(),this._dynamicBounds?this._dynamicBounds.extend(o):this._dynamicBounds=L.latLngBounds(o,o))}}),L.LatLngBounds.prototype.toOverpassBBoxString=function(){var t=this._southWest,o=this._northEast;return[t.lat,t.lng,o.lat,o.lng].join(",")},L.OverPassLayer=L.FeatureGroup.extend({options:{minZoom:0,endpoint:"//overpass-api.de/api/",query:"(node(BBOX)[organic];node(BBOX)[second_hand];);out qt;",amenityIcons:{}},initialize:function(t){t.pointToLayer||(t.pointToLayer=this.pointToLayer),t.onEachFeature||(t.onEachFeature=this.onEachFeature),L.Util.setOptions(this,t),this.options.dynamicLoad=!!this.options.query.match(/BBOX/g),this._layer=L.geoJson(),this._layers={},this.addLayer(this._layer)},refreshData:function(){if(!(this._map.getZoom()<this.options.minZoom)){var t=this._map.getBounds().toOverpassBBoxString(),o=this.options.query.replace(/(BBOX)/g,t),e=this.options.endpoint+"interpreter?data=[out:json];"+o;this._map.fire("dataloading",{layer:this}),this.request(e,function(t,o){var e=JSON.parse(o.response),n=osmtogeojson(e),i=L.geoJson(n,{pointToLayer:this.options.pointToLayer.bind(this),onEachFeature:this.options.onEachFeature.bind(this)});if(this.addLayer(i),this.removeLayer(this._layer),this._layer=i,"extend"===this.options.boundsMode&&i.getBounds().isValid()){var s=this._map.getBounds();s=s.extend(i.getBounds()),this._map.fitBounds(s,this._map.getBoundsOptions())}this._map.fire("dataload",{layer:this})}.bind(this))}},onAdd:function(t){"fit"===this.options.boundsMode&&this.options.dynamicLoad&&t.on("moveend",this.refreshData,this),this.refreshData()},pointToLayer:function(t,o){var e=null,n=L.marker(o,t.properties.options);return t.properties&&(t.properties.radius&&n.setRadius(t.properties.radius),t.properties.icon?e=this._map.getIcon(t.properties.icon):t.properties.tags&&t.properties.tags.amenity&&this.options.amenityIcons[t.properties.tags.amenity]&&(e=L.contao.getIcon(this.options.amenityIcons[t.properties.tags.amenity])),e&&n.setIcon(e)),this.options.overpassPopup&&n.bindPopup(this.options.overpassPopup(t,n)),this._map.fire("point:added",{marker:n,feature:t,latlng:o,type:"marker"}),n},onEachFeature:function(t,o){t.properties&&(L.Util.setOptions(o,t.properties.options),this.options.overpassPopup&&o.bindPopup(this.options.overpassPopup(t,o)),this._map.fire("feature:added",{feature:t,layer:o}))},request:function(t,o,e){var n=!1;if(void 0===window.XMLHttpRequest)return o(Error("Browser not supported"));if(void 0===e){var i=t.match(/^\s*https?:\/\/[^\/]*/);e=i&&i[0]!==location.protocol+"//"+location.hostname+(location.port?":"+location.port:"")}var s=new window.XMLHttpRequest;if(e&&!("withCredentials"in s)){s=new window.XDomainRequest;var r=o;o=function(){if(n)r.apply(this,arguments);else{var t=this,o=arguments;setTimeout(function(){r.apply(t,o)},0)}}}function a(){var t;void 0===s.status||(200<=(t=s.status)&&t<300||304===t)?o.call(s,null,s):o.call(s,s,null)}return"onload"in s?s.onload=a:s.onreadystatechange=function(){4===s.readyState&&a()},s.onerror=function(t){o.call(this,t||!0,null),o=function(){}},s.onprogress=function(){},s.ontimeout=function(t){o.call(this,t,null),o=function(){}},s.onabort=function(t){o.call(this,t,null),o=function(){}},s.open("GET",t,!0),s.send(null),n=!0,s}});
\ No newline at end of file