Changes based on user feedback

UI/Base/CollapseButton.ts

@@ -0,0 +1,43 @@
+import {UIElement} from "../UIElement";
+import {UIEventSource} from "../UIEventSource";
+
+
+export class CollapseButton extends UIElement {
+    public isCollapsed = new UIEventSource(false);
+
+    constructor(idToCollapse: string) {
+        super(undefined);
+        this.ListenTo(this.isCollapsed);
+        this.isCollapsed.addCallback((collapse) => {
+            const el = document.getElementById(idToCollapse);
+            if (el === undefined || el === null) {
+                console.log("Element not found")
+                return;
+            }
+            if (collapse) {
+                el.style.height = "3.5em";
+                el.style.width = "15em";
+            } else {
+                el.style.height = "auto";
+                el.style.width = "auto";
+            }
+        });
+
+        const self = this;
+        this.onClick(() => {
+            self.isCollapsed.setData(!self.isCollapsed.data);
+        })
+
+    }
+
+    protected InnerRender(): string {
+        const up = './assets/arrow-up.svg';
+        const down = './assets/arrow-down.svg';
+        let arrow = up;
+        if (this.isCollapsed.data) {
+            arrow = down;
+        }
+        return `<img class='collapse-button' src='${arrow}' alt='collapse'>`;
+    }
+
+}

UI/QuestionPicker.ts

@@ -36,7 +36,7 @@ export class QuestionPicker extends UIElement {
 
 
         if (highestQ === undefined) {
-            return "";
+            return "Er zijn geen vragen meer!";
         }
 
         return "<div class='infobox-questions'>" +

UI/SearchAndGo.ts

@@ -1,16 +1,14 @@
 import {UIElement} from "./UIElement";
 import {TextField} from "./Base/TextField";
-import {VariableUiElement} from "./Base/VariableUIElement";
 import {UIEventSource} from "./UIEventSource";
 import {FixedUiElement} from "./Base/FixedUiElement";
 import {Geocoding} from "../Logic/Geocoding";
 import {Basemap} from "../Logic/Basemap";
-import {VerticalCombine} from "./Base/VerticalCombine";
 
 
 export class SearchAndGo extends UIElement {
 
-    private _placeholder = new UIEventSource("Ga naar een locatie...")
+    private _placeholder = new UIEventSource("Zoek naar een locatie...")
     private _searchField = new TextField(this._placeholder);
 
     private _foundEntries = new UIEventSource([]);
@@ -39,16 +37,24 @@ export class SearchAndGo extends UIElement {
         this._searchField.Clear();
         this._placeholder.setData("Bezig met zoeken...");
         const self = this;
-        Geocoding.Search(searchString, undefined, (result) => {
+        Geocoding.Search(searchString, this._map, (result) => {
 
-            const bb = result[0].boundingbox;
-            const bounds = [
-                [bb[0], bb[2]],
-                [bb[1], bb[3]]
-            ]
-            self._map.map.fitBounds(bounds);
-            this._placeholder.setData("Ga naar locatie...");
-        });
+                if (result.length == 0) {
+                    this._placeholder.setData("Niets gevonden");
+                    return;
+                }
+
+                const bb = result[0].boundingbox;
+                const bounds = [
+                    [bb[0], bb[2]],
+                    [bb[1], bb[3]]
+                ]
+                self._map.map.fitBounds(bounds);
+                this._placeholder.setData("Zoek naar een locatie...");
+            },
+            () => {
+                this._placeholder.setData("Niets gevonden: er ging iets mis");
+            });
 
     }
 

UI/UIElement.ts

@@ -57,6 +57,7 @@ export abstract class UIElement {
             element.onclick = () => {
                 self._onClick();
             }
+            element.style.pointerEvents = "all";
             element.style.cursor = "pointer";
         }