Multiparam organizing works

spatial/static/spatial/js/slidingMap.js

@@ -7,19 +7,24 @@ let layers = [];
 
 let mapserverURL="https://testvips.nibio.no/cgi-bin/";
 let modelId = "SEPTREFHUM";
-let today = "2023-10-14";
+let today = "2023-04-10";
 let todayLayerIndex = undefined;
 let timestamps = undefined;
+let currentParameter = "WARNING_STATUS";
+let WMSLayersDateBucket = {};
 
-function switchLayer(visibleLayerIndex)
+function switchLayer(dayIndex)
 {
-    console.info("==>" + visibleLayerIndex);
+    console.info("==>" + dayIndex);
+    currentTimestamp = timestamps[dayIndex];
+    currentLayer = WMSLayersDateBucket[currentTimestamp][currentParameter];
+    currentLayerOrdering = currentLayer["ordering"];
     for(let i=0;i<layers.length;i++)
     {
         console.info(i)
-        layers[i].setVisible(i==visibleLayerIndex);
+        layers[i].setVisible(i==currentLayerOrdering);
     }
-    setCurrentDate(visibleLayerIndex);
+    setCurrentDate(dayIndex);
 }
 
 function setCurrentDate(layerIndex)
@@ -48,18 +53,20 @@ async function initSlidingMap(lonLat, zoomLevel, mapAttribution) {
     let result = parser.read(await response.text());
     let WMSLayers = result.Capability.Layer.Layer;
 
-    // Analyze layers
-    let WMSLayersDateBucket = {};
+    // Analyze and organize layers
+    
     for(let i=0;i<WMSLayers.length;i++){
-        // Get only WARNING_STATUS layers for now
         // Sort by date ascending
-        WMSLayerName = WMSLayers[i].Name;
-        if(WMSLayerName.split(".")[1] == "WARNING_STATUS")
+        let WMSLayerName = WMSLayers[i].Name;
+        let WMSLayerParam = WMSLayerName.split(".")[1]
+        let timestamp = moment(WMSLayerName.split(".")[2]).valueOf();
+        if(WMSLayersDateBucket[timestamp] == undefined)
         {
-            WMSLayersDateBucket[moment(WMSLayerName.split(".")[2]).valueOf()] = WMSLayers[i];
+            WMSLayersDateBucket[timestamp] = {}
         }
-        
+        WMSLayersDateBucket[timestamp][WMSLayerParam] = WMSLayers[i];
     }
+    //console.info(WMSLayersDateBucket);
 
     timestamps = Object.keys(WMSLayersDateBucket);
 
@@ -71,23 +78,29 @@ async function initSlidingMap(lonLat, zoomLevel, mapAttribution) {
         let dateStr = moment(parseInt(timestamps[i])).format("YYYY-MM-DD");
         if(dateStr == today)
         {
-            console.info("YESS: " + i);
             todayLayerIndex = i;
         }
-
-        layers.push(
-            new ol.layer.Image({
-                source: new ol.source.ImageWMS({
-                    url: mapserverURL + modelId,
-                    params: { "LAYERS": modelId + ".WARNING_STATUS." + dateStr, "TRANSPARENT": "TRUE" },
-                    serverType: "mapserver",
-                    ratio: 1,
-                    projection: ol.proj.get("EPSG:25833")
-                }),
-                visible: (i==todayLayerIndex),
-                opacity: 0.5
-            })
-        );
+        let timestampLayers = WMSLayersDateBucket[timestamps[i]];
+        let params = Object.keys(timestampLayers);
+        for(let j=0; j<params.length;j++)
+        {
+            let currentLayer = timestampLayers[params[j]];
+            let currentLayerParam = currentLayer.Name.split(".")[1];
+            layers.push(
+                new ol.layer.Image({
+                    source: new ol.source.ImageWMS({
+                        url: mapserverURL + modelId,
+                        params: { "LAYERS": modelId + "." + currentLayerParam + "." + dateStr, "TRANSPARENT": "TRUE" },
+                        serverType: "mapserver",
+                        ratio: 1,
+                        projection: ol.proj.get("EPSG:25833")
+                    }),
+                    visible: false,
+                    opacity: 0.5
+                })
+            );
+            currentLayer["ordering"] = layers.length -1;
+        }
     }
 
     let range = document.getElementById("layerDateRange");
@@ -95,8 +108,9 @@ async function initSlidingMap(lonLat, zoomLevel, mapAttribution) {
     range.max = timestamps.length -1;
     range.value = todayLayerIndex;
     setCurrentDate(todayLayerIndex);
+    switchLayer(todayLayerIndex);
     
-    
+    //console.info(WMSLayersDateBucket);
 
 	// Creating the map
 	map = new ol.Map({