From 5f0243384cc43d57e666bd09a0a809c948259834 Mon Sep 17 00:00:00 2001
From: Pieter Vander Vennet <pietervdvn@gmail.com>
Date: Sun, 26 Jul 2020 23:28:31 +0200
Subject: [PATCH] Popup doesn't hide the icon anymore

---
 Customizations/Layers/Bookcases.ts |  3 ++-
 Customizations/TagRendering.ts     |  3 +--
 Logic/FilteredLayer.ts             | 33 ++++++++++++++++++++++--------
 3 files changed, 27 insertions(+), 12 deletions(-)

diff --git a/Customizations/Layers/Bookcases.ts b/Customizations/Layers/Bookcases.ts
index 6092291..c5c3bec 100644
--- a/Customizations/Layers/Bookcases.ts
+++ b/Customizations/Layers/Bookcases.ts
@@ -162,7 +162,8 @@ export class Bookcases extends LayerDefinition {
                 icon: {
                     iconUrl: "assets/bookcase.svg",
                     iconSize: [40, 40],
-                    iconAnchor: [20,20]
+                    iconAnchor: [20,20],
+                    popupAnchor: [0, -15]
                 },
                 color: "#0000ff"
             };
diff --git a/Customizations/TagRendering.ts b/Customizations/TagRendering.ts
index 34ed407..26f2010 100644
--- a/Customizations/TagRendering.ts
+++ b/Customizations/TagRendering.ts
@@ -335,7 +335,7 @@ class TagRendering extends UIElement implements TagDependantUIElement {
 
 
         if (elements.length == 0) {
-            console.warn("WARNING: no tagrendering with following options:", options);
+            //console.warn("WARNING: no tagrendering with following options:", options);
             return new FixedInputElement("This should not happen: no tag renderings defined", undefined);
         }
         if (elements.length == 1) {
@@ -362,7 +362,6 @@ class TagRendering extends UIElement implements TagDependantUIElement {
 
         let isValid = TagRenderingOptions.inputValidation[type];
         if (isValid === undefined) {
-            console.log("Invalid type for field type", type)
             isValid = (str) => true;
         }
         let formatter = TagRenderingOptions.formatting[type] ?? ((str) => str);
diff --git a/Logic/FilteredLayer.ts b/Logic/FilteredLayer.ts
index 14fc849..c5c2372 100644
--- a/Logic/FilteredLayer.ts
+++ b/Logic/FilteredLayer.ts
@@ -27,7 +27,7 @@ export class FilteredLayer {
     private readonly _map: Basemap;
     private readonly _maxAllowedOverlap: number;
 
-    private readonly _style: (properties) => { color: string, icon: { iconUrl: string } };
+    private readonly _style: (properties) => { color: string, icon: { iconUrl: string, iconSize? : number[], popupAnchor?: number[], iconAnchor?:number[] } };
 
     private readonly _storage: ElementStorage;
 
@@ -214,10 +214,27 @@ export class FilteredLayer {
                     });
 
                 } else {
+                    if(style.icon.iconSize === undefined){
+                        style.icon.iconSize = [50,50]
+                    }if(style.icon.iconAnchor === undefined){
+                        style.icon.iconAnchor = [style.icon.iconSize[0] / 2,style.icon.iconSize[1]]
+                    }
+                    if (style.icon.popupAnchor === undefined) {
+                        style.icon.popupAnchor = [0, 8 - (style.icon.iconSize[1])]
+                    }
                     marker = L.marker(latLng, {
-                        icon: new L.icon(style.icon)
+                        icon: new L.icon(style.icon),
                     });
                 }
+                let eventSource = self._storage.addOrGetElement(feature);
+                const uiElement = self._showOnPopup(eventSource, feature);
+                const popup = L.popup().setContent(uiElement.Render());
+                uiElement.Update();
+                marker.bindPopup(popup);
+                marker.on("click", () => {
+                    console.log("Popup opened");
+                    uiElement.Activate();
+                }) // TODO FIX
                 return marker;
             },
 
@@ -227,22 +244,20 @@ export class FilteredLayer {
                     if (layer.setIcon) {
                         layer.setIcon(L.icon(self._style(feature.properties).icon))
                     } else {
-                        console.log("UPdating", layer);
-
                         self._geolayer.setStyle(function (feature) {
                             return self._style(feature.properties);
                         });
                     }
                 });
 
-
                 layer.on("click", function (e) {
-                    console.log("Selected ", feature)
                     self._selectedElement.setData({feature: feature});
+                    if (feature.geometry.type === "Point") {
+                        return; // Points bind there own popups
+                    }
+
                     const uiElement = self._showOnPopup(eventSource, feature);
-                    
-                    const iconInfo = self._style(feature.properties).icon;
-                    
+
                     const popup = L.popup({
                         autoPan: true,
                     })