From b30c29a5f1584a354f4ee4d38a9e3135c3ae1f77 Mon Sep 17 00:00:00 2001
From: Willem Dantuma <willem.dantuma@dobs.nl>
Date: Sat, 23 Jan 2021 18:30:29 +0100
Subject: [PATCH] Some fixes and optimizations

---
 .../aol/item-layers/item-layers.component.ts  | 32 +++++++++++++------
 .../fm-map/components/map/map.component.html  |  1 +
 2 files changed, 24 insertions(+), 9 deletions(-)

diff --git a/projects/common-map/src/fm-map/components/aol/item-layers/item-layers.component.ts b/projects/common-map/src/fm-map/components/aol/item-layers/item-layers.component.ts
index 292b359..0d49d9f 100644
--- a/projects/common-map/src/fm-map/components/aol/item-layers/item-layers.component.ts
+++ b/projects/common-map/src/fm-map/components/aol/item-layers/item-layers.component.ts
@@ -386,17 +386,31 @@ export class ItemLayersComponent extends LayerGroupComponent implements OnChange
   }
 
   mapEventHandler = (event) => {
-    //return;
-    //if(event.type === 'click' && !this.onFeatureSelected.observers.length) return;
-    //if(event.type === 'pointermode' && !this.onFeatureHover.observers.length) return;
+    // select only when having observers
+    if(event.type === 'click' && !this.onFeatureSelected.observers.length) return;
+    if(event.type === 'pointermove' && !this.onFeatureHover.observers.length) return;
     if(this.itemLayer && this.itemLayer.layer) {
        this.selectedFeatures = {};
-       this.itemLayer.layer.getFeatures(event.pixel).then((features) => {      
-         if(!features.length) return;
-        let fid = features[0].getId();
-        this.selectedFeatures[fid] = features[0];    
-       })
-       if(this.selectionLayer) this.selectionLayer.changed();
+       if(this.itemLayer.layer ) {
+        let minZoom = this.itemLayer.layer.getMinZoom();
+        let currentZoom = this.map.instance.getView().getZoom();
+        if(currentZoom>minZoom) {
+          this.itemLayer.layer.getFeatures(event.pixel).then((features) => {      
+            if(!features.length) {
+              this.onFeatureHover.emit(null);
+              return;
+            }
+           let fid = features[0].getId();
+           if(event.type === 'pointermove') {
+             this.selectedFeatures[fid] = features[0];
+             this.onFeatureHover.emit(features[0]);
+           } else {
+             this.onFeatureSelected.emit(features[0]);
+           }
+          })
+          if(this.selectionLayer) this.selectionLayer.changed(); 
+        }      
+       }
     }    
   }
 
diff --git a/projects/common-map/src/fm-map/components/map/map.component.html b/projects/common-map/src/fm-map/components/map/map.component.html
index f9895dc..4607522 100644
--- a/projects/common-map/src/fm-map/components/map/map.component.html
+++ b/projects/common-map/src/fm-map/components/map/map.component.html
@@ -38,6 +38,7 @@
     <aol-layer-vector>
       <fm-map-item-source-vector [styles]="state.styles" [features]="state.features" (onFeatureSelected)="handleFeatureClick($event)" (onFeatureHover)="handleFeatureHover($event)" [selectedFeature]="state.selectedFeature" [selectedItem]="state.selectedItem"></fm-map-item-source-vector>
     </aol-layer-vector>
+    <router-outlet name="map-layers"></router-outlet>
     <!-- <fm-map-gps-location [position]="state.position" [headingTolerance]="20" [showHeading]="true" [heading]="state.compassHeading"></fm-map-gps-location> -->
     <div class="control-container" >
       <router-outlet name="map-controls"></router-outlet>