From a3f0dffc30760afeccff7508b906e19129a9952e Mon Sep 17 00:00:00 2001 From: mcbloch Date: Thu, 4 Apr 2019 20:41:43 +0200 Subject: [PATCH] move script to separate js file, add loging for bad adresses --- app/static/js/map.js | 61 ++++++++++++++++++++++++++++++++ app/templates/maps.html | 77 ++++++----------------------------------- 2 files changed, 72 insertions(+), 66 deletions(-) create mode 100644 app/static/js/map.js diff --git a/app/static/js/map.js b/app/static/js/map.js new file mode 100644 index 0000000..45a198f --- /dev/null +++ b/app/static/js/map.js @@ -0,0 +1,61 @@ +var map = L.map('mapid').setView([ + 51.0231119, 3.7102741 +], 14); +L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { + attribution: '© OpenStreetMap contributors' +}).addTo(map); + + +function performRequest(url, location, success_callback) { + var request = new XMLHttpRequest(); + request.open('GET', url, true); + request.onload = function() { + if (this.status >= 200 && this.status < 400) { + // Success! + var data = JSON.parse(this.response); + success_callback(location, data); + } else { + // We reached our target server, but it returned an error + } + }; + request.onerror = function() { + console.log("Error requestion location coordinates"); + // There was a connection error of some sort + }; + request.send(); +} + +let marker_icon = L.icon({ + iconUrl: "/static/images/marker-icon.png", + shadowUrl: "/static/images/marker-shadow.png" +}); + +let callback = function OSMCallBack(location, data) { + var lat, lon; + if (data.features.length >= 1) { + var place = data.features[0].properties; + lat = data.features[0].geometry.coordinates[1]; + lon = data.features[0].geometry.coordinates[0]; + + let marker = L.marker([lat, lon], { + icon: marker_icon + }).addTo(map) + .bindPopup(location.name + ', ' + location.address); + + marker.on('mouseover', function(env) { + marker.openPopup(); + }); + marker.on('mouseout', function(env) { + marker.closePopup(); + }); + } else { + console.log(`Location ${JSON.stringify(location, null, 2)} returned no features, are you sure this is a valid address?`); + } +}; + +function loadmap(locations) { + for (let loc of locations) { + let request_uri = "https://photon.komoot.de/api/?limit=1&q=" + loc.address; + performRequest(request_uri, loc, callback); + }; +} diff --git a/app/templates/maps.html b/app/templates/maps.html index 446a573..da45976 100644 --- a/app/templates/maps.html +++ b/app/templates/maps.html @@ -18,74 +18,19 @@ {% block scripts %} {{super()}} - + -{% endblock %} \ No newline at end of file +{% endblock %}