Add cartography menu with image overlays (WIP)

webgis/js/controllers/layer_controller.js

@@ -1,8 +1,37 @@
 import { Controller } from "@hotwired/stimulus";
 import { GisState } from "../state.js";
+import GIS from "../gis.js";
 
 export default class extends Controller {
-    static targets = ['sites', 'findings', 'notconserved', 'prehist',];
+    static targets = [
+        'sites',
+        'findings',
+        'notconserved',
+        'prehist',
+    ];
+
+    static values = {
+        'id': Number,
+        'type': String,
+    };
+
+    async toggleCartography() {
+        const map = GisState.map;
+        const id = this.idValue;
+
+        let currentLayer = await GIS.getImageOverlay(id);
+        let hasLayer = false;
+
+        map.eachLayer(function (layer) {
+            if (layer.options.label === currentLayer.options.label) {
+                hasLayer |= true;
+                currentLayer = layer;
+            }
+        });
+
+        if (!hasLayer) currentLayer.addTo(map);
+        else map.removeLayer(currentLayer);
+    }
 
     /**
      * @todo Use Stimulus values?