# HG changeset patch
# User Raimund Renkert <raimund.renkert@intevation.de>
# Date 1549898392 -3600
# Node ID 826fc7309370f3c7836334f3507a1b40917a809d
# Parent  b27edd1f2353deac047f33b738843ee6f1c597a0
client: Added refresh button to reload the WFS layer data.

diff -r b27edd1f2353 -r 826fc7309370 client/src/components/Maplayer.vue
--- a/client/src/components/Maplayer.vue	Mon Feb 11 16:16:35 2019 +0100
+++ b/client/src/components/Maplayer.vue	Mon Feb 11 16:19:52 2019 +0100
@@ -183,35 +183,41 @@
 
     // load different fairway dimension layers (level of service)
     ["1", "2", "3"].forEach(los => {
-      // loading the full WFS layer, by not setting the loader function
-      // and without bboxStrategy
-      var featureRequest = new WFS().writeGetFeature({
-        srsName: "EPSG:3857",
-        featureNS: "gemma",
-        featurePrefix: "gemma",
-        featureTypes: ["fairway_dimensions"],
-        outputFormat: "application/json",
-        filter: equalTo("level_of_service", los)
-      });
+      // loading the full WFS layer without bboxStrategy
+      var source = this.getVSourceByName("Fairway Dimensions LOS " + los)
+      var loader = function(extent, resolution, projection) {
+        var featureRequest = new WFS().writeGetFeature({
+          srsName: "EPSG:3857",
+          featureNS: "gemma",
+          featurePrefix: "gemma",
+          featureTypes: ["fairway_dimensions"],
+          outputFormat: "application/json",
+          filter: equalTo("level_of_service", los)
+        });
 
-      // NOTE: loading the full fairway_dimensions makes sure
-      //       that all are available for the intersection with the profile
-      HTTP.post(
-        "/internal/wfs",
-        new XMLSerializer().serializeToString(featureRequest),
-        {
-          headers: {
-            "X-Gemma-Auth": localStorage.getItem("token"),
-            "Content-type": "text/xml; charset=UTF-8"
+        featureRequest["outputFormat"] = "application/json";
+        // NOTE: loading the full fairway_dimensions makes sure
+        //       that all are available for the intersection with the profile
+        HTTP.post(
+          "/internal/wfs",
+          new XMLSerializer().serializeToString(featureRequest),
+          {
+            headers: {
+              "X-Gemma-Auth": localStorage.getItem("token"),
+              "Content-type": "text/xml; charset=UTF-8"
+            }
           }
-        }
-      ).then(response => {
-        this.getVSourceByName("Fairway Dimensions LOS " + los).addFeatures(
-          new GeoJSON().readFeatures(JSON.stringify(response.data))
-        );
-        // would scale to the extend of all resulting features
-        // this.openLayersMap.getView().fit(vectorSrc.getExtent());
-      });
+        ).then(response => {
+          source.addFeatures(
+            new GeoJSON().readFeatures(JSON.stringify(response.data))
+          );
+          // would scale to the extend of all resulting features
+          // this.openLayersMap.getView().fit(vectorSrc.getExtent());
+        });
+      }
+
+      layer = this.getLayerByName("Fairway Dimensions LOS " + los);
+      layer.data.getSource().setLoader(loader)
     });
 
     // load following layers with bboxStrategy (using our request builder)
diff -r b27edd1f2353 -r 826fc7309370 client/src/components/Zoom.vue
--- a/client/src/components/Zoom.vue	Mon Feb 11 16:16:35 2019 +0100
+++ b/client/src/components/Zoom.vue	Mon Feb 11 16:19:52 2019 +0100
@@ -10,6 +10,12 @@
       <font-awesome-icon icon="minus"></font-awesome-icon>
     </button>
     <button
+      class="zoomButton border-0 bg-white ui-element border-right"
+      @click="refreshMap"
+    >
+      <font-awesome-icon icon="redo"></font-awesome-icon>
+    </button>
+    <button
       class="zoomButton border-0 bg-white rounded-right ui-element border-right"
       @click="zoomIn"
     >
@@ -49,6 +55,7 @@
  * Thomas Junk <thomas.junk@intevation.de>
  */
 import { mapState } from "vuex";
+import { Tile as TileLayer, Vector as VectorLayer } from "ol/layer.js";
 
 export default {
   name: "zoom",
@@ -70,6 +77,17 @@
     },
     zoomOut() {
       this.zoomLevel = this.zoomLevel - 1;
+    },
+    refreshMap() {
+      let layers = this.openLayersMap.getLayers().getArray();
+      for (let i = 0; i < layers.length; i++) {
+        let layer = layers[i];
+        if (layer instanceof VectorLayer) {
+          console.log(layer.get('source').loader_);
+          layer.getSource().clear(true)
+          layer.getSource().refresh({force: true})
+        }
+      }
     }
   }
 };
diff -r b27edd1f2353 -r 826fc7309370 client/src/main.js
--- a/client/src/main.js	Mon Feb 11 16:16:35 2019 +0100
+++ b/client/src/main.js	Mon Feb 11 16:19:52 2019 +0100
@@ -73,7 +73,8 @@
   faUser,
   faUsersCog,
   faWater,
-  faWrench
+  faWrench,
+  faRedo
 } from "@fortawesome/free-solid-svg-icons";
 import { faAdn } from "@fortawesome/free-brands-svg-icons";
 import { FontAwesomeIcon } from "@fortawesome/vue-fontawesome";
@@ -125,7 +126,8 @@
   faUser,
   faUsersCog,
   faWater,
-  faWrench
+  faWrench,
+  faRedo
 );
 import ToggleButton from "vue-js-toggle-button";