map: Put layer toggle control construction in self-invoking function

This commit is contained in:
Adam Goldsmith 2018-08-10 11:45:22 -04:00
parent b3d36aa030
commit 6b9aaef2ad
1 changed files with 14 additions and 11 deletions

View File

@ -213,10 +213,6 @@ function plotPacketPaths(packets) {
});
}
let element = document.createElement('div');
element.className = 'layer-toggles ol-unselectable ol-control';
let inner = element.appendChild(document.createElement('div'));
function layer_toggle(layer, parentElement) {
if (layer.toggle_element === undefined) {
layer.toggle_element = parentElement.appendChild(
@ -235,13 +231,13 @@ function layer_toggle(layer, parentElement) {
return layer.toggle_element;
}
function render_layer_toggles(event) {
function render_layer_toggles(event, element) {
event.map.getLayers().getArray()
.filter(layer => layer.get('title') !== undefined)
.forEach(layer => {
if (layer instanceof LayerGroup) {
if (layer.group_toggle === undefined) {
let label = layer.group_toggle = inner.appendChild(
let label = layer.group_toggle = element.appendChild(
document.createElement('label'));
let input = label.appendChild(document.createElement('input'));
input.type = 'checkbox';
@ -254,7 +250,7 @@ function render_layer_toggles(event) {
document.createElement('input'));
child_toggle_element.type = 'checkbox';
child_toggle_element.checked = true;
child_toggle_element.addEventListener('click', event => {
child_toggle_element.addEventListener('change', event => {
console.log("test");
layer.getLayers().forEach(subLayer => {
subLayer.setVisible(event.target.checked);
@ -270,15 +266,22 @@ function render_layer_toggles(event) {
}
}
else {
layer_toggle(layer, inner);
layer_toggle(layer, element);
}
});
}
let control = new Control({element: element,
render: render_layer_toggles});
(function makeLayerToogleControl() {
let element = document.createElement('div');
element.className = 'layer-toggles ol-unselectable ol-control';
let inner = element.appendChild(document.createElement('div'));
let control = new Control(
{element: element,
render: event => render_layer_toggles(event, inner)});
map.addControl(control);
})();
map.addControl(control);
function parsePackets(packetLog) {
let parser = new APRSParser();