FarmMaps/FarmMapsLib
8
0
Fork 0
Code Issues Pull Requests Releases Wiki Activity

Update app to match library changes
All checks were successful
FarmMaps.Develop/FarmMapsLib/develop This commit looks good
Details

Browse Source
This commit is contained in:
Willem Dantuma
2020-02-18 08:03:42 +01:00
parent aa09953b67
commit 6eb1b5af55
5 changed files with 21 additions and 89 deletions
Download Patch File Download Diff File Expand all files Collapse all files

18
src/app/menu/menu.component.html
View File

@@ -6,21 +6,5 @@
<div class="caption" i18n>Farms</div>
</div>
</div>
</div>
<div class="card menu-card">
<ul class="navbar-nav">
<li class="nav-item py-0">
<a class="nav-link" href="#" (click)="handleToggleBaseLayers($event)" i18n><i class="fa fa-map" aria-hidden="true"></i> Base maps <i class="fa" [ngClass]="{'fa-caret-down':baseLayersCollapsed,'fa-caret-up':!baseLayersCollapsed}" aria-hidden="true"></i></a>
<div [ngbCollapse]="baseLayersCollapsed" class="mb-4">
<fm-map-layer-list [baseLayers]="true" [itemLayers]="baseLayers|async" [selectedLayer]="selectedBaseLayer|async" (onSelectLayer)="handleSelectBaseLayer($event)"></fm-map-layer-list>
</div>
</li>
<li class="nav-item py-0">
<a class="nav-link" href="#" (click)="handleToggleOverlayLayers($event)" i18n><i class="fa fa-map" aria-hidden="true"></i> Overlays <i class="fa" [ngClass]="{'fa-caret-down':overlayLayersCollapsed,'fa-caret-up':!overlayLayersCollapsed}" aria-hidden="true"></i></a>
<div [ngbCollapse]="overlayLayersCollapsed" class="mb-4">
<fm-map-layer-list [itemLayers]="overlayLayers|async" [selectedLayer]="selectedOverlayLayer|async" (onDelete)="handleOnDelete($event)" (onToggleVisibility)="handleOnToggleVisibility($event)" (onSetOpacity)="handleOnSetOpacity($event)" (onZoomToExtent)="handleZoomToExtent($event)" (onSelectLayer)="handleSelectOverlayLayer($event)"></fm-map-layer-list>
</div>
</li>
</ul>
</div>
</div>
</div>

70
src/app/menu/menu.component.ts
View File

@@ -1,77 +1,21 @@
import { Component, OnInit } from '@angular/core';
import { commonReducers, } from '@farmmaps/common';
import { } from '@farmmaps/common-map';
import {mapReducers,mapActions,IItemLayer} from '@farmmaps/common-map';
import { Store } from '@ngrx/store';
import { Component } from '@angular/core';
import {Router} from '@angular/router';
import {mapReducers,StateSerializerService} from '@farmmaps/common-map';
import { tassign } from 'tassign';
import { Observable } from 'rxjs';
import {createEmpty,extend } from 'ol/extent';
@Component({
selector: 'app-menu',
templateUrl: './menu.component.html',
styleUrls: ['./menu.component.scss']
})
export class MenuComponent implements OnInit {
public baseLayersCollapsed:boolean = true;
public overlayLayersCollapsed: boolean = true;
public overlayLayers: Observable<Array<IItemLayer>>;
public selectedOverlayLayer: Observable<IItemLayer>;
public baseLayers: Observable<Array<IItemLayer>>;
public selectedBaseLayer: Observable<IItemLayer>;
export class MenuComponent {
constructor( private store: Store<mapReducers.State | commonReducers.State> ) { }
ngOnInit() {
this.overlayLayers = this.store.select(mapReducers.selectGetOverlayLayers);
this.selectedOverlayLayer = this.store.select(mapReducers.selectGetSelectedOverlayLayer);
this.baseLayers = this.store.select(mapReducers.selectGetBaseLayers);
this.selectedBaseLayer = this.store.select(mapReducers.selectGetSelectedBaseLayer);
}
handleToggleBaseLayers(event:MouseEvent) {
this.baseLayersCollapsed = !this.baseLayersCollapsed;
event.preventDefault();
}
handleToggleOverlayLayers(event: MouseEvent) {
this.overlayLayersCollapsed = !this.overlayLayersCollapsed;
event.preventDefault();
}
constructor( private stateSerializerService:StateSerializerService,private router:Router ) { }
handlePredefinedQuery(event: MouseEvent, query: any) {
event.preventDefault();
var queryState = tassign(mapReducers.initialQueryState, query);
this.store.dispatch(new mapActions.DoQuery(queryState));
var queryState = this.stateSerializerService.serialize(tassign(mapReducers.initialQueryState, query));
this.router.navigate(['map',queryState])
}
handleOnToggleVisibility(itemLayer: IItemLayer) {
this.store.dispatch(new mapActions.SetVisibility(itemLayer,!itemLayer.visible));
}
handleOnSetOpacity(event:{ layer: IItemLayer,opacity:number }) {
this.store.dispatch(new mapActions.SetOpacity(event.layer, event.opacity));
}
handleOnDelete(itemLayer: IItemLayer) {
this.store.dispatch(new mapActions.RemoveLayer(itemLayer));
}
handleZoomToExtent(itemLayer: IItemLayer) {
var extent = createEmpty();
extend(extent, itemLayer.layer.getExtent());
if (extent) {
this.store.dispatch(new mapActions.SetExtent(extent));
}
}
handleSelectOverlayLayer(itemLayer: IItemLayer) {
this.store.dispatch(new mapActions.SelectOverlayLayer(itemLayer));
}
handleSelectBaseLayer(itemLayer: IItemLayer) {
this.store.dispatch(new mapActions.SelectBaseLayer(itemLayer));
}
}