# HG changeset patch
# User Markus Kottlaender <markus@intevation.de>
# Date 1551684725 -3600
# Node ID 7247eb03e7c08057e8d1cf23acf474fb5d599666
# Parent  ae1987c5beb39b64fbc6a1e59e44c03d3ccfaff7# Parent  204b0baac93c19533e2e1cdfa3c52fcae9a8cbe7
merged default into critical-bottlenecks branch

diff -r 204b0baac93c -r 7247eb03e7c0 client/src/components/Maplayer.vue
--- a/client/src/components/Maplayer.vue	Mon Mar 04 08:18:06 2019 +0100
+++ b/client/src/components/Maplayer.vue	Mon Mar 04 08:32:05 2019 +0100
@@ -367,6 +367,20 @@
     );
     layer.data.setVisible(layer.isVisible);
 
+    layer = this.getLayerByName(LAYERS.BOTTLENECKSTATUS);
+    layer.data.getSource().setLoader(
+      this.buildVectorLoader(
+        {
+          featureNS: "gemma",
+          featurePrefix: "gemma",
+          featureTypes: ["bottlenecks_geoserver"],
+          geometryName: "area"
+        },
+        "/internal/wfs",
+        layer.data.getSource()
+      )
+    );
+
     layer = this.getLayerByName(LAYERS.BOTTLENECKS);
     layer.data.getSource().setLoader(
       this.buildVectorLoader(
@@ -385,22 +399,27 @@
       headers: { "X-Gemma-Auth": localStorage.getItem("token") }
     })
       .then(response => {
-        this.btlnStrokeC = response.data.code;
+        let btlnStrokeC = response.data.code;
         HTTP.get("/system/style/Bottlenecks/fill", {
           headers: { "X-Gemma-Auth": localStorage.getItem("token") }
         })
           .then(response => {
-            this.btlnFillC = response.data.code;
-            var newstyle = new Style({
+            let btlnFillC = response.data.code;
+            var newStyle = new Style({
               stroke: new Stroke({
-                color: this.btlnStrokeC,
+                color: btlnStrokeC,
                 width: 4
               }),
               fill: new Fill({
-                color: this.btlnFillC
+                color: btlnFillC
               })
             });
-            layer.data.setStyle(newstyle);
+            layer.data.setStyle(function(feature, resolution) {
+              if (resolution <= 50) {
+                return newStyle;
+              }
+              return null;
+            });
           })
           .catch(error => {
             console.log(error);
diff -r 204b0baac93c -r 7247eb03e7c0 client/src/store/map.js
--- a/client/src/store/map.js	Mon Mar 04 08:18:06 2019 +0100
+++ b/client/src/store/map.js	Mon Mar 04 08:32:05 2019 +0100
@@ -52,6 +52,7 @@
   WATERWAYAXIS: "Waterway Axis",
   WATERWAYPROFILES: "Waterway Profiles",
   BOTTLENECKS: "Bottlenecks",
+  BOTTLENECKSTATUS: "Bottleneck Status",
   BOTTLENECKISOLINE: "Bottleneck isolines",
   DISTANCEMARKS: "Distance marks",
   DISTANCEMARKSAXIS: "Distance marks, Axis",
@@ -288,15 +289,17 @@
           source: new VectorSource({
             strategy: bboxStrategy
           }),
-          style: new Style({
-            stroke: new Stroke({
-              color: "rgba(230, 230, 10, .8)",
-              width: 4
-            }),
-            fill: new Fill({
-              color: "rgba(230, 230, 10, .3)"
-            })
-          })
+          style: function() {
+            return new Style({
+              stroke: new Stroke({
+                color: "rgba(230, 230, 10, .8)",
+                width: 4
+              }),
+              fill: new Fill({
+                color: "rgba(230, 230, 10, .3)"
+              })
+            });
+          }
         }),
         isVisible: true,
         showInLegend: true
@@ -330,6 +333,35 @@
         showInLegend: true
       },
       {
+        name: LAYERS.BOTTLENECKSTATUS,
+        forLegendStyle: { point: true, resolution: 51 },
+        data: new VectorLayer({
+          source: new VectorSource({
+            strategy: bboxStrategy
+          }),
+          style: function(feature, resolution) {
+            if (resolution > 50) {
+              let bnCenter = getCenter(feature.getGeometry().getExtent());
+              let fillColor = feature.get("fa_critical")
+                ? "rgba(255, 0, 0, 0.5)"
+                : "rgba(0, 255, 0, 0.5)";
+              let strokeColor = feature.get("fa_critical") ? "red" : "green";
+              return new Style({
+                geometry: new Point(bnCenter),
+                image: new Circle({
+                  radius: 10,
+                  fill: new Fill({ color: fillColor }),
+                  stroke: new Stroke({ color: strokeColor, width: 2 })
+                })
+              });
+            }
+            return [];
+          }
+        }),
+        isVisible: true,
+        showInLegend: true
+      },
+      {
         name: LAYERS.DISTANCEMARKS,
         forLegendStyle: { point: true, resolution: 8 },
         data: new VectorLayer({