|
|
|
@ -25,7 +25,7 @@
|
|
|
|
|
var initial_pos = [parseFloat(hash[0]), parseFloat(hash[1])];
|
|
|
|
|
var initial_zoom = parseInt(hash[2]);
|
|
|
|
|
} else {
|
|
|
|
|
var initial_pos = points[0].coord;
|
|
|
|
|
var initial_pos = points.length == 0 ? [0, 0] : points[0].coord;
|
|
|
|
|
var initial_zoom = 5;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
@ -35,10 +35,23 @@
|
|
|
|
|
attributionControl: false
|
|
|
|
|
}).setView(initial_pos, initial_zoom);
|
|
|
|
|
|
|
|
|
|
for(var i=0;i<points.length;i++) {
|
|
|
|
|
L.circleMarker(points[i].coord, {
|
|
|
|
|
color: '#3388ff'
|
|
|
|
|
}).addTo(map).bindPopup(
|
|
|
|
|
'<a href="/photo/' + points[i].uuid + '">' +
|
|
|
|
|
'<img src="/thumb/set/feed/' + points[i].uuid + '.jpg"/>' +
|
|
|
|
|
'</a>' +
|
|
|
|
|
'<span>' + points[i].date + '</span>');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', {}).addTo(map);
|
|
|
|
|
|
|
|
|
|
// when resolving_hash is > 0 we ignore the map's moveend events as to avoid pushing state during a pop
|
|
|
|
|
var resolving_hash = 0;
|
|
|
|
|
// last_hash is used to avoid pushing duplicate states (e.g. zoom/panning an amount that is rounded out)
|
|
|
|
|
var last_hash = window.location.hash;
|
|
|
|
|
// we set a dynamic title by prepending the coordinates onto the original html title
|
|
|
|
|
var base_title = document.getElementsByTagName("title")[0].text
|
|
|
|
|
|
|
|
|
|
var updateTitle = function() {
|
|
|
|
@ -68,27 +81,11 @@
|
|
|
|
|
updateTitle();
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
map.on('moveend', updateState);
|
|
|
|
|
|
|
|
|
|
for(var i=0;i<points.length;i++) {
|
|
|
|
|
L.circleMarker(points[i].coord, {
|
|
|
|
|
color: '#3388ff'
|
|
|
|
|
}).addTo(map).bindPopup(
|
|
|
|
|
'<a href="/photo/' + points[i].uuid + '">' +
|
|
|
|
|
'<img src="/thumb/set/feed/' + points[i].uuid + '.jpg"/>' +
|
|
|
|
|
'</a>' +
|
|
|
|
|
'<span>' + points[i].date + '</span>');
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
updateState();
|
|
|
|
|
updateTitle();
|
|
|
|
|
|
|
|
|
|
addEventListener('popstate', function(state) {
|
|
|
|
|
var state = state.state;
|
|
|
|
|
if (!state) {
|
|
|
|
|
return;
|
|
|
|
|
}
|
|
|
|
|
console.log("pop")
|
|
|
|
|
resolving_hash += 1;
|
|
|
|
|
map.setView(state.pos, state.zoom);
|
|
|
|
|
setTimeout(
|
|
|
|
@ -98,6 +95,11 @@
|
|
|
|
|
500
|
|
|
|
|
)
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
map.on('moveend', updateState);
|
|
|
|
|
|
|
|
|
|
updateState();
|
|
|
|
|
updateTitle();
|
|
|
|
|
</script>
|
|
|
|
|
</div>
|
|
|
|
|
{% endblock %}
|
|
|
|
|