Renamed prefixes in angular.json

projects/common-map/src/fm-map/components/item-widget-list/item-widget-list.component.html

@@ -0,0 +1,7 @@
+<div *ngIf="widgets;let widgets" class="widget-container">
+  <div class="widget" *ngFor="let widget of widgets">
+    <div class="content">
+      <ng-template #widgetTemplate></ng-template>
+    </div>
+  </div>
+</div>

projects/common-map/src/fm-map/components/item-widget-list/item-widget-list.component.scss

@@ -0,0 +1,42 @@
+@import "../../_theme.scss";
+@import "~bootstrap/scss/bootstrap.scss";
+
+.widget-container {
+  overflow:auto;
+  margin-bottom:1rem;
+}
+
+.widget {
+  position:relative;
+  border: 1px solid gray('500');
+  user-select: none;
+  display:inline-block;
+  width:50%;
+  overflow:hidden;
+  float:left;
+}
+
+.widget:after {
+  content: "";
+  display: block;
+  padding-bottom: 100%;
+}
+
+.content {
+  position:absolute;
+  width:100%;
+  height:100%;
+}
+
+.widget:hover {
+  background-color: gray('100');
+}
+
+.widget-container {
+  padding:1rem;
+}
+
+.item-container {
+  display:block;
+  height:100%;
+}

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

@@ -0,0 +1,38 @@
+import { Component, Input, Injectable, Inject, Optional,ComponentFactoryResolver, ViewContainerRef, QueryList, ComponentFactory, ViewChildren,AfterViewInit } from '@angular/core';
+import { Location } from '@angular/common';
+import { Store } from '@ngrx/store';
+import * as mapReducers from '../../reducers/map.reducer';
+import { commonReducers,ItemTypeService, IItem, Item,IListItem } from '@farmmaps/common';
+import { AbstractItemWidgetComponent } from '../item-list-item/item-list-item.component';
+
+
+@Injectable()
+@Component({
+  selector: 'fm-map-item-widget-list',
+  templateUrl: './item-widget-list.component.html',
+  styleUrls: ['./item-widget-list.component.scss']
+})
+export class ItemWidgetListComponent implements AfterViewInit {
+
+  @Input() item: IListItem;
+  public widgets: AbstractItemWidgetComponent[];
+  @ViewChildren('widgetTemplate', { read: ViewContainerRef }) private widgetTargets: QueryList<ViewContainerRef>;
+
+  constructor(public store: Store<mapReducers.State | commonReducers.State>, public itemTypeService: ItemTypeService, public location: Location, private componentFactoryResolver: ComponentFactoryResolver, @Optional() @Inject(AbstractItemWidgetComponent) itemWidgetComponentList: AbstractItemWidgetComponent[]) {
+    this.widgets = itemWidgetComponentList; //todo filter this list on widgets available for user 
+  }
+
+  ngAfterViewInit() {
+    let targets = this.widgetTargets.toArray();
+    if(this.widgets) {
+      for (var i = 0; i < this.widgets.length; i++) {
+        var componentFactory: ComponentFactory<AbstractItemWidgetComponent> = this.componentFactoryResolver.resolveComponentFactory(this.widgets[i]['constructor'] as any);
+        const viewContainerRef = targets[i];
+        viewContainerRef.clear();
+  
+        const componentRef = viewContainerRef.createComponent(componentFactory);
+        (<AbstractItemWidgetComponent>componentRef.instance).item = this.item;
+      }  
+    }
+  }
+}