Merge pull request #233 from swisstopo/feature/asset-225-polygon-sele…

…ctor-öffnet-detailauswahl Feature 225: Bug - Polygon Selector öffnet Detailauswahl
swisstopo · Jul 22, 2024 · 4dd0009 · 4dd0009
2 parents 75b61bb + 9026060
commit 4dd0009
Show file tree

Hide file tree

Showing 3 changed files with 24 additions and 9 deletions.
diff --git a/libs/asset-viewer/src/lib/components/map-controls/draw-controls.ts b/libs/asset-viewer/src/lib/components/map-controls/draw-controls.ts
@@ -5,11 +5,8 @@ import { Control } from 'ol/control';
 import Feature from 'ol/Feature';
 import { Polygon } from 'ol/geom';
 import Draw, { DrawEvent } from 'ol/interaction/Draw';
-import Map from 'ol/Map';
-import MapBrowserEvent from 'ol/MapBrowserEvent';
 import VectorSource from 'ol/source/Vector';
-import View from 'ol/View';
-import { BehaviorSubject, distinctUntilChanged, filter, fromEventPattern, map, Observable, Subscription } from 'rxjs';
+import { asapScheduler, BehaviorSubject, filter, fromEventPattern, map, Observable, Subscription } from 'rxjs';
 
 export class DrawControl extends Control {
   private readonly polygonSource: VectorSource;
@@ -76,7 +73,11 @@ export class DrawControl extends Control {
           return polygon;
         })
       )
-      .subscribe(this.setPolygon.bind(this));
+      .subscribe((polygon) =>
+        asapScheduler.schedule(() => {
+          this.setPolygon(polygon);
+        })
+      );
   }
 
   toggle(): void {

diff --git a/libs/asset-viewer/src/lib/components/map/map-controller.ts b/libs/asset-viewer/src/lib/components/map/map-controller.ts
@@ -45,6 +45,12 @@ export class MapController {
    */
   private activeAsset: AssetEditDetail | null = null;
 
+  /**
+   * Whether clicking things on the map is currently allowed.
+   * @private
+   */
+  private isClickEnabled = true;
+
   private readonly _isInitialized$ = new BehaviorSubject(false);
 
   constructor(element: HTMLElement) {
@@ -99,6 +105,10 @@ export class MapController {
     return this._isInitialized$.asObservable();
   }
 
+  setClickEnabled(isEnabled: boolean): void {
+    this.isClickEnabled = isEnabled;
+  }
+
   addControl(control: Control): void {
     this.map.addControl(control);
   }
@@ -302,6 +312,8 @@ export class MapController {
       (h) => this.map.on('click', h),
       (h) => this.map.un('click', h)
     ).pipe(
+      filter(() => this.isClickEnabled),
+
       // Check if the click has hit a study point, and use only that point if so.
       switchMap(async (event) => {
         let assetId: number | null = null;

diff --git a/libs/asset-viewer/src/lib/components/map/map.component.ts b/libs/asset-viewer/src/lib/components/map/map.component.ts
@@ -15,7 +15,7 @@ import {
 import { AppState } from '@asset-sg/client-shared';
 import { ORD } from '@asset-sg/core';
 import { Store } from '@ngrx/store';
-import { asapScheduler, filter, first, identity, skip, Subscription, switchMap } from 'rxjs';
+import { asapScheduler, first, identity, skip, Subscription, switchMap } from 'rxjs';
 import { AllStudyService } from '../../services/all-study.service';
 import * as searchActions from '../../state/asset-search/asset-search.actions';
 import {
@@ -127,9 +127,11 @@ export class MapComponent implements AfterViewInit, OnChanges, OnDestroy {
     this.controller.addControl(this.controls.zoom);
     this.controller.addControl(this.controls.draw);
 
-    this.subscription.add(
-      this.controller.assetsClick$.pipe(filter(() => !this.controls.draw.isDrawing)).subscribe(this.assetsClick)
-    );
+    this.controls.draw.isDrawing$.subscribe((isDrawing) => {
+      this.controller.setClickEnabled(!isDrawing);
+    });
+
+    this.subscription.add(this.controller.assetsClick$.subscribe(this.assetsClick));
     this.subscription.add(this.controller.assetsHover$.subscribe(this.assetsHover));
 
     // Some bindings can be initialized only after the map has fully loaded,