Add common-map library

projects/common-map/src/lib/components/feature-list-container/feature-list-container.component.html

@@ -0,0 +1,3 @@
+<div class="feature-list-container">
+  <ng-template widget-host></ng-template>
+</div>

projects/common-map/src/lib/components/feature-list-container/feature-list-container.component.scss

@@ -0,0 +1,19 @@
+@import "../../_theme.scss";
+@import "~bootstrap/scss/bootstrap.scss";
+
+
+
+.row {
+  border-bottom: 1px solid gray('500');
+  user-select: none;
+}
+
+.row:hover {
+  background-color: gray('100');
+}
+
+@media screen and (min-width: 44rem)  {
+  .feature-list-container {
+    margin-top: 4rem;
+  }
+}

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

@@ -0,0 +1,59 @@
+import { Component, Input, OnInit, ComponentFactoryResolver, ViewChild, SimpleChanges, ComponentFactory, Inject, Type} from '@angular/core';
+import { Feature } from 'ol';
+import { FeatureListComponent,AbstractFeatureListComponent } from '../feature-list/feature-list.component';
+import { WidgetHostDirective } from '../widget-host/widget-host.directive';
+import  {IQueryState } from '../../models/query.state';
+import * as mapReducers from '../../reducers/map.reducer';
+import * as mapActions from '../../actions/map.actions';
+import { Store } from '@ngrx/store';
+
+
+@Component({
+  selector: 'feature-list-container',
+  templateUrl: './feature-list-container.component.html',
+  styleUrls: ['./feature-list-container.component.scss']
+})
+export class FeatureListContainerComponent {
+
+  constructor(private store: Store<mapReducers.State>,private componentFactoryResolver: ComponentFactoryResolver, @Inject(AbstractFeatureListComponent) public featureLists: AbstractFeatureListComponent[] ) {
+  }
+
+  @Input() features: Array<Feature>
+  @Input() queryState: IQueryState;
+
+  @ViewChild(WidgetHostDirective) widgetHost: WidgetHostDirective; 
+
+  loadComponent(queryState:IQueryState) {
+    var componentFactory: ComponentFactory<AbstractFeatureListComponent> = this.componentFactoryResolver.resolveComponentFactory(FeatureListComponent); // default
+    var selected = -1;
+    for (var i = 0; i < this.featureLists.length; i++) {
+      if (this.featureLists[i]['forItemType'] == queryState.itemType && this.featureLists[i]['forChild'] && queryState.parentCode && queryState.parentCode != "") {
+        selected = i;
+        break;
+      } else if (this.featureLists[i]['forItemType'] == queryState.itemType) {
+        selected = i;        
+        break;
+      }
+    }
+    if (selected >= 0) {
+      componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.featureLists[i]['constructor'] as any);
+      if (this.featureLists[selected]['collapseSearch'] === true) {
+        this.store.dispatch(new mapActions.CollapseSearch());
+      }
+    }
+    const viewContainerRef = this.widgetHost.viewContainerRef;
+    viewContainerRef.clear();
+
+    const componentRef = viewContainerRef.createComponent(componentFactory);
+    (<AbstractFeatureListComponent>componentRef.instance).features = this.features;
+    (<AbstractFeatureListComponent>componentRef.instance).queryState = this.queryState;
+  }
+
+  ngOnChanges(changes: SimpleChanges) {
+    if (changes["features"] && changes["features"].currentValue) {
+      if (this.queryState) {
+        this.loadComponent(this.queryState);
+      }
+    }
+  }
+}