From dbc330ab46819dc50d679b86797f7e4600139a8b Mon Sep 17 00:00:00 2001
From: Willem Dantuma <willem.dantuma@dobs.nl>
Date: Fri, 29 Jan 2021 10:10:13 +0100
Subject: [PATCH] Move side panels to map context to get access to map

---
 .../fm-map/components/map/map.component.html  | 49 ++++++++++---------
 1 file changed, 25 insertions(+), 24 deletions(-)

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 4607522..f074a5c 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
@@ -47,33 +47,34 @@
       <fm-map-rotation-reset></fm-map-rotation-reset>
     </div>
     <fm-map-file-drop-target [parentCode]="state.parentCode" (onFileDropped)="handleFileDropped($event)"></fm-map-file-drop-target>
-  </aol-map>
-  <div *ngIf="noContent">
-    <fm-map-map-search #mapSearch [openedModalName]="state.openedModalName" (onOpenModal)="handleOpenModal($event)" (onCloseModal)="handleCloseModal()" [ngClass]="{'menuVisible':state.menuVisible}" (onToggleMenu)="handleToggleMenu($event)" (onSearchCollapse)="handleSearchCollapse($event)" (onSearchExpand)="handleSearchExpand($event)" [collapsed]="state.searchCollapsed" [searchMinified]="state.searchMinified" (onSearch)="handleSearch($event)" (onClear)="handleClearSearch($event)" [filterOptions]="state.queryState" [clearEnabled]="state.clearEnabled" [period]="state.period"></fm-map-map-search>
-  </div>
-  <fm-side-panel [resizeable]="true" [visible]="state.panelVisible && noContent" [collapsed]="state.panelCollapsed" [collapsable]="false">
-    <div class="panel-wrapper" *ngIf="noContent">
-      <div class="panel-top bg-secondary" *ngIf="!(state.searchMinified)">
-      </div>
-      <div class="panel-bottom">
 
-        <div *ngIf="!(state.selectedItem)">
-          <fm-map-feature-list-container [features]="state.features" [selectedFeature]="state.selectedFeature" [queryState]="state.queryState" [clickedFeature]="clickedFeature"></fm-map-feature-list-container>
+    <div *ngIf="noContent">
+      <fm-map-map-search #mapSearch [openedModalName]="state.openedModalName" (onOpenModal)="handleOpenModal($event)" (onCloseModal)="handleCloseModal()" [ngClass]="{'menuVisible':state.menuVisible}" (onToggleMenu)="handleToggleMenu($event)" (onSearchCollapse)="handleSearchCollapse($event)" (onSearchExpand)="handleSearchExpand($event)" [collapsed]="state.searchCollapsed" [searchMinified]="state.searchMinified" (onSearch)="handleSearch($event)" (onClear)="handleClearSearch($event)" [filterOptions]="state.queryState" [clearEnabled]="state.clearEnabled" [period]="state.period"></fm-map-map-search>
+    </div>
+    <fm-side-panel [resizeable]="true" [visible]="state.panelVisible && noContent" [collapsed]="state.panelCollapsed" [collapsable]="false">
+      <div class="panel-wrapper" *ngIf="noContent">
+        <div class="panel-top bg-secondary" *ngIf="!(state.searchMinified)">
         </div>
-
-        <div *ngIf="state.selectedItem;let item">
-          <fm-map-selected-item-container [item]="item" [parentItem]="state.parentItem" [itemLayer]="state.selectedItemLayer" [overlayLayers]="state.overlayLayers"></fm-map-selected-item-container>
+        <div class="panel-bottom">
+  
+          <div *ngIf="!(state.selectedItem)">
+            <fm-map-feature-list-container [features]="state.features" [selectedFeature]="state.selectedFeature" [queryState]="state.queryState" [clickedFeature]="clickedFeature"></fm-map-feature-list-container>
+          </div>
+  
+          <div *ngIf="state.selectedItem;let item">
+            <fm-map-selected-item-container [item]="item" [parentItem]="state.parentItem" [itemLayer]="state.selectedItemLayer" [overlayLayers]="state.overlayLayers"></fm-map-selected-item-container>
+          </div>
+          <div *ngIf="state.features.length == 0" class="no-results  m-2">
+            <div *ngIf="state.queryState.query">Cannot find <span>{{state.queryState?.query}}</span></div>
+            <div *ngIf="state.queryState?.tags">Cannot find tag <span>{{state.queryState?.tags}}</span></div>
+          </div>
         </div>
-        <div *ngIf="state.features.length == 0" class="no-results  m-2">
-          <div *ngIf="state.queryState.query">Cannot find <span>{{state.queryState?.query}}</span></div>
-          <div *ngIf="state.queryState?.tags">Cannot find tag <span>{{state.queryState?.tags}}</span></div>
-        </div>
-      </div>
-    </div>  
-  </fm-side-panel>
-  <fm-side-panel [resizeable]="true" [visible]="!noContent">
-    <router-outlet></router-outlet>
-  </fm-side-panel>
+      </div>  
+    </fm-side-panel>
+    <fm-side-panel [resizeable]="true" [visible]="!noContent">
+      <router-outlet></router-outlet>
+    </fm-side-panel>
+  </aol-map>  
 </ng-container>