Fix click on feature

projects/common-map/src/fm-map/components/feature-list-container/feature-list-container.component.ts

@@ -6,6 +6,7 @@ import  {IQueryState } from '@farmmaps/common';
 import * as mapReducers from '../../reducers/map.reducer';
 import * as mapActions from '../../actions/map.actions';
 import { Store } from '@ngrx/store';
+import { Observable } from 'rxjs';
 
 
 @Component({
@@ -21,6 +22,7 @@ export class FeatureListContainerComponent {
   @Input() features: Array<Feature>
   @Input() queryState: IQueryState;
   @Input() selectedFeature: Feature;
+  @Input() clickedFeature:Observable<Feature>;
 
   @ViewChild(WidgetHostDirective, { static: true }) widgetHost: WidgetHostDirective; 
   componentRef:any;
@@ -52,6 +54,12 @@ export class FeatureListContainerComponent {
     (<AbstractFeatureListComponent>this.componentRef.instance).selectedFeature = this.selectedFeature;
   }
 
+  ngOnInit() {
+    this.clickedFeature.subscribe((feature => {
+      (<AbstractFeatureListComponent>this.componentRef.instance).handleFeatureClick(feature);
+    }));
+  }
+
   ngOnChanges(changes: SimpleChanges) {
     if ((changes["features"] && changes["features"].currentValue)) {
       if (this.queryState) {

projects/common-map/src/fm-map/components/feature-list-croppingscheme/feature-list-croppingscheme.component.ts

@@ -2,12 +2,13 @@ import { Component, Injectable } from '@angular/core';
 import { Location } from '@angular/common';
 import { AbstractFeatureListComponent } from '../feature-list/feature-list.component';
 import { ForItemType } from '../for-item/for-itemtype.decorator';
-import { Store } from '@ngrx/store';
+import { Store,Action } from '@ngrx/store';
 import * as mapReducers from '../../reducers/map.reducer';
 import { commonReducers, ItemTypeService } from '@farmmaps/common';
 import * as mapActions from '../../actions/map.actions';
 import { tassign } from 'tassign';
 import { Router } from '@angular/router';
+import { Feature } from 'ol';
 
 @ForItemType("vnd.farmmaps.itemtype.croppingscheme")
 @Injectable()
@@ -22,8 +23,8 @@ export class FeatureListCroppingschemeComponent extends AbstractFeatureListCompo
         super(store, itemTypeService, location);
     }
 
-    handleFeatureClick(feature) {
+    getAction(feature:Feature):Action {
         var queryState = tassign(mapReducers.initialState.queryState, { parentCode: feature.get('code'), itemType: "vnd.farmmaps.itemtype.cropfield" });
-        this.store.dispatch(new mapActions.DoQuery(queryState));
+        return new mapActions.DoQuery(queryState);
     }
 }

projects/common-map/src/fm-map/components/feature-list/feature-list.component.ts

@@ -1,7 +1,7 @@
 import { Component, Input, Injectable,Directive,SimpleChanges } from '@angular/core';
 import { Location } from '@angular/common';
 import { Feature } from 'ol';
-import { Store } from '@ngrx/store';
+import { Store,Action} from '@ngrx/store';
 import * as mapReducers from '../../reducers/map.reducer';
 import { commonReducers,ItemTypeService, IItem, Item } from '@farmmaps/common';
 import * as mapActions from '../../actions/map.actions';
@@ -21,9 +21,16 @@ export abstract class AbstractFeatureListComponent {
   }
 
   handleFeatureClick(feature:Feature) {
-    var newQuery: any = tassign(mapReducers.initialState.query);
-    newQuery.itemCode = feature.get('code');
-    this.store.dispatch(new mapActions.DoQuery(newQuery));
+    if(feature) {
+      let action = this.getAction(feature);
+      this.store.dispatch(action);  
+    }
+  }
+
+  getAction(feature:Feature):Action {
+      var newQuery: any = tassign(mapReducers.initialState.query);
+      newQuery.itemCode = feature.get('code');
+      return new mapActions.DoQuery(newQuery)  
   }
 
   handleFeatureMouseEnter(feature) {

projects/common-map/src/fm-map/components/map/map.component.html

@@ -34,7 +34,7 @@
     <fm-map-item-layers [itemLayers]="state.overlayLayers"></fm-map-item-layers>
     <fm-map-item-layers [itemLayer]="state.selectedItemLayer"></fm-map-item-layers>
     <aol-layer-vector>
-      <fm-map-item-source-vector [styles]="state.styles" [features]="state.features" (onFeaturesSelected)="handleFeaturesSelected($event)" (onFeatureHover)="handleFeatureHover($event)" [selectedFeature]="state.selectedFeature" [selectedItem]="state.selectedItem"></fm-map-item-source-vector>
+      <fm-map-item-source-vector [styles]="state.styles" [features]="state.features" (onFeaturesSelected)="handleFeatureClick($event)" (onFeatureHover)="handleFeatureHover($event)" [selectedFeature]="state.selectedFeature" [selectedItem]="state.selectedItem"></fm-map-item-source-vector>
     </aol-layer-vector>
     <fm-map-gps-location [position]="state.position" [headingTolerance]="20" [showHeading]="true" [heading]="state.compassHeading"></fm-map-gps-location>
     <div class="control-container">
@@ -53,7 +53,7 @@
       <div class="panel-bottom">
   
         <div *ngIf="!(state.selectedItem)">
-          <fm-map-feature-list-container [features]="state.features" [selectedFeature]="state.selectedFeature" [queryState]="state.queryState"></fm-map-feature-list-container>
+          <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">

projects/common-map/src/fm-map/components/map/map.component.ts

@@ -63,6 +63,7 @@ export class MapComponent implements OnInit, OnDestroy,AfterViewInit {
   public panelVisible$: Observable<boolean> = this.store.select(mapReducers.selectGetPanelVisible);
   public panelCollapsed$: Observable<boolean> = this.store.select(mapReducers.selectGetPanelCollapsed);
   public selectedFeature$: Observable<Feature> = this.store.select(mapReducers.selectGetSelectedFeature);
+  public clickedFeature: Observable<Feature> = this.store.select(mapReducers.selectGetClickedFeature);
   public selectedItem$: Observable<IItem> = this.store.select(mapReducers.selectGetSelectedItem);
   public queryState$: Observable<IQueryState> = this.store.select(mapReducers.selectGetQueryState);
   public period$: Observable<IPeriodState> = this.store.select(mapReducers.selectGetPeriod);
@@ -113,11 +114,8 @@ export class MapComponent implements OnInit, OnDestroy,AfterViewInit {
     this.uploadService.addFiles(droppedFile.files, droppedFile.event, { parentCode:droppedFile.parentCode, geometry:droppedFile.geometry });
   }
 
-  handleFeaturesSelected(feature: Feature) {
-    if (feature) {
-      let newQuery = tassign(mapReducers.initialQueryState, { parentCode: feature.get('parentCode'), itemCode: feature.get('code'),itemType:feature.get('itemType') });
-      this.store.dispatch(new mapActions.DoQuery(newQuery));
-    }
+  handleFeatureClick(feature: Feature) {
+    this.store.dispatch(new mapActions.ClickFeature(feature));
   }
 
   handleFeatureHover(feature: Feature) {