74 lines
3.2 KiB
JavaScript
74 lines
3.2 KiB
JavaScript
|
|
var map = L.map('map').setView([50.880301, 6.560531], 13,);
|
|
L.tileLayer('https://tile.openstreetmap.org/{z}/{x}/{y}.png', { minZoom: 12, maxZoom: 19, attribution: 'Map data: © <a href="http://www.openstreetmap.org/copyright">OpenStreetMap contributors</a>' }).addTo(map);
|
|
let editButton = L.control.editButton({position: 'topright'});
|
|
map.addControl(editButton,);
|
|
|
|
var barrio_markers = L.layerGroup(); //overlay where all barrio markers will be added
|
|
var tree_markers = L.layerGroup(); //overlay where all tree(house) markers will be added
|
|
var test_tree_marker = L.marker([50.880301, 6.560531]).addTo(tree_markers);
|
|
map.addLayer(tree_markers);
|
|
|
|
|
|
function onMapClick(e){ //for adding a tree(house)
|
|
if (editing && map.getZoom() > max_barrio_zoom) {
|
|
sidebar.open('tree');
|
|
}
|
|
}
|
|
function onMapZoom(e){ //for deciding wether to show barrios or treehouses
|
|
if (map.getZoom() > max_barrio_zoom) {
|
|
map.addLayer(tree_markers);
|
|
map.removeLayer(barrio_markers);
|
|
|
|
}
|
|
if (map.getZoom() <= max_barrio_zoom) {
|
|
map.addLayer(barrio_markers);
|
|
map.removeLayer(tree_markers);
|
|
}
|
|
}
|
|
function onSelectAreaFeatureEnabled(e){
|
|
}
|
|
function onSelectAreaFeatureDisabled(e){
|
|
}
|
|
function onMapMouseDown(e){} //probably needed for Barrio creation -> nope.
|
|
function onMapMouseUp(e){
|
|
console.log(e);
|
|
if (editing && (map.getZoom() <= max_barrio_zoom)) {
|
|
// use selectfeature.getAreaLatLng() to fill in hidden fields of the form
|
|
// add a new panel
|
|
let panelContent = {
|
|
id: 'barrio_form', // UID, used to access the panel
|
|
tab: '<i class="fa fa-tents"></i>', // content can be passed as HTML string,
|
|
pane: 'TODO: put form for barrio input here',//someDomNode.innerHTML, // DOM elements can be passed, too
|
|
title: 'Barrio Form', // an optional pane header
|
|
};
|
|
sidebar.addPanel(panelContent);
|
|
sidebar.open('barrio_form');
|
|
// TODO disable drawing feature until sidebar panel is removed. In other words: You may only draw if there is no barrio form already open
|
|
if(document.getElementById('barrio_form'))
|
|
map.selectAreaFeature.disable();
|
|
}
|
|
}
|
|
function onMapContextMenu(e){}//probably neat for something
|
|
|
|
var sidebar = L.control.sidebar({
|
|
container: 'sidebar', // the DOM container or #ID of a predefined sidebar container that should be used
|
|
}).addTo(map).open('home');
|
|
|
|
map.on('click', onMapClick);
|
|
map.on('zoomend', onMapZoom);
|
|
map.on('mousedown', onMapMouseDown);
|
|
map.on('drawend', onMapMouseUp); // because registering a listener on mouseup or layeradd breaks the SelectFeature plugin
|
|
map.on('contextMenu', onMapContextMenu);
|
|
map.on('selectareadisabled', onSelectAreaFeatureDisabled);
|
|
map.on('selectareaenabled', onSelectAreaFeatureEnabled);
|
|
sidebar.on('closing', function(e) {
|
|
if(document.getElementById('barrio_form')) {
|
|
sidebar.removePanel('barrio_form');
|
|
// this seems redundant, but I want to check that we removed *the last* of (hopefully, but not guaranteed i guess, only one) barrio_form(s)
|
|
if(!document.getElementById('barrio_form') && editing && map.getZoom() <= max_barrio_zoom)
|
|
map.selectAreaFeature.enable();
|
|
}
|
|
});
|
|
|