# HG changeset patch
# User Bernhard Reiter <bernhard@intevation.de>
# Date 1537958624 -7200
# Node ID bb3558142b1849057c81f7a7f4c857338427ccf8
# Parent  22c3acea700d1373fccb60c795b59dd5105cf747
client: add backendrequest to search

 * Add request to backend for search. The output goes to the console.

diff -r 22c3acea700d -r bb3558142b18 client/src/application/Topbar.vue
--- a/client/src/application/Topbar.vue	Wed Sep 26 11:57:30 2018 +0200
+++ b/client/src/application/Topbar.vue	Wed Sep 26 12:43:44 2018 +0200
@@ -86,10 +86,12 @@
 
 
 <script>
-import debounce from 'lodash.debounce'
+import debounce from "lodash.debounce";
 
+import { displayError } from "../application/lib/errors.js";
+import { HTTP } from "../application/lib/http";
+import Identify from "../layers/Identify";
 import Layers from "../layers/Layers";
-import Identify from "../layers/Identify";
 
 export default {
   name: "topbar",
@@ -106,13 +108,13 @@
     };
   },
   computed: {
-    searchIndicator: function () {
+    searchIndicator: function() {
       if (this.isSearching) {
-        return '⟳';
+        return "⟳";
       } else if (this.searchQueryIsDirty) {
-        return '';
+        return "";
       } else {
-        return '✓';
+        return "✓";
       }
     },
     searchbarContainerStyle() {
@@ -128,17 +130,38 @@
   watch: {
     searchQuery: function() {
       this.searchQueryIsDirty = true;
-      this.doSearch();
+      this.triggerSearch();
     }
   },
   methods: {
-    doSearch: debounce(function() {
+    doSearch() {
       this.isCalculating = true;
-      console.log("Would start search of", this.searchQuery);
+      console.log("Starting search of", this.searchQuery);
+
+      HTTP.post(
+        "/search",
+        { string: this.searchQuery },
+        {
+          headers: {
+            "X-Gemma-Auth": localStorage.getItem("token"),
+            "Content-type": "text/xml; charset=UTF-8"
+          }
+        }
+      )
+        .then(response => {
+          console.log("got:", response.data);
+        })
+        .catch(error => {
+          const { status, data } = error.response;
+          displayError({
+            title: "Backend Error",
+            message: `${status}: ${data.message || data}`
+          });
+        });
+
       this.isCalculating = false;
       this.searchQueryIsDirty = false;
-      }, 500
-    ),
+    },
     toggleSearchbar() {
       this.searchbarCollapsed = !this.searchbarCollapsed;
     },
@@ -147,7 +170,10 @@
     },
     splitScreen() {
       this.$store.commit("application/toggleSplitScreen");
-    }
+    },
+    triggerSearch: debounce(function() {
+      this.doSearch();
+    }, 500)
   }
 };
 </script>