--- a/client/src/store/diagram.js	Tue May 07 16:59:11 2019 +0200
+++ b/client/src/store/diagram.js	Tue May 07 17:38:25 2019 +0200
@@ -12,9 +12,20 @@
  * Thomas Junk <thomas.junk@intevation.de>
  */
 
+import { HTTP } from "@/lib/http";
+
+const MOCKDATA = `#label,# >= LDC [h],# < 200.00 [h],# >= 200.00 [h],# >= 230.00 [h],# >= 250.00 [h]
+01-2019, 22.000,1.000, 4.000,6.000, 20.000
+02-2019, 24.000,0.000,0.000,0.000, 23.000
+03-2019, 30.000,0.000,0.000,0.000, 30.000
+04-2019, 30.000,0.000,0.000,0.000, 30.000
+05-2019, 30.000,0.000,0.000,0.000, 30.000`;
+
 const init = () => {
   return {
-    selectedFairwayAvailabilityFeature: null
+    selectedFairwayAvailabilityFeature: null,
+    fwData: null,
+    legend: null
   };
 };
 
@@ -25,6 +36,49 @@
   mutations: {
     setSelectedFairwayAvailability: (state, feature) => {
       state.selectedFairwayAvailabilityFeature = feature;
+    },
+    setFwData: (state, fwData) => {
+      state.fwData = fwData;
+    },
+    setLegend: (state, header) => {
+      const headerEntries = header.split(",");
+      headerEntries.shift();
+      state.legend = headerEntries.map(x => {
+        return x.split("#")[1].trim();
+      });
+    }
+  },
+  actions: {
+    loadAvailableFairwayDepth: ({ commit }, options) => {
+      return new Promise((resolve, reject) => {
+        const { featureName } = options;
+        const URL = `/data/bottleneck/fairway-depth/${featureName}?from=2019-01-01T15:04:05%2b00:00&to=2019-05-02T15:04:05%2b07:00&mode=monthly`;
+        HTTP.get(URL, {
+          headers: { "X-Gemma-Auth": localStorage.getItem("token") }
+        })
+          .then(response => {
+            const data = MOCKDATA;
+            const csv = data.split("\n");
+            commit("setLegend", csv.shift());
+            let transformed = csv.map(e => {
+              const result = e.split(",");
+              const label = result.shift();
+              const ldc = result.shift();
+              const highestLevel = result.pop();
+              return {
+                label: label,
+                ldc: ldc,
+                highestLevel: highestLevel,
+                lowerLevels: result
+              };
+            });
+            commit("setFwData", transformed);
+            resolve(response);
+          })
+          .catch(error => {
+            reject(error);
+          });
+      });
     }
   }
 };