map: Include layer selection in URL
This provides a permalink which includes the map settings. Signed-off-by: Adrian Schmutzler <freifunk@adrianschmutzler.de>
This commit is contained in:
parent
f26f01f73c
commit
24e934b66c
|
@ -26,9 +26,9 @@ var overlay_config = {
|
|||
maximumAge: 1000*3600*24*10
|
||||
}
|
||||
|
||||
var routers = new L.TileLayer(tileurls.routers + '/{z}/{x}/{y}.png', overlay_config).addTo(map);
|
||||
var routers_v2 = new L.TileLayer(tileurls.routers_v2 + '/{z}/{x}/{y}.png', overlay_config).addTo(map);
|
||||
var routers_local = new L.TileLayer(tileurls.routers_local + '/{z}/{x}/{y}.png', overlay_config).addTo(map);
|
||||
var routers = new L.TileLayer(tileurls.routers + '/{z}/{x}/{y}.png', overlay_config);
|
||||
var routers_v2 = new L.TileLayer(tileurls.routers_v2 + '/{z}/{x}/{y}.png', overlay_config);
|
||||
var routers_local = new L.TileLayer(tileurls.routers_local + '/{z}/{x}/{y}.png', overlay_config);
|
||||
var hoods = new L.TileLayer(tileurls.hoods + '/{z}/{x}/{y}.png', overlay_config);
|
||||
var hoods_v2 = new L.TileLayer(tileurls.hoods_v2 + '/{z}/{x}/{y}.png', overlay_config);
|
||||
var popuplayer = new L.TileLayer('');
|
||||
|
@ -56,17 +56,27 @@ if (window.matchMedia("(min--moz-device-pixel-ratio: 1.5),(-o-min-device-pixel-r
|
|||
var popup;
|
||||
var popupopen = false;
|
||||
|
||||
function update_mappos_permalink() {
|
||||
function update_permalink() {
|
||||
if (typeof mapurl != 'undefined') {
|
||||
var pos = map.getCenter();
|
||||
var zoom = map.getZoom();
|
||||
window.history.replaceState({}, document.title, mapurl + '?mapcenter='+pos.lat.toFixed(5)+','+pos.lng.toFixed(5)+','+zoom);
|
||||
window.history.replaceState({}, document.title,
|
||||
mapurl + '?mapcenter=' + pos.lat.toFixed(5) + ',' + pos.lng.toFixed(5) + ',' + zoom
|
||||
+ '&layers=' + (map.hasLayer(routers)|0) + ',' + (map.hasLayer(routers_v2)|0) + ',' + (map.hasLayer(routers_local)|0) + ','
|
||||
+ (map.hasLayer(hoods)|0) + ',' + (map.hasLayer(hoods_v2)|0) + ',' + (map.hasLayer(popuplayer)|0) );
|
||||
}
|
||||
}
|
||||
|
||||
function initialLayers() {
|
||||
routers.addTo(map);
|
||||
routers_v2.addTo(map);
|
||||
routers_local.addTo(map);
|
||||
}
|
||||
|
||||
map.on('moveend', update_mappos_permalink);
|
||||
map.on('zoomend', update_mappos_permalink);
|
||||
map.on('moveend', update_permalink);
|
||||
map.on('zoomend', update_permalink);
|
||||
map.on('overlayadd', update_permalink);
|
||||
map.on('overlayremove', update_permalink);
|
||||
|
||||
map.on('click', function(pos) {
|
||||
// height = width of world in px
|
||||
|
|
|
@ -33,11 +33,24 @@
|
|||
<script src="{{ url_for('static', filename='js/map.js') }}"></script>
|
||||
<script type="text/javascript">
|
||||
if (window.location.search.match("^\\?mapcenter")) {
|
||||
var maploc = window.location.search.replace("?mapcenter=", "").split(",");
|
||||
var getargs = window.location.search.replace("?mapcenter=", "").split("&");
|
||||
var maploc = getargs[0].split(",");
|
||||
map.setView([maploc[0], maploc[1]], maploc[2]);
|
||||
if (getargs.length > 1 && getargs[1].match("layers=")) {
|
||||
var getlayers = getargs[1].replace("layers=", "").split(",");
|
||||
if(getlayers[0]==1) { routers.addTo(map); }
|
||||
if(getlayers[1]==1) { routers_v2.addTo(map); }
|
||||
if(getlayers[2]==1) { routers_local.addTo(map); }
|
||||
if(getlayers[3]==1) { hoods.addTo(map); }
|
||||
if(getlayers[4]==1) { hoods_v2.addTo(map); }
|
||||
if(getlayers[5]==1) { popuplayer.addTo(map); }
|
||||
} else {
|
||||
initialLayers();
|
||||
}
|
||||
}
|
||||
else {
|
||||
map.setView([49.45, 11.1], 10);
|
||||
initialLayers();
|
||||
}
|
||||
</script>
|
||||
{% endblock %}
|
||||
|
|
|
@ -90,6 +90,7 @@
|
|||
</script>
|
||||
<script src="{{ url_for('static', filename='js/map.js') }}"></script>
|
||||
<script type="text/javascript">
|
||||
initialLayers();
|
||||
{%- if router.lng and router.lat %}
|
||||
var router_pos = [{{ router.lat }}, {{ router.lng }}];
|
||||
map.setView(router_pos, 18);
|
||||
|
|
Loading…
Reference in New Issue