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

Update to angular 8.2

Browse Source
This commit is contained in:
Willem Dantuma 2019-11-25 14:34:51 +01:00
parent 16db063339
commit 7bd5dada2b
22 changed files with 5929 additions and 4352 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

20
src/browserslist → browserslist
View File

@ -1,11 +1,11 @@
# This file is currently used by autoprefixer to adjust CSS to support the below specified browsers # This file is currently used by autoprefixer to adjust CSS to support the below specified browsers
# For additional information regarding the format and rule options, please see: # For additional information regarding the format and rule options, please see:
# https://github.com/browserslist/browserslist#queries # https://github.com/browserslist/browserslist#queries
# #
# For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed # For IE 9-11 support, please remove 'not' from the last line of the file and adjust as needed
> 0.5% > 0.5%
last 2 versions last 2 versions
Firefox ESR Firefox ESR
not dead not dead
not IE 9-11 not IE 9-11

6300
package-lock.json generated
View File

File diff suppressed because it is too large Load Diff

126
package.json
View File

@ -1,63 +1,63 @@
{ {
"name": "farmmaps-lib-app", "name": "farmmaps-lib-app",
"version": "0.0.1", "version": "0.0.1",
"scripts": { "scripts": {
"ng": "ng", "ng": "ng",
"start": "ng serve", "start": "ng serve",
"build": "ng build", "build": "ng build",
"test": "ng test", "test": "ng test",
"lint": "ng lint", "lint": "ng lint",
"e2e": "ng e2e" "e2e": "ng e2e"
}, },
"private": true, "private": true,
"dependencies": { "dependencies": {
"@angular/animations": "~7.2.0", "@angular/animations": "~8.2.14",
"@angular/common": "~7.2.0", "@angular/common": "~8.2.14",
"@angular/compiler": "~7.2.0", "@angular/compiler": "~8.2.14",
"@angular/core": "~7.2.0", "@angular/core": "~8.2.14",
"@angular/forms": "~7.2.0", "@angular/forms": "~8.2.14",
"@angular/platform-browser": "~7.2.0", "@angular/platform-browser": "~8.2.14",
"@angular/platform-browser-dynamic": "~7.2.0", "@angular/platform-browser-dynamic": "~8.2.14",
"@angular/router": "~7.2.0", "@angular/router": "~8.2.14",
"@aspnet/signalr": "^1.1.4", "@aspnet/signalr": "^1.1.4",
"@farmmaps/common": ">=0.0.1-prerelease.77 <0.0.1", "@farmmaps/common": ">=0.0.1-prerelease.77 <0.0.1",
"@farmmaps/common-map": ">=0.0.1-prerelease.77 <0.0.1", "@farmmaps/common-map": ">=0.0.1-prerelease.77 <0.0.1",
"@ng-bootstrap/ng-bootstrap": "^4.2.1", "@ng-bootstrap/ng-bootstrap": "^4.2.1",
"@ngrx/effects": "^7.2.0", "@ngrx/effects": "^7.2.0",
"@ngrx/router-store": "^7.2.0", "@ngrx/router-store": "^7.2.0",
"@ngrx/store": "^7.2.0", "@ngrx/store": "^7.2.0",
"bootstrap": "^4.3.1", "bootstrap": "^4.3.1",
"font-awesome": "^4.7.0", "font-awesome": "^4.7.0",
"core-js": "^2.5.4", "core-js": "^2.5.4",
"ngrx-store-localstorage": "^8.0.0", "ngrx-store-localstorage": "^8.0.0",
"resumablejs": "^1.1.0", "resumablejs": "^1.1.0",
"rxjs": "~6.3.3", "rxjs": "~6.5.3",
"tassign": "^1.0.0", "tassign": "^1.0.0",
"zone.js": "~0.8.26" "zone.js": "~0.9.1"
}, },
"devDependencies": { "devDependencies": {
"@angular-devkit/build-angular": "~0.13.0", "@angular-devkit/build-angular": "~0.803.19",
"@angular-devkit/build-ng-packagr": "~0.13.0", "@angular-devkit/build-ng-packagr": "~0.803.19",
"@angular/cli": "~7.3.8", "@angular/cli": "~8.3.19",
"@angular/compiler-cli": "~7.2.0", "@angular/compiler-cli": "~8.2.14",
"@angular/language-service": "~7.2.0", "@angular/language-service": "~8.2.14",
"@types/node": "~8.9.4", "@types/node": "~8.9.4",
"@types/jasmine": "~2.8.8", "@types/jasmine": "~2.8.8",
"@types/jasminewd2": "~2.0.3", "@types/jasminewd2": "~2.0.3",
"codelyzer": "~4.5.0", "codelyzer": "^5.0.1",
"jasmine-core": "~2.99.1", "jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1", "jasmine-spec-reporter": "~4.2.1",
"karma": "~4.0.0", "karma": "~4.0.0",
"karma-chrome-launcher": "~2.2.0", "karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~2.0.1", "karma-coverage-istanbul-reporter": "~2.0.1",
"karma-jasmine": "~1.1.2", "karma-jasmine": "~1.1.2",
"karma-jasmine-html-reporter": "^0.2.2", "karma-jasmine-html-reporter": "^0.2.2",
"ng-packagr": "^4.2.0", "ng-packagr": "^5.4.0",
"protractor": "~5.4.0", "protractor": "~5.4.0",
"ts-node": "~7.0.0", "ts-node": "~7.0.0",
"tsickle": ">=0.34.0", "tsickle": "^0.37.0",
"tslib": "^1.9.0", "tslib": "^1.9.0",
"tslint": "~5.11.0", "tslint": "~5.11.0",
"typescript": "~3.2.2" "typescript": "~3.5.3"
} }
} }

136
projects/common-map/src/fm-map/components/aol/gps-location/gps-location.component.ts
View File

@ -1,68 +1,68 @@
import { Component, OnInit, Input, ViewChild, ElementRef, OnChanges, SimpleChanges } from '@angular/core'; import { Component, OnInit, Input, ViewChild, ElementRef, OnChanges, SimpleChanges } from '@angular/core';
import { MapComponent } from 'ngx-openlayers'; import { MapComponent } from 'ngx-openlayers';
import Overlay from 'ol/Overlay'; import Overlay from 'ol/Overlay';
import { fromLonLat, toLonLat } from 'ol/proj'; import { fromLonLat, toLonLat } from 'ol/proj';
@Component({ @Component({
selector: 'fm-map-gps-location', selector: 'fm-map-gps-location',
templateUrl: './gps-location.component.html', templateUrl: './gps-location.component.html',
styleUrls: ['./gps-location.component.scss'] styleUrls: ['./gps-location.component.scss']
}) })
export class GpsLocation implements OnInit,OnChanges{ export class GpsLocation implements OnInit,OnChanges{
@Input() enable:boolean; @Input() enable:boolean;
public instance: Overlay; public instance: Overlay;
@Input() position: Position; @Input() position: Position;
@Input() location: number[]=[0,0]; @Input() location: number[]=[0,0];
@Input() locationTolerance: number = 0; @Input() locationTolerance: number = 0;
@Input() showHeading: boolean = false; @Input() showHeading: boolean = false;
@Input() heading: number = 0; @Input() heading: number = 0;
@Input() headingTolerance: number = 0; @Input() headingTolerance: number = 0;
public locTolerancePixels: number = 0; public locTolerancePixels: number = 0;
public path: string = ""; public path: string = "";
public rotate: string = ""; public rotate: string = "";
private resolution: number = 0; private resolution: number = 0;
@ViewChild('location') locationElement: ElementRef; @ViewChild('location', { static: true }) locationElement: ElementRef;
constructor(private map: MapComponent) { constructor(private map: MapComponent) {
} }
recalcLocationTolerance() { recalcLocationTolerance() {
this.locTolerancePixels = this.resolution >0? this.locationTolerance / this.resolution:0; this.locTolerancePixels = this.resolution >0? this.locationTolerance / this.resolution:0;
} }
ngOnInit() { ngOnInit() {
this.instance = new Overlay({ this.instance = new Overlay({
stopEvent:false, stopEvent:false,
positioning: 'center-center', positioning: 'center-center',
position: fromLonLat( this.location), position: fromLonLat( this.location),
element: this.locationElement.nativeElement element: this.locationElement.nativeElement
}); });
var x = Math.tan(this.headingTolerance * Math.PI / 180)*40; var x = Math.tan(this.headingTolerance * Math.PI / 180)*40;
var y = Math.cos(this.headingTolerance * Math.PI / 180) * 40; var y = Math.cos(this.headingTolerance * Math.PI / 180) * 40;
var y1 = Math.round(500 - y); var y1 = Math.round(500 - y);
var x1 = Math.round(500 - x); var x1 = Math.round(500 - x);
var y2 = Math.round(y1); var y2 = Math.round(y1);
var x2 = Math.round(500 + x); var x2 = Math.round(500 + x);
this.path = "M " + x2 + " " + y2 + " A 45 45,0,0,0, " + x1 + " " + y1 + " L 493 500 L 507 500 Z"; this.path = "M " + x2 + " " + y2 + " A 45 45,0,0,0, " + x1 + " " + y1 + " L 493 500 L 507 500 Z";
this.rotate = "rotate(" + Math.round(this.heading) + " 500 500)"; this.rotate = "rotate(" + Math.round(this.heading) + " 500 500)";
this.locTolerancePixels = this.locationTolerance; this.locTolerancePixels = this.locationTolerance;
this.map.instance.addOverlay(this.instance); this.map.instance.addOverlay(this.instance);
this.map.instance.getView().on('change:resolution', (evt) => { this.map.instance.getView().on('change:resolution', (evt) => {
this.resolution = evt.target.get('resolution'); this.resolution = evt.target.get('resolution');
this.recalcLocationTolerance(); this.recalcLocationTolerance();
}); });
} }
ngOnChanges(changes: SimpleChanges) { ngOnChanges(changes: SimpleChanges) {
if (changes.position && this.instance) { if (changes.position && this.instance) {
var p = changes.position.currentValue as Position; var p = changes.position.currentValue as Position;
this.instance.setPosition(fromLonLat([p.coords.longitude, p.coords.latitude])); this.instance.setPosition(fromLonLat([p.coords.longitude, p.coords.latitude]));
this.locationTolerance = p.coords.accuracy; this.locationTolerance = p.coords.accuracy;
this.recalcLocationTolerance(); this.recalcLocationTolerance();
this.heading = p.coords.heading; this.heading = p.coords.heading;
} }
} }
} }

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

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

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

@ -1,43 +1,43 @@
import { Component, Input, OnInit, ComponentFactoryResolver, ViewChild, SimpleChanges, ComponentFactory, Inject, Type} from '@angular/core'; import { Component, Input, OnInit, ComponentFactoryResolver, ViewChild, SimpleChanges, ComponentFactory, Inject, Type} from '@angular/core';
import { Feature } from 'ol'; import { Feature } from 'ol';
import { AbstractFeatureListFeatureComponent,FeatureListFeatureComponent } from '../feature-list-feature/feature-list-feature.component'; import { AbstractFeatureListFeatureComponent,FeatureListFeatureComponent } from '../feature-list-feature/feature-list-feature.component';
import { WidgetHostDirective } from '../widget-host/widget-host.directive'; import { WidgetHostDirective } from '../widget-host/widget-host.directive';
@Component({ @Component({
selector: 'fm-map-feature-list-feature-container', selector: 'fm-map-feature-list-feature-container',
template: ` template: `
<div> <div>
<ng-template fm-map-widget-host></ng-template> <ng-template fm-map-widget-host></ng-template>
</div> </div>
` `
}) })
export class FeatureListFeatureContainerComponent { export class FeatureListFeatureContainerComponent {
constructor(private componentFactoryResolver: ComponentFactoryResolver, @Inject(AbstractFeatureListFeatureComponent) public featureLists: AbstractFeatureListFeatureComponent[] ) { constructor(private componentFactoryResolver: ComponentFactoryResolver, @Inject(AbstractFeatureListFeatureComponent) public featureLists: AbstractFeatureListFeatureComponent[] ) {
} }
@Input() feature: Feature; @Input() feature: Feature;
@ViewChild(WidgetHostDirective) widgetHost: WidgetHostDirective; @ViewChild(WidgetHostDirective, { static: true }) widgetHost: WidgetHostDirective;
loadComponent() { loadComponent() {
var componentFactory: ComponentFactory<AbstractFeatureListFeatureComponent> = this.componentFactoryResolver.resolveComponentFactory(FeatureListFeatureComponent); // default var componentFactory: ComponentFactory<AbstractFeatureListFeatureComponent> = this.componentFactoryResolver.resolveComponentFactory(FeatureListFeatureComponent); // default
for (var i = 0; i < this.featureLists.length; i++) { for (var i = 0; i < this.featureLists.length; i++) {
if (this.featureLists[i]['forItemType'] == this.feature.get("itemType")) { if (this.featureLists[i]['forItemType'] == this.feature.get("itemType")) {
componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.featureLists[i]['constructor'] as any); componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.featureLists[i]['constructor'] as any);
} }
} }
const viewContainerRef = this.widgetHost.viewContainerRef; const viewContainerRef = this.widgetHost.viewContainerRef;
viewContainerRef.clear(); viewContainerRef.clear();
const componentRef = viewContainerRef.createComponent(componentFactory); const componentRef = viewContainerRef.createComponent(componentFactory);
(<AbstractFeatureListFeatureComponent>componentRef.instance).feature = this.feature; (<AbstractFeatureListFeatureComponent>componentRef.instance).feature = this.feature;
} }
ngOnChanges(changes: SimpleChanges) { ngOnChanges(changes: SimpleChanges) {
if (changes["feature"] && changes["feature"].currentValue) { if (changes["feature"] && changes["feature"].currentValue) {
this.loadComponent(); this.loadComponent();
} }
} }
} }

94
projects/common-map/src/fm-map/components/item-list-item-container/item-list-item-container.component.ts
View File

@ -1,47 +1,47 @@
import { Component, Input, OnInit, ComponentFactoryResolver, ViewChild, SimpleChanges, ComponentFactory, Inject, Type} from '@angular/core'; import { Component, Input, OnInit, ComponentFactoryResolver, ViewChild, SimpleChanges, ComponentFactory, Inject, Type} from '@angular/core';
import { AbstractItemListItemComponent,ItemListItemComponent } from '../item-list-item/item-list-item.component'; import { AbstractItemListItemComponent,ItemListItemComponent } from '../item-list-item/item-list-item.component';
import { WidgetHostDirective } from '../widget-host/widget-host.directive'; import { WidgetHostDirective } from '../widget-host/widget-host.directive';
import { IItem, IListItem } from '@farmmaps/common'; import { IItem, IListItem } from '@farmmaps/common';
@Component({ @Component({
selector: 'fm-map-item-list-item-container', selector: 'fm-map-item-list-item-container',
template: ` template: `
<div style="height:100%"> <div style="height:100%">
<ng-template fm-map-widget-host></ng-template> <ng-template fm-map-widget-host></ng-template>
</div> </div>
` `
}) })
export class ItemListItemContainerComponent { export class ItemListItemContainerComponent {
constructor(private componentFactoryResolver: ComponentFactoryResolver, @Inject(AbstractItemListItemComponent) public itemComponentList: AbstractItemListItemComponent[] ) { constructor(private componentFactoryResolver: ComponentFactoryResolver, @Inject(AbstractItemListItemComponent) public itemComponentList: AbstractItemListItemComponent[] ) {
} }
@Input() item: IListItem; @Input() item: IListItem;
@ViewChild(WidgetHostDirective) widgetHost: WidgetHostDirective; @ViewChild(WidgetHostDirective, { static: true }) widgetHost: WidgetHostDirective;
loadComponent() { loadComponent() {
var componentFactory: ComponentFactory<AbstractItemListItemComponent> = this.componentFactoryResolver.resolveComponentFactory(ItemListItemComponent); // default var componentFactory: ComponentFactory<AbstractItemListItemComponent> = this.componentFactoryResolver.resolveComponentFactory(ItemListItemComponent); // default
for (var i = 0; i < this.itemComponentList.length; i++) { for (var i = 0; i < this.itemComponentList.length; i++) {
if (this.itemComponentList[i]['forItemType'] && if (this.itemComponentList[i]['forItemType'] &&
this.itemComponentList[i]['forItemType'].indexOf(this.item.itemType) >= 0 && this.itemComponentList[i]['forItemType'].indexOf(this.item.itemType) >= 0 &&
this.itemComponentList[i]['forSourceTask'] && this.itemComponentList[i]['forSourceTask'] &&
this.itemComponentList[i]['forSourceTask'].indexOf(this.item.sourceTask) >= 0 ) this.itemComponentList[i]['forSourceTask'].indexOf(this.item.sourceTask) >= 0 )
{ {
componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.itemComponentList[i]['constructor'] as any); componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.itemComponentList[i]['constructor'] as any);
} }
} }
const viewContainerRef = this.widgetHost.viewContainerRef; const viewContainerRef = this.widgetHost.viewContainerRef;
viewContainerRef.clear(); viewContainerRef.clear();
const componentRef = viewContainerRef.createComponent(componentFactory); const componentRef = viewContainerRef.createComponent(componentFactory);
(<AbstractItemListItemComponent>componentRef.instance).item = this.item; (<AbstractItemListItemComponent>componentRef.instance).item = this.item;
} }
ngOnChanges(changes: SimpleChanges) { ngOnChanges(changes: SimpleChanges) {
if (changes["item"] && changes["item"].currentValue) { if (changes["item"] && changes["item"].currentValue) {
this.loadComponent(); this.loadComponent();
} }
} }
} }

358
projects/common-map/src/fm-map/components/map-search/map-search.component.ts
View File

@ -1,179 +1,179 @@
import { Component, Input, Output, OnInit, EventEmitter, SimpleChanges, OnChanges, ViewChild } from '@angular/core'; import { Component, Input, Output, OnInit, EventEmitter, SimpleChanges, OnChanges, ViewChild } from '@angular/core';
import { Observable , of } from 'rxjs'; import { Observable , of } from 'rxjs';
import { debounceTime,distinctUntilChanged,tap,switchMap,merge,catchError} from 'rxjs/operators'; import { debounceTime,distinctUntilChanged,tap,switchMap,merge,catchError} from 'rxjs/operators';
import { TypeaheadService, TimespanService } from '@farmmaps/common'; import { TypeaheadService, TimespanService } from '@farmmaps/common';
import { IQueryState } from '../../models/query.state'; import { IQueryState } from '../../models/query.state';
import { IPeriodState } from '../../models/period.state'; import { IPeriodState } from '../../models/period.state';
import { fillProperties } from '@angular/core/src/util/property'; import { fillProperties } from '@angular/core/src/util/property';
import { tassign } from 'tassign'; import { tassign } from 'tassign';
@Component({ @Component({
selector: 'fm-map-map-search', selector: 'fm-map-map-search',
templateUrl: './map-search.component.html', templateUrl: './map-search.component.html',
styleUrls: ['./map-search.component.scss'] styleUrls: ['./map-search.component.scss']
}) })
export class MapSearchComponent { export class MapSearchComponent {
@ViewChild('searchText') searchText; @ViewChild('searchText', { static: true }) searchText;
@Input() clearEnabled: boolean @Input() clearEnabled: boolean
@Input() set collapsed(collapsed: boolean) { @Input() set collapsed(collapsed: boolean) {
this.collapsedLocal = collapsed; this.collapsedLocal = collapsed;
if (collapsed) this.searchText.nativeElement.blur(); if (collapsed) this.searchText.nativeElement.blur();
} }
@Input() set searchMinified(minified: boolean) { @Input() set searchMinified(minified: boolean) {
this.searchMinifiedLocal = minified; this.searchMinifiedLocal = minified;
} }
@Input() period: IPeriodState @Input() period: IPeriodState
@Output() onSearch = new EventEmitter<IQueryState>(); @Output() onSearch = new EventEmitter<IQueryState>();
@Output() onClear = new EventEmitter<any>(); @Output() onClear = new EventEmitter<any>();
@Output() onSearchCollapse = new EventEmitter<any>(); @Output() onSearchCollapse = new EventEmitter<any>();
@Output() onSearchExpand = new EventEmitter<any>(); @Output() onSearchExpand = new EventEmitter<any>();
@Output() onToggleMenu = new EventEmitter<any>(); @Output() onToggleMenu = new EventEmitter<any>();
@Output() onOpenModal = new EventEmitter<string>(); @Output() onOpenModal = new EventEmitter<string>();
@Output() onCloseModal = new EventEmitter<any>(); @Output() onCloseModal = new EventEmitter<any>();
@Input() openedModalName: string; @Input() openedModalName: string;
@Input() set filterOptions(filterOptions: IQueryState) { @Input() set filterOptions(filterOptions: IQueryState) {
if (filterOptions && filterOptions.query && filterOptions.query.length > 0) { if (filterOptions && filterOptions.query && filterOptions.query.length > 0) {
this.disabled = false; this.disabled = false;
} else { } else {
this.disabled = true; this.disabled = true;
} }
this.filterOptionsLocal = tassign(this.filterOptionsLocal, { tags: filterOptions.tags, query: filterOptions.query,bbox:filterOptions.bbox }); this.filterOptionsLocal = tassign(this.filterOptionsLocal, { tags: filterOptions.tags, query: filterOptions.query,bbox:filterOptions.bbox });
if (filterOptions.tags) { if (filterOptions.tags) {
this.searchTextLocal = { name: filterOptions.tags }; this.searchTextLocal = { name: filterOptions.tags };
} else { } else {
this.searchTextLocal = { name: filterOptions.query }; this.searchTextLocal = { name: filterOptions.query };
} }
if (this.dateFilter) { if (this.dateFilter) {
this.filterOptionsLocal.startDate = this.startDate; this.filterOptionsLocal.startDate = this.startDate;
this.filterOptionsLocal.endDate = this.endDate; this.filterOptionsLocal.endDate = this.endDate;
} }
} }
public collapsedLocal: boolean = true; public collapsedLocal: boolean = true;
public searchMinifiedLocal: boolean = false; public searchMinifiedLocal: boolean = false;
public filterOptionsLocal: IQueryState; public filterOptionsLocal: IQueryState;
private extent: number[]; private extent: number[];
public searchTextLocal: any; public searchTextLocal: any;
public searchTextLocalOutput: string; public searchTextLocalOutput: string;
public dateFilter: boolean = true; public dateFilter: boolean = true;
public startDate: Date = new Date(new Date(Date.now()).getFullYear(), new Date(Date.now()).getMonth() - 3, 1); public startDate: Date = new Date(new Date(Date.now()).getFullYear(), new Date(Date.now()).getMonth() - 3, 1);
public endDate: Date = new Date(Date.now()); public endDate: Date = new Date(Date.now());
public startEndCaption: string = this.timespanService.getCaption(this.startDate, this.endDate, 4); public startEndCaption: string = this.timespanService.getCaption(this.startDate, this.endDate, 4);
searching = false; searching = false;
searchFailed = false; searchFailed = false;
hideSearchingWhenUnsubscribed = new Observable(() => () => this.searching = false); hideSearchingWhenUnsubscribed = new Observable(() => () => this.searching = false);
public disabled: boolean = true; public disabled: boolean = true;
constructor(private typeaheadService: TypeaheadService, private timespanService: TimespanService) { constructor(private typeaheadService: TypeaheadService, private timespanService: TimespanService) {
this.filterOptionsLocal = { query: "", tags: "", startDate: null, endDate: null, bboxFilter: true, itemType: null, itemCode:null,level:0,parentCode:null,bbox:[] }; this.filterOptionsLocal = { query: "", tags: "", startDate: null, endDate: null, bboxFilter: true, itemType: null, itemCode:null,level:0,parentCode:null,bbox:[] };
} }
search = (text$: Observable<string>) => search = (text$: Observable<string>) =>
text$.pipe( text$.pipe(
debounceTime(300), debounceTime(300),
distinctUntilChanged(), distinctUntilChanged(),
tap(() => this.searching = true), tap(() => this.searching = true),
switchMap(term => term.length < 1 ? of([]) : switchMap(term => term.length < 1 ? of([]) :
this.typeaheadService.getSearchTypeaheadItems(term).pipe( this.typeaheadService.getSearchTypeaheadItems(term).pipe(
tap(() => this.searchFailed = false), tap(() => this.searchFailed = false),
catchError(() => { catchError(() => {
this.searchFailed = true; this.searchFailed = true;
return of([]); return of([]);
})) ), })) ),
tap(() => this.searching = false), tap(() => this.searching = false),
merge(this.hideSearchingWhenUnsubscribed)); merge(this.hideSearchingWhenUnsubscribed));
formatter = (x: { name: string }) => x.name; formatter = (x: { name: string }) => x.name;
handleSearch(event) { handleSearch(event) {
this.filterOptionsLocal.tags = null; this.filterOptionsLocal.tags = null;
this.filterOptionsLocal.itemType = null; this.filterOptionsLocal.itemType = null;
this.filterOptionsLocal.itemCode = null; this.filterOptionsLocal.itemCode = null;
this.filterOptionsLocal.parentCode = null; this.filterOptionsLocal.parentCode = null;
this.filterOptionsLocal.query = this.searchTextLocalOutput; this.filterOptionsLocal.query = this.searchTextLocalOutput;
if (this.dateFilter) { if (this.dateFilter) {
this.filterOptionsLocal.startDate = this.startDate; this.filterOptionsLocal.startDate = this.startDate;
this.filterOptionsLocal.endDate = this.endDate; this.filterOptionsLocal.endDate = this.endDate;
} }
this.onSearch.emit(this.filterOptionsLocal); this.onSearch.emit(this.filterOptionsLocal);
} }
handleOpenSelectPeriodModal(event: MouseEvent) { handleOpenSelectPeriodModal(event: MouseEvent) {
event.preventDefault(); event.preventDefault();
this.onOpenModal.emit('selectPeriodModal'); this.onOpenModal.emit('selectPeriodModal');
} }
handleCloseModal() { handleCloseModal() {
this.onCloseModal.emit({}); this.onCloseModal.emit({});
} }
handleSelect(event) { handleSelect(event) {
event.preventDefault(); event.preventDefault();
this.filterOptionsLocal.query = null; this.filterOptionsLocal.query = null;
this.filterOptionsLocal.itemType = null; this.filterOptionsLocal.itemType = null;
this.filterOptionsLocal.itemCode = null; this.filterOptionsLocal.itemCode = null;
this.filterOptionsLocal.parentCode = null; this.filterOptionsLocal.parentCode = null;
this.filterOptionsLocal.tags = event.item.name; this.filterOptionsLocal.tags = event.item.name;
if (this.dateFilter) { if (this.dateFilter) {
this.filterOptionsLocal.startDate = this.startDate; this.filterOptionsLocal.startDate = this.startDate;
this.filterOptionsLocal.endDate = this.endDate; this.filterOptionsLocal.endDate = this.endDate;
} }
this.onSearch.emit(this.filterOptionsLocal); this.onSearch.emit(this.filterOptionsLocal);
this.searchTextLocal = { name: this.filterOptionsLocal.tags }; this.searchTextLocal = { name: this.filterOptionsLocal.tags };
} }
handleSelectPeriod(event: { startDate: Date, endDate: Date }) { handleSelectPeriod(event: { startDate: Date, endDate: Date }) {
this.startDate = event.startDate; this.startDate = event.startDate;
this.endDate = event.endDate; this.endDate = event.endDate;
this.handleCloseModal(); this.handleCloseModal();
this.startEndCaption = this.timespanService.getCaption(event.startDate, event.endDate, 4); this.startEndCaption = this.timespanService.getCaption(event.startDate, event.endDate, 4);
this.onSearch.emit(this.filterOptionsLocal); this.onSearch.emit(this.filterOptionsLocal);
} }
handleChangeEnableDateFilter(enabled) { handleChangeEnableDateFilter(enabled) {
this.dateFilter = enabled; this.dateFilter = enabled;
if (enabled) { if (enabled) {
this.filterOptionsLocal.startDate = this.startDate; this.filterOptionsLocal.startDate = this.startDate;
this.filterOptionsLocal.endDate = this.endDate; this.filterOptionsLocal.endDate = this.endDate;
} else { } else {
this.filterOptionsLocal.startDate = null; this.filterOptionsLocal.startDate = null;
this.filterOptionsLocal.endDate = null; this.filterOptionsLocal.endDate = null;
} }
if(this.filterOptionsLocal.query || this.filterOptionsLocal.tags) if(this.filterOptionsLocal.query || this.filterOptionsLocal.tags)
this.onSearch.emit(this.filterOptionsLocal); this.onSearch.emit(this.filterOptionsLocal);
} }
handleChangeEnableBBOXFilter(enabled) { handleChangeEnableBBOXFilter(enabled) {
this.filterOptionsLocal.bboxFilter = enabled; this.filterOptionsLocal.bboxFilter = enabled;
if (this.filterOptionsLocal.query || this.filterOptionsLocal.tags) if (this.filterOptionsLocal.query || this.filterOptionsLocal.tags)
this.onSearch.emit(this.filterOptionsLocal); this.onSearch.emit(this.filterOptionsLocal);
} }
handleToggleMenu(event) { handleToggleMenu(event) {
this.onToggleMenu.emit({}); this.onToggleMenu.emit({});
} }
handleFocus(event) { handleFocus(event) {
this.onSearchExpand.emit({}); this.onSearchExpand.emit({});
} }
handleChange(event: string) { handleChange(event: string) {
this.searchTextLocalOutput = event; this.searchTextLocalOutput = event;
if (event && event.length == 1) { if (event && event.length == 1) {
this.onSearchExpand.emit({}); this.onSearchExpand.emit({});
} }
if (event && event.length > 0) if (event && event.length > 0)
this.disabled = false; this.disabled = false;
else else
this.disabled = true; this.disabled = true;
} }
handleClearClick(event) { handleClearClick(event) {
this.onClear.emit({}); this.onClear.emit({});
} }
} }

614
projects/common-map/src/fm-map/components/map/map.component.ts
View File

@ -1,307 +1,307 @@
import { Component, OnInit, OnDestroy, HostListener, Inject, ViewChild, AfterViewInit } from '@angular/core'; import { Component, OnInit, OnDestroy, HostListener, Inject, ViewChild, AfterViewInit } from '@angular/core';
import { Location } from '@angular/common'; import { Location } from '@angular/common';
import { Observable, Subject, Subscription,combineLatest, from } from 'rxjs'; import { Observable, Subject, Subscription,combineLatest, from } from 'rxjs';
import { debounce, withLatestFrom, first, combineAll } from 'rxjs/operators'; import { debounce, withLatestFrom, first, combineAll } from 'rxjs/operators';
import { Router, ActivatedRoute, ParamMap, Event } from '@angular/router'; import { Router, ActivatedRoute, ParamMap, Event } from '@angular/router';
import { Store } from '@ngrx/store'; import { Store } from '@ngrx/store';
//import { proj,Map } from 'openlayers'; //import { proj,Map } from 'openlayers';
// Map // Map
import * as mapReducers from '../../reducers/map.reducer'; import * as mapReducers from '../../reducers/map.reducer';
import * as mapActions from '../../actions/map.actions'; import * as mapActions from '../../actions/map.actions';
import { IMapState} from '../../models/map.state'; import { IMapState} from '../../models/map.state';
import { ISelectedFeatures } from '../../models/selected.features'; import { ISelectedFeatures } from '../../models/selected.features';
import { IItemLayer } from '../../models/item.layer'; import { IItemLayer } from '../../models/item.layer';
import { IQueryState } from '../../models/query.state'; import { IQueryState } from '../../models/query.state';
import { IPeriodState } from '../../models/period.state'; import { IPeriodState } from '../../models/period.state';
import { IDroppedFile } from '../aol/file-drop-target/file-drop-target.component'; import { IDroppedFile } from '../aol/file-drop-target/file-drop-target.component';
import { IMetaData } from '../meta-data-modal/meta-data-modal.component'; import { IMetaData } from '../meta-data-modal/meta-data-modal.component';
import { StateSerializerService } from '../../services/state-serializer.service'; import { StateSerializerService } from '../../services/state-serializer.service';
import { GeolocationService} from '../../services/geolocation.service'; import { GeolocationService} from '../../services/geolocation.service';
// AppCommon // AppCommon
import { ResumableFileUploadService, ItemTypeService } from '@farmmaps/common'; import { ResumableFileUploadService, ItemTypeService } from '@farmmaps/common';
import { IItemType, IItem } from '@farmmaps/common'; import { IItemType, IItem } from '@farmmaps/common';
import {commonReducers} from '@farmmaps/common'; import {commonReducers} from '@farmmaps/common';
import {commonActions} from '@farmmaps/common'; import {commonActions} from '@farmmaps/common';
import {Feature} from 'ol'; import {Feature} from 'ol';
import {Extent,createEmpty,extend } from 'ol/extent'; import {Extent,createEmpty,extend } from 'ol/extent';
import {transform} from 'ol/proj'; import {transform} from 'ol/proj';
import { query } from '@angular/animations'; import { query } from '@angular/animations';
import { tassign } from 'tassign'; import { tassign } from 'tassign';
@Component({ @Component({
selector: 'fm-map-map', selector: 'fm-map-map',
templateUrl: './map.component.html', templateUrl: './map.component.html',
styleUrls: ['./map.component.scss'] styleUrls: ['./map.component.scss']
}) })
export class MapComponent implements OnInit, OnDestroy,AfterViewInit { export class MapComponent implements OnInit, OnDestroy,AfterViewInit {
title: string = 'Map'; title: string = 'Map';
public openedModalName: Observable<string>; public openedModalName: Observable<string>;
public itemTypes: Observable<{ [id: string]: IItemType }>; public itemTypes: Observable<{ [id: string]: IItemType }>;
public mapState: Observable<IMapState>; public mapState: Observable<IMapState>;
public features: Observable<Array<Feature>>; public features: Observable<Array<Feature>>;
public overlayLayers: Observable<Array<IItemLayer>>; public overlayLayers: Observable<Array<IItemLayer>>;
public selectedOverlayLayer: Observable<IItemLayer>; public selectedOverlayLayer: Observable<IItemLayer>;
public selectedItemLayer: Observable<IItemLayer>; public selectedItemLayer: Observable<IItemLayer>;
public baseLayers: Observable<Array<IItemLayer>>; public baseLayers: Observable<Array<IItemLayer>>;
public selectedBaseLayer: Observable<IItemLayer>; public selectedBaseLayer: Observable<IItemLayer>;
public projection: Observable<string>; public projection: Observable<string>;
public selectedFeatures: Subject<ISelectedFeatures> = new Subject<ISelectedFeatures>(); public selectedFeatures: Subject<ISelectedFeatures> = new Subject<ISelectedFeatures>();
public droppedFile: Subject<IDroppedFile> = new Subject<IDroppedFile>(); public droppedFile: Subject<IDroppedFile> = new Subject<IDroppedFile>();
private paramSub: Subscription; private paramSub: Subscription;
private itemTypeSub: Subscription; private itemTypeSub: Subscription;
private mapStateSub: Subscription; private mapStateSub: Subscription;
private queryStateSub: Subscription; private queryStateSub: Subscription;
public parentCode: Observable<string>; public parentCode: Observable<string>;
public panelVisible: Observable<boolean>; public panelVisible: Observable<boolean>;
public panelCollapsed: Observable<boolean>; public panelCollapsed: Observable<boolean>;
public selectedFeature: Observable<Feature>; public selectedFeature: Observable<Feature>;
public selectedItem: Observable<IItem>; public selectedItem: Observable<IItem>;
public queryState: Observable<IQueryState>; public queryState: Observable<IQueryState>;
public period: Observable<IPeriodState>; public period: Observable<IPeriodState>;
public clearEnabled: Observable<boolean>; public clearEnabled: Observable<boolean>;
public searchCollapsed: Observable<boolean>; public searchCollapsed: Observable<boolean>;
public searchMinified: Observable<boolean>; public searchMinified: Observable<boolean>;
public menuVisible: Observable<boolean>; public menuVisible: Observable<boolean>;
public query: Observable<IQueryState>; public query: Observable<IQueryState>;
public position: Observable<Position>; public position: Observable<Position>;
public baseLayersCollapsed:boolean = true; public baseLayersCollapsed:boolean = true;
public overlayLayersCollapsed: boolean = true; public overlayLayersCollapsed: boolean = true;
public extent: Observable<Extent>; public extent: Observable<Extent>;
@ViewChild('map') map; @ViewChild('map', { static: true }) map;
constructor(private store: Store<mapReducers.State | commonReducers.State>, private route: ActivatedRoute, private router: Router, private uploadService: ResumableFileUploadService, private serializeService: StateSerializerService, public itemTypeService: ItemTypeService, private location: Location, private geolocationService: GeolocationService ) { constructor(private store: Store<mapReducers.State | commonReducers.State>, private route: ActivatedRoute, private router: Router, private uploadService: ResumableFileUploadService, private serializeService: StateSerializerService, public itemTypeService: ItemTypeService, private location: Location, private geolocationService: GeolocationService ) {
} }
@HostListener('document:keyup', ['$event']) @HostListener('document:keyup', ['$event'])
escapeClose(event: KeyboardEvent) { escapeClose(event: KeyboardEvent) {
let x = event.keyCode; let x = event.keyCode;
if (x === 27) { if (x === 27) {
this.handleCloseModal() this.handleCloseModal()
} }
} }
handleOpenModal(modalName: string) { handleOpenModal(modalName: string) {
this.store.dispatch(new commonActions.OpenModal(modalName)); this.store.dispatch(new commonActions.OpenModal(modalName));
} }
handleCloseModal() { handleCloseModal() {
this.store.dispatch(new commonActions.CloseModal()); this.store.dispatch(new commonActions.CloseModal());
} }
handleFileDropped(droppedFile: IDroppedFile) { handleFileDropped(droppedFile: IDroppedFile) {
this.uploadService.addFiles(droppedFile.files, droppedFile.event, { parentCode:droppedFile.parentCode, geometry:droppedFile.geometry }); this.uploadService.addFiles(droppedFile.files, droppedFile.event, { parentCode:droppedFile.parentCode, geometry:droppedFile.geometry });
} }
handleFeaturesSelected(feature: Feature) { handleFeaturesSelected(feature: Feature) {
if (feature) { if (feature) {
let newQuery = tassign(mapReducers.initialQueryState, { itemCode: feature.get('code') }); let newQuery = tassign(mapReducers.initialQueryState, { itemCode: feature.get('code') });
this.store.dispatch(new mapActions.DoQuery(newQuery)); this.store.dispatch(new mapActions.DoQuery(newQuery));
} }
} }
handleSearch(queryState: IQueryState) { handleSearch(queryState: IQueryState) {
this.store.dispatch(new mapActions.DoQuery(queryState)); this.store.dispatch(new mapActions.DoQuery(queryState));
} }
ngOnInit() { ngOnInit() {
this.store.dispatch(new mapActions.Init()); this.store.dispatch(new mapActions.Init());
this.selectedFeatures.next({x:0,y:0,features:[]}); this.selectedFeatures.next({x:0,y:0,features:[]});
this.mapState = this.store.select(mapReducers.selectGetMapState); this.mapState = this.store.select(mapReducers.selectGetMapState);
this.parentCode = this.store.select(mapReducers.selectGetParentCode); this.parentCode = this.store.select(mapReducers.selectGetParentCode);
this.features = this.store.select(mapReducers.selectGetFeatures); this.features = this.store.select(mapReducers.selectGetFeatures);
this.overlayLayers = this.store.select(mapReducers.selectGetOverlayLayers); this.overlayLayers = this.store.select(mapReducers.selectGetOverlayLayers);
this.selectedOverlayLayer = this.store.select(mapReducers.selectGetSelectedOverlayLayer); this.selectedOverlayLayer = this.store.select(mapReducers.selectGetSelectedOverlayLayer);
this.baseLayers = this.store.select(mapReducers.selectGetBaseLayers); this.baseLayers = this.store.select(mapReducers.selectGetBaseLayers);
this.projection = this.store.select(mapReducers.selectGetProjection); this.projection = this.store.select(mapReducers.selectGetProjection);
this.selectedBaseLayer = this.store.select(mapReducers.selectGetSelectedBaseLayer); this.selectedBaseLayer = this.store.select(mapReducers.selectGetSelectedBaseLayer);
this.panelVisible = this.store.select(mapReducers.selectGetPanelVisible); this.panelVisible = this.store.select(mapReducers.selectGetPanelVisible);
this.panelCollapsed = this.store.select(mapReducers.selectGetPanelCollapsed); this.panelCollapsed = this.store.select(mapReducers.selectGetPanelCollapsed);
this.selectedFeature = this.store.select(mapReducers.selectGetSelectedFeature); this.selectedFeature = this.store.select(mapReducers.selectGetSelectedFeature);
this.selectedItem = this.store.select(mapReducers.selectGetSelectedItem); this.selectedItem = this.store.select(mapReducers.selectGetSelectedItem);
this.queryState = this.store.select(mapReducers.selectGetQueryState); this.queryState = this.store.select(mapReducers.selectGetQueryState);
this.clearEnabled = this.store.select(mapReducers.selectGetClearEnabled); this.clearEnabled = this.store.select(mapReducers.selectGetClearEnabled);
this.searchCollapsed = this.store.select(mapReducers.selectGetSearchCollapsed); this.searchCollapsed = this.store.select(mapReducers.selectGetSearchCollapsed);
this.searchMinified = this.store.select(mapReducers.selectGetSearchMinified); this.searchMinified = this.store.select(mapReducers.selectGetSearchMinified);
this.menuVisible = this.store.select(mapReducers.selectGetMenuVisible); this.menuVisible = this.store.select(mapReducers.selectGetMenuVisible);
this.openedModalName = this.store.select(commonReducers.selectOpenedModalName); this.openedModalName = this.store.select(commonReducers.selectOpenedModalName);
this.query = this.store.select(mapReducers.selectGetQuery); this.query = this.store.select(mapReducers.selectGetQuery);
this.extent = this.store.select(mapReducers.selectGetExtent); this.extent = this.store.select(mapReducers.selectGetExtent);
this.selectedFeatures.next(null); this.selectedFeatures.next(null);
this.selectedItemLayer = this.store.select(mapReducers.selectGetSelectedItemLayer); this.selectedItemLayer = this.store.select(mapReducers.selectGetSelectedItemLayer);
this.period = this.store.select(mapReducers.selectGetPeriod); this.period = this.store.select(mapReducers.selectGetPeriod);
this.position = this.geolocationService.getCurrentPosition(); this.position = this.geolocationService.getCurrentPosition();
this.mapState.pipe(withLatestFrom(this.queryState)).subscribe((state) => { this.mapState.pipe(withLatestFrom(this.queryState)).subscribe((state) => {
this.replaceUrl(state[0], state[1], true); this.replaceUrl(state[0], state[1], true);
}); });
this.query.pipe(withLatestFrom(this.mapState)).subscribe((state) => { this.query.pipe(withLatestFrom(this.mapState)).subscribe((state) => {
this.replaceUrl(state[1], state[0],false); this.replaceUrl(state[1], state[0],false);
}); });
} }
private stateSetCount: number = 0; private stateSetCount: number = 0;
private lastQueryState: string = this.serializeService.serialize(mapReducers.initialQueryState); private lastQueryState: string = this.serializeService.serialize(mapReducers.initialQueryState);
private lastMapState: string = ""; private lastMapState: string = "";
ngAfterViewInit() { ngAfterViewInit() {
this.paramSub = this.route.paramMap.subscribe((params: ParamMap) => { this.paramSub = this.route.paramMap.subscribe((params: ParamMap) => {
//console.log("Param sub"); //console.log("Param sub");
var newMapState: IMapState = null; var newMapState: IMapState = null;
var newQueryState: IQueryState = null; var newQueryState: IQueryState = null;
var mapStateChanged = false; var mapStateChanged = false;
var queryStateChanged = false; var queryStateChanged = false;
if (params.has("xCenter") && params.has("yCenter")) { if (params.has("xCenter") && params.has("yCenter")) {
let xCenter = parseFloat(params.get("xCenter")); let xCenter = parseFloat(params.get("xCenter"));
let yCenter = parseFloat(params.get("yCenter")); let yCenter = parseFloat(params.get("yCenter"));
let zoom = parseFloat(params.get("zoom")); let zoom = parseFloat(params.get("zoom"));
let rotation = parseFloat(params.get("rotation")); let rotation = parseFloat(params.get("rotation"));
let baseLayer = params.get("baseLayer")?params.get("baseLayer"):""; let baseLayer = params.get("baseLayer")?params.get("baseLayer"):"";
newMapState = { xCenter: xCenter, yCenter: yCenter, zoom: zoom, rotation: rotation, baseLayerCode: baseLayer } newMapState = { xCenter: xCenter, yCenter: yCenter, zoom: zoom, rotation: rotation, baseLayerCode: baseLayer }
mapStateChanged = this.lastMapState != JSON.stringify(newMapState) && this.stateSetCount == 0; mapStateChanged = this.lastMapState != JSON.stringify(newMapState) && this.stateSetCount == 0;
this.lastMapState = JSON.stringify(newMapState); this.lastMapState = JSON.stringify(newMapState);
} }
if (params.has("queryState")) { if (params.has("queryState")) {
let queryState = params.get("queryState"); let queryState = params.get("queryState");
newQueryState = tassign(mapReducers.initialQueryState); newQueryState = tassign(mapReducers.initialQueryState);
if (queryState != "") { if (queryState != "") {
newQueryState = this.serializeService.deserialize(queryState); newQueryState = this.serializeService.deserialize(queryState);
} }
queryStateChanged = this.lastQueryState != queryState; queryStateChanged = this.lastQueryState != queryState;
this.lastQueryState = queryState; this.lastQueryState = queryState;
} }
if (mapStateChanged && queryStateChanged) { if (mapStateChanged && queryStateChanged) {
//console.log("Both states"); //console.log("Both states");
this.store.dispatch(new mapActions.SetState(newMapState, newQueryState)); this.store.dispatch(new mapActions.SetState(newMapState, newQueryState));
} else if (mapStateChanged) { } else if (mapStateChanged) {
//console.log("Map state"); //console.log("Map state");
this.store.dispatch(new mapActions.SetMapState(newMapState)); this.store.dispatch(new mapActions.SetMapState(newMapState));
} else if (queryStateChanged) { } else if (queryStateChanged) {
//console.log("Query state"); //console.log("Query state");
this.store.dispatch(new mapActions.SetQueryState(newQueryState)); this.store.dispatch(new mapActions.SetQueryState(newQueryState));
} }
this.stateSetCount += 1; this.stateSetCount += 1;
}); });
setTimeout(() => { setTimeout(() => {
this.map.instance.updateSize(); this.map.instance.updateSize();
}, 500); }, 500);
} }
handleSearchCollapse(event) { handleSearchCollapse(event) {
this.store.dispatch(new mapActions.CollapseSearch()); this.store.dispatch(new mapActions.CollapseSearch());
} }
handleSearchExpand(event) { handleSearchExpand(event) {
this.store.dispatch(new mapActions.ExpandSearch()); this.store.dispatch(new mapActions.ExpandSearch());
} }
handleToggleMenu(event) { handleToggleMenu(event) {
this.store.dispatch(new mapActions.ToggleMenu()); this.store.dispatch(new mapActions.ToggleMenu());
} }
handleToggleBaseLayers(event:MouseEvent) { handleToggleBaseLayers(event:MouseEvent) {
this.baseLayersCollapsed = !this.baseLayersCollapsed; this.baseLayersCollapsed = !this.baseLayersCollapsed;
event.preventDefault(); event.preventDefault();
} }
handleToggleOverlayLayers(event: MouseEvent) { handleToggleOverlayLayers(event: MouseEvent) {
this.overlayLayersCollapsed = !this.overlayLayersCollapsed; this.overlayLayersCollapsed = !this.overlayLayersCollapsed;
event.preventDefault(); event.preventDefault();
} }
handlePredefinedQuery(event: MouseEvent, query: any) { handlePredefinedQuery(event: MouseEvent, query: any) {
event.preventDefault(); event.preventDefault();
var queryState = tassign(mapReducers.initialQueryState, query); var queryState = tassign(mapReducers.initialQueryState, query);
this.store.dispatch(new mapActions.DoQuery(queryState)); this.store.dispatch(new mapActions.DoQuery(queryState));
} }
handleTrijntjeClick(event: MouseEvent, query: any) { handleTrijntjeClick(event: MouseEvent, query: any) {
event.preventDefault(); event.preventDefault();
var queryState = tassign(mapReducers.initialQueryState, query); var queryState = tassign(mapReducers.initialQueryState, query);
var mapState = JSON.parse(this.lastMapState); var mapState = JSON.parse(this.lastMapState);
this.router.navigate(["app","trijntje" , mapState.xCenter.toFixed(5), mapState.yCenter.toFixed(5), mapState.zoom, mapState.rotation.toFixed(2), mapState.baseLayerCode, this.serializeService.serialize(queryState)], { replaceUrl: false }); this.router.navigate(["app","trijntje" , mapState.xCenter.toFixed(5), mapState.yCenter.toFixed(5), mapState.zoom, mapState.rotation.toFixed(2), mapState.baseLayerCode, this.serializeService.serialize(queryState)], { replaceUrl: false });
} }
replaceUrl(mapState: IMapState, queryState: IQueryState, replace: boolean = true) { replaceUrl(mapState: IMapState, queryState: IQueryState, replace: boolean = true) {
console.debug(`Replace url : Baselayer(${mapState.baseLayerCode}) Querystate(${this.serializeService.serialize(queryState)})`); console.debug(`Replace url : Baselayer(${mapState.baseLayerCode}) Querystate(${this.serializeService.serialize(queryState)})`);
let parts =["."]; let parts =["."];
parts.push(mapState.xCenter.toFixed(5)); parts.push(mapState.xCenter.toFixed(5));
parts.push(mapState.yCenter.toFixed(5)); parts.push(mapState.yCenter.toFixed(5));
parts.push( mapState.zoom.toFixed(0)); parts.push( mapState.zoom.toFixed(0));
parts.push( mapState.rotation.toFixed(2)); parts.push( mapState.rotation.toFixed(2));
if(mapState.baseLayerCode!="") { if(mapState.baseLayerCode!="") {
parts.push(mapState.baseLayerCode); parts.push(mapState.baseLayerCode);
parts.push( this.serializeService.serialize(queryState)); parts.push( this.serializeService.serialize(queryState));
this.router.navigate(parts, { replaceUrl: replace,relativeTo:this.route.parent }); this.router.navigate(parts, { replaceUrl: replace,relativeTo:this.route.parent });
} }
} }
handleOnMoveEnd(event) { handleOnMoveEnd(event) {
var map = event.map; var map = event.map;
var view = map.getView(); var view = map.getView();
var rotation = view.getRotation(); var rotation = view.getRotation();
var zoom = view.getZoom(); var zoom = view.getZoom();
var center = transform(view.getCenter(), view.getProjection(), "EPSG:4326"); var center = transform(view.getCenter(), view.getProjection(), "EPSG:4326");
var extent = view.calculateExtent(this.map.instance.getSize()); var extent = view.calculateExtent(this.map.instance.getSize());
let mapState: IMapState = { xCenter: center[0], yCenter: center[1], zoom: zoom, rotation: rotation, baseLayerCode: null }; let mapState: IMapState = { xCenter: center[0], yCenter: center[1], zoom: zoom, rotation: rotation, baseLayerCode: null };
let state = { mapState: mapState, extent: extent }; let state = { mapState: mapState, extent: extent };
let source = from([state]); let source = from([state]);
source.pipe(withLatestFrom(this.selectedBaseLayer), withLatestFrom(this.queryState)).subscribe(([[state, baselayer], queryState]) => { source.pipe(withLatestFrom(this.selectedBaseLayer), withLatestFrom(this.queryState)).subscribe(([[state, baselayer], queryState]) => {
if (mapState && baselayer && queryState) { if (mapState && baselayer && queryState) {
let newMapState = tassign(state.mapState, { baseLayerCode: baselayer.item.code }); let newMapState = tassign(state.mapState, { baseLayerCode: baselayer.item.code });
this.replaceUrl(newMapState, tassign(queryState, { bbox: queryState.bboxFilter ? state.extent : queryState.bbox })); this.replaceUrl(newMapState, tassign(queryState, { bbox: queryState.bboxFilter ? state.extent : queryState.bbox }));
this.store.dispatch(new mapActions.SetViewExtent(state.extent)); this.store.dispatch(new mapActions.SetViewExtent(state.extent));
} }
}); });
} }
handleOnMouseDown(event: MouseEvent) { handleOnMouseDown(event: MouseEvent) {
this.store.dispatch(new mapActions.CollapseSearch()); this.store.dispatch(new mapActions.CollapseSearch());
} }
handleOnDownload(event) { handleOnDownload(event) {
} }
handleClearSearch(event) { handleClearSearch(event) {
this.store.dispatch(new commonActions.Escape(true, false)); this.store.dispatch(new commonActions.Escape(true, false));
} }
handleOnDelete(itemLayer: IItemLayer) { handleOnDelete(itemLayer: IItemLayer) {
this.store.dispatch(new mapActions.RemoveLayer(itemLayer)); this.store.dispatch(new mapActions.RemoveLayer(itemLayer));
} }
handleOnToggleVisibility(itemLayer: IItemLayer) { handleOnToggleVisibility(itemLayer: IItemLayer) {
this.store.dispatch(new mapActions.SetVisibility(itemLayer,!itemLayer.visible)); this.store.dispatch(new mapActions.SetVisibility(itemLayer,!itemLayer.visible));
} }
handleOnSetOpacity(event:{ layer: IItemLayer,opacity:number }) { handleOnSetOpacity(event:{ layer: IItemLayer,opacity:number }) {
this.store.dispatch(new mapActions.SetOpacity(event.layer, event.opacity)); this.store.dispatch(new mapActions.SetOpacity(event.layer, event.opacity));
} }
handleZoomToExtent(itemLayer: IItemLayer) { handleZoomToExtent(itemLayer: IItemLayer) {
var extent = createEmpty(); var extent = createEmpty();
extend(extent, itemLayer.layer.getExtent()); extend(extent, itemLayer.layer.getExtent());
if (extent) { if (extent) {
this.store.dispatch(new mapActions.SetExtent(extent)); this.store.dispatch(new mapActions.SetExtent(extent));
} }
} }
handleSelectBaseLayer(itemLayer: IItemLayer) { handleSelectBaseLayer(itemLayer: IItemLayer) {
this.store.dispatch(new mapActions.SelectBaseLayer(itemLayer)); this.store.dispatch(new mapActions.SelectBaseLayer(itemLayer));
} }
handleSelectOverlayLayer(itemLayer: IItemLayer) { handleSelectOverlayLayer(itemLayer: IItemLayer) {
this.store.dispatch(new mapActions.SelectOverlayLayer(itemLayer)); this.store.dispatch(new mapActions.SelectOverlayLayer(itemLayer));
} }
ngOnDestroy() { ngOnDestroy() {
this.paramSub.unsubscribe(); this.paramSub.unsubscribe();
if (this.itemTypeSub) this.itemTypeSub.unsubscribe(); if (this.itemTypeSub) this.itemTypeSub.unsubscribe();
if (this.mapStateSub) this.mapStateSub.unsubscribe(); if (this.mapStateSub) this.mapStateSub.unsubscribe();
if (this.queryStateSub) this.queryStateSub.unsubscribe(); } if (this.queryStateSub) this.queryStateSub.unsubscribe(); }
} }

122
projects/common-map/src/fm-map/components/meta-data-modal/meta-data-modal.component.ts
View File

@ -1,61 +1,61 @@
import { Component, Output, ViewChild, EventEmitter, Input, ElementRef, HostListener } from '@angular/core'; import { Component, Output, ViewChild, EventEmitter, Input, ElementRef, HostListener } from '@angular/core';
import { FormGroup,FormBuilder, Validators } from '@angular/forms'; import { FormGroup,FormBuilder, Validators } from '@angular/forms';
import { IListItem } from '@farmmaps/common'; import { IListItem } from '@farmmaps/common';
import { IDroppedFile } from '../aol/file-drop-target/file-drop-target.component'; import { IDroppedFile } from '../aol/file-drop-target/file-drop-target.component';
import {NgbModal, NgbModalRef} from "@ng-bootstrap/ng-bootstrap"; import {NgbModal, NgbModalRef} from "@ng-bootstrap/ng-bootstrap";
export interface IMetaData { export interface IMetaData {
droppedFile: IDroppedFile, droppedFile: IDroppedFile,
attributes: any attributes: any
} }
@Component({ @Component({
selector: 'fm-map-meta-data-modal', selector: 'fm-map-meta-data-modal',
templateUrl: 'meta-data-modal.component.html' templateUrl: 'meta-data-modal.component.html'
}) })
export class MetaDataModalComponent { export class MetaDataModalComponent {
private modalName: string = 'metaDataModal'; private modalName: string = 'metaDataModal';
private modalRef: NgbModalRef; private modalRef: NgbModalRef;
@ViewChild('content') _templateModal:ElementRef; @ViewChild('content', { static: true }) _templateModal:ElementRef;
@Input() droppedFile: IDroppedFile; @Input() droppedFile: IDroppedFile;
@Input() set modalState(_modalState:any) {; @Input() set modalState(_modalState:any) {;
if(_modalState == this.modalName) { if(_modalState == this.modalName) {
this.openModal() this.openModal()
} else if(this.modalRef) { } else if(this.modalRef) {
this.closeModal(); this.closeModal();
} }
} }
@Input() event: IListItem; @Input() event: IListItem;
@Output() onCloseModal = new EventEmitter<any>(); @Output() onCloseModal = new EventEmitter<any>();
@Output() onAddFilesWithMetaData = new EventEmitter<IMetaData>(); @Output() onAddFilesWithMetaData = new EventEmitter<IMetaData>();
constructor(private modalService: NgbModal, public fb: FormBuilder) { } constructor(private modalService: NgbModal, public fb: FormBuilder) { }
public metaDataForm: FormGroup; public metaDataForm: FormGroup;
handleMetaDataEntered(event) { handleMetaDataEntered(event) {
if (this.metaDataForm.valid) { if (this.metaDataForm.valid) {
this.onAddFilesWithMetaData.emit({ droppedFile: this.droppedFile, attributes: { name: this.metaDataForm.value.name } }); this.onAddFilesWithMetaData.emit({ droppedFile: this.droppedFile, attributes: { name: this.metaDataForm.value.name } });
} }
} }
openModal() { openModal() {
//Timeout trick to avoid ExpressionChangedAfterItHasBeenCheckedError //Timeout trick to avoid ExpressionChangedAfterItHasBeenCheckedError
setTimeout(() => this.modalRef = this.modalService.open(this._templateModal, { backdrop: 'static', keyboard: false })); setTimeout(() => this.modalRef = this.modalService.open(this._templateModal, { backdrop: 'static', keyboard: false }));
} }
closeModal() { closeModal() {
this.modalRef.close(); this.modalRef.close();
this.metaDataForm.patchValue({ name: "" }); this.metaDataForm.patchValue({ name: "" });
} }
ngOnInit(): void { ngOnInit(): void {
this.metaDataForm = this.fb.group({ this.metaDataForm = this.fb.group({
name: ["", Validators.compose([Validators.required, Validators.pattern("[a-zA-Z0-9_].*")])] name: ["", Validators.compose([Validators.required, Validators.pattern("[a-zA-Z0-9_].*")])]
}); });
} }
} }

186
projects/common-map/src/fm-map/components/select-period-modal/select-period-modal.component.ts
View File

@ -1,93 +1,93 @@
import { Component, Output, ViewChild, EventEmitter, Input, ElementRef, HostListener } from '@angular/core'; import { Component, Output, ViewChild, EventEmitter, Input, ElementRef, HostListener } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms'; import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { NgbModal, NgbModalRef, NgbDateStruct, NgbCalendar, NgbDateAdapter } from "@ng-bootstrap/ng-bootstrap"; import { NgbModal, NgbModalRef, NgbDateStruct, NgbCalendar, NgbDateAdapter } from "@ng-bootstrap/ng-bootstrap";
import { NgbDateNativeAdapter } from '@farmmaps/common'; import { NgbDateNativeAdapter } from '@farmmaps/common';
const equals = (one: NgbDateStruct, two: NgbDateStruct) => const equals = (one: NgbDateStruct, two: NgbDateStruct) =>
one && two && two.year === one.year && two.month === one.month && two.day === one.day; one && two && two.year === one.year && two.month === one.month && two.day === one.day;
const before = (one: NgbDateStruct, two: NgbDateStruct) => const before = (one: NgbDateStruct, two: NgbDateStruct) =>
!one || !two ? false : one.year === two.year ? one.month === two.month ? one.day === two.day !one || !two ? false : one.year === two.year ? one.month === two.month ? one.day === two.day
? false : one.day < two.day : one.month < two.month : one.year < two.year; ? false : one.day < two.day : one.month < two.month : one.year < two.year;
const after = (one: NgbDateStruct, two: NgbDateStruct) => const after = (one: NgbDateStruct, two: NgbDateStruct) =>
!one || !two ? false : one.year === two.year ? one.month === two.month ? one.day === two.day !one || !two ? false : one.year === two.year ? one.month === two.month ? one.day === two.day
? false : one.day > two.day : one.month > two.month : one.year > two.year; ? false : one.day > two.day : one.month > two.month : one.year > two.year;
@Component({ @Component({
selector: 'fm-map-select-period-modal', selector: 'fm-map-select-period-modal',
templateUrl: 'select-period-modal.component.html', templateUrl: 'select-period-modal.component.html',
styleUrls: ['select-period-modal.component.scss'] styleUrls: ['select-period-modal.component.scss']
}) })
export class SelectPeriodModalComponent { export class SelectPeriodModalComponent {
private modalName: string = 'selectPeriodModal'; private modalName: string = 'selectPeriodModal';
private modalRef: NgbModalRef; private modalRef: NgbModalRef;
private dateAdapter = new NgbDateNativeAdapter(); private dateAdapter = new NgbDateNativeAdapter();
hoveredDate: NgbDateStruct; hoveredDate: NgbDateStruct;
fromDate: NgbDateStruct; fromDate: NgbDateStruct;
toDate: NgbDateStruct; toDate: NgbDateStruct;
@ViewChild('content') _templateModal:ElementRef; @ViewChild('content', { static: true }) _templateModal:ElementRef;
@Input() set modalState(_modalState:any) {; @Input() set modalState(_modalState:any) {;
if(_modalState == this.modalName) { if(_modalState == this.modalName) {
this.openModal() this.openModal()
} else if(this.modalRef) { } else if(this.modalRef) {
this.closeModal(); this.closeModal();
} }
} }
@Input() set startDate(_modalState: Date) { @Input() set startDate(_modalState: Date) {
this.fromDate = this.dateAdapter.fromModel(_modalState); this.fromDate = this.dateAdapter.fromModel(_modalState);
} }
@Input() set endDate(_modalState: Date) { @Input() set endDate(_modalState: Date) {
var d = new Date(_modalState); var d = new Date(_modalState);
d.setDate(d.getDate() - 1); d.setDate(d.getDate() - 1);
this.toDate = this.dateAdapter.fromModel(d); this.toDate = this.dateAdapter.fromModel(d);
} }
@Output() onCloseModal = new EventEmitter<any>(); @Output() onCloseModal = new EventEmitter<any>();
@Output() onSelect = new EventEmitter<{ startDate: Date, endDate: Date }>(); @Output() onSelect = new EventEmitter<{ startDate: Date, endDate: Date }>();
constructor(private modalService: NgbModal, private calendar: NgbCalendar) { } constructor(private modalService: NgbModal, private calendar: NgbCalendar) { }
openModal() { openModal() {
//Timeout trick to avoid ExpressionChangedAfterItHasBeenCheckedError //Timeout trick to avoid ExpressionChangedAfterItHasBeenCheckedError
setTimeout(() => this.modalRef = this.modalService.open(this._templateModal, { backdrop: 'static', keyboard: false})); setTimeout(() => this.modalRef = this.modalService.open(this._templateModal, { backdrop: 'static', keyboard: false}));
} }
closeModal() { closeModal() {
this.modalRef.close(); this.modalRef.close();
} }
ngOnInit(): void { ngOnInit(): void {
} }
onDateChange(date: NgbDateStruct) { onDateChange(date: NgbDateStruct) {
if (!this.fromDate && !this.toDate) { if (!this.fromDate && !this.toDate) {
this.fromDate = date; this.fromDate = date;
} else if (this.fromDate && !this.toDate && after(date, this.fromDate)) { } else if (this.fromDate && !this.toDate && after(date, this.fromDate)) {
this.toDate = date; this.toDate = date;
} else { } else {
this.toDate = null; this.toDate = null;
this.fromDate = date; this.fromDate = date;
} }
} }
handleSelect(event:MouseEvent) { handleSelect(event:MouseEvent) {
event.preventDefault(); event.preventDefault();
if (this.fromDate && this.toDate && before(this.fromDate, this.toDate)) { if (this.fromDate && this.toDate && before(this.fromDate, this.toDate)) {
var endDate = new Date(this.dateAdapter.toModel(this.toDate)); var endDate = new Date(this.dateAdapter.toModel(this.toDate));
endDate.setDate(endDate.getDate() + 1); endDate.setDate(endDate.getDate() + 1);
this.onSelect.emit({startDate:this.dateAdapter.toModel(this.fromDate),endDate:endDate}) this.onSelect.emit({startDate:this.dateAdapter.toModel(this.fromDate),endDate:endDate})
} }
} }
isHovered = date => this.fromDate && !this.toDate && this.hoveredDate && after(date, this.fromDate) && before(date, this.hoveredDate); isHovered = date => this.fromDate && !this.toDate && this.hoveredDate && after(date, this.fromDate) && before(date, this.hoveredDate);
isInside = date => after(date, this.fromDate) && before(date, this.toDate); isInside = date => after(date, this.fromDate) && before(date, this.toDate);
isFrom = date => equals(date, this.fromDate); isFrom = date => equals(date, this.fromDate);
isTo = date => equals(date, this.toDate); isTo = date => equals(date, this.toDate);
} }

80
projects/common-map/src/fm-map/components/selected-item-container/selected-item-container.component.ts
View File

@ -1,40 +1,40 @@
import { Component, Input, OnInit, ComponentFactoryResolver, ViewChild, SimpleChanges, ComponentFactory, Inject, Type} from '@angular/core'; import { Component, Input, OnInit, ComponentFactoryResolver, ViewChild, SimpleChanges, ComponentFactory, Inject, Type} from '@angular/core';
import { IItem } from '@farmmaps/common'; import { IItem } from '@farmmaps/common';
import { AbstractSelectedItemComponent, SelectedItemComponent } from '../selected-item/selected-item.component'; import { AbstractSelectedItemComponent, SelectedItemComponent } from '../selected-item/selected-item.component';
import { WidgetHostDirective } from '../widget-host/widget-host.directive'; import { WidgetHostDirective } from '../widget-host/widget-host.directive';
@Component({ @Component({
selector: 'fm-map-selected-item-container', selector: 'fm-map-selected-item-container',
templateUrl: './selected-item-container.component.html', templateUrl: './selected-item-container.component.html',
styleUrls: ['./selected-item-container.component.scss'] styleUrls: ['./selected-item-container.component.scss']
}) })
export class SelectedItemContainerComponent { export class SelectedItemContainerComponent {
constructor(private componentFactoryResolver: ComponentFactoryResolver, @Inject(AbstractSelectedItemComponent) public selectedItemComponents: AbstractSelectedItemComponent[] ) { constructor(private componentFactoryResolver: ComponentFactoryResolver, @Inject(AbstractSelectedItemComponent) public selectedItemComponents: AbstractSelectedItemComponent[] ) {
} }
@Input() item: IItem; @Input() item: IItem;
@ViewChild(WidgetHostDirective) widgetHost: WidgetHostDirective; @ViewChild(WidgetHostDirective, { static: true }) widgetHost: WidgetHostDirective;
loadComponent() { loadComponent() {
var componentFactory: ComponentFactory<AbstractSelectedItemComponent> = this.componentFactoryResolver.resolveComponentFactory(SelectedItemComponent); // default var componentFactory: ComponentFactory<AbstractSelectedItemComponent> = this.componentFactoryResolver.resolveComponentFactory(SelectedItemComponent); // default
for (var i = 0; i < this.selectedItemComponents.length; i++) { for (var i = 0; i < this.selectedItemComponents.length; i++) {
if (this.selectedItemComponents[i]['forItemType'] == this.item.itemType) { if (this.selectedItemComponents[i]['forItemType'] == this.item.itemType) {
componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.selectedItemComponents[i]['constructor'] as any); componentFactory = this.componentFactoryResolver.resolveComponentFactory(this.selectedItemComponents[i]['constructor'] as any);
} }
} }
const viewContainerRef = this.widgetHost.viewContainerRef; const viewContainerRef = this.widgetHost.viewContainerRef;
viewContainerRef.clear(); viewContainerRef.clear();
const componentRef = viewContainerRef.createComponent(componentFactory); const componentRef = viewContainerRef.createComponent(componentFactory);
(<AbstractSelectedItemComponent>componentRef.instance).item = this.item; (<AbstractSelectedItemComponent>componentRef.instance).item = this.item;
} }
ngOnChanges(changes: SimpleChanges) { ngOnChanges(changes: SimpleChanges) {
if (changes["item"] && changes["item"].currentValue) { if (changes["item"] && changes["item"].currentValue) {
this.loadComponent(); this.loadComponent();
} }
} }
} }

24
projects/common-map/src/fm-map/services/device-orientation.service.ts Normal file
View File

@ -0,0 +1,24 @@
import { Injectable } from '@angular/core';
import { Observer, Observable } from 'rxjs';
@Injectable()
export class DeviceOrientationService {
/**
* Tries HTML5 geolocation.
*
* Wraps the Geolocation API into an observable.
*
* @return An observable of Bearing
*/
getCurrentBearing(): Observable<number> {
return Observable.create((observer: Observer<number>) => {
let sensor = new Magnetometer();
sensor.onreading= (ev:Event) => {
observer.next(Math.atan2(sensor.y, sensor.x) * (180 / Math.PI));
};
});
}
}

258
projects/common/src/fm/components/app/app.component.ts
View File

@ -1,129 +1,129 @@
import { Component, OnInit, OnDestroy, Inject, ViewEncapsulation, RendererFactory2, PLATFORM_ID, ChangeDetectionStrategy, HostListener } from '@angular/core'; import { Component, OnInit, OnDestroy, Inject, ViewEncapsulation, RendererFactory2, PLATFORM_ID, ChangeDetectionStrategy, HostListener } from '@angular/core';
import { Router, NavigationEnd, RouteConfigLoadStart, RouteConfigLoadEnd, ActivatedRoute, PRIMARY_OUTLET } from '@angular/router'; import { Router, NavigationEnd, RouteConfigLoadStart, RouteConfigLoadEnd, ActivatedRoute, PRIMARY_OUTLET } from '@angular/router';
import { Meta, Title, DOCUMENT, MetaDefinition } from '@angular/platform-browser'; import { Meta, Title, MetaDefinition } from '@angular/platform-browser';import { DOCUMENT } from "@angular/common";
import { Subscription , Observable } from 'rxjs'; import { Subscription , Observable } from 'rxjs';
import { Store, Action } from '@ngrx/store'; import { Store, Action } from '@ngrx/store';
//AppCommon //AppCommon
import { IEventMessage } from '../../models/event.message'; import { IEventMessage } from '../../models/event.message';
import { IListItem} from '../../models/list.item'; import { IListItem} from '../../models/list.item';
import { EventService } from '../../services/event.service'; import { EventService } from '../../services/event.service';
import * as commonActions from '../../actions/app-common.actions'; import * as commonActions from '../../actions/app-common.actions';
import * as appReducers from '../../reducers/app-common.reducer'; import * as appReducers from '../../reducers/app-common.reducer';
@Component({ @Component({
selector: 'fm-app', selector: 'fm-app',
templateUrl: './app.component.html', templateUrl: './app.component.html',
styleUrls: ['./app.component.scss'], styleUrls: ['./app.component.scss'],
encapsulation: ViewEncapsulation.None, encapsulation: ViewEncapsulation.None,
changeDetection: ChangeDetectionStrategy.OnPush changeDetection: ChangeDetectionStrategy.OnPush
}) })
export class AppComponent implements OnInit, OnDestroy { export class AppComponent implements OnInit, OnDestroy {
// This will go at the END of your title for example "Home - Angular Universal..." <-- after the dash (-) // This will go at the END of your title for example "Home - Angular Universal..." <-- after the dash (-)
private endPageTitle: string = 'Farmmaps'; private endPageTitle: string = 'Farmmaps';
// If no Title is provided, we'll use a default one before the dash(-) // If no Title is provided, we'll use a default one before the dash(-)
private defaultPageTitle: string = 'Farmmaps'; private defaultPageTitle: string = 'Farmmaps';
private routerSub$: Subscription; private routerSub$: Subscription;
private eventSub$: Subscription; private eventSub$: Subscription;
public currentFolder: Observable<IListItem>; public currentFolder: Observable<IListItem>;
public folderParents: Observable<IListItem[]>; public folderParents: Observable<IListItem[]>;
public browseFileElement: any; public browseFileElement: any;
public browseDirectoryElement: any; public browseDirectoryElement: any;
public fileDroptarget: any; public fileDroptarget: any;
public fullScreen: Observable<boolean>; public fullScreen: Observable<boolean>;
public routeLoading: Observable<boolean>; public routeLoading: Observable<boolean>;
constructor( constructor(
private router: Router, private router: Router,
private activatedRoute: ActivatedRoute, private activatedRoute: ActivatedRoute,
private title: Title, private title: Title,
private meta: Meta, private meta: Meta,
private store: Store<appReducers.State>, private store: Store<appReducers.State>,
private eventService: EventService, private eventService: EventService,
) { ) {
} }
getActionFromEvent(event: IEventMessage): Action { getActionFromEvent(event: IEventMessage): Action {
var action: Action = null; var action: Action = null;
console.debug(`${event.eventType} Event received`); console.debug(`${event.eventType} Event received`);
switch (event.eventType) { switch (event.eventType) {
case "ItemChanged": { case "ItemChanged": {
action = new commonActions.ItemChangedEvent(event.itemCode, event.attributes); action = new commonActions.ItemChangedEvent(event.itemCode, event.attributes);
break; break;
} }
case "ItemAdded": { case "ItemAdded": {
action = new commonActions.ItemAddedEvent(event.itemCode, event.attributes); action = new commonActions.ItemAddedEvent(event.itemCode, event.attributes);
break; break;
} }
case "ItemDeleted": { case "ItemDeleted": {
action = new commonActions.ItemDeletedEvent(event.itemCode, event.attributes); action = new commonActions.ItemDeletedEvent(event.itemCode, event.attributes);
break; break;
} }
case "taskStart": { case "taskStart": {
action = new commonActions.TaskStartEvent(event.itemCode, event.attributes); action = new commonActions.TaskStartEvent(event.itemCode, event.attributes);
break; break;
} }
case "taskEnd": { case "taskEnd": {
action = new commonActions.TaskEndEvent(event.itemCode, event.attributes); action = new commonActions.TaskEndEvent(event.itemCode, event.attributes);
break; break;
} }
case "taskError": { case "taskError": {
action = new commonActions.TaskErrorEvent(event.itemCode, event.attributes); action = new commonActions.TaskErrorEvent(event.itemCode, event.attributes);
break; break;
} }
} }
return action; return action;
} }
ngOnInit() { ngOnInit() {
this.fullScreen = this.store.select(appReducers.selectGetFullScreen); this.fullScreen = this.store.select(appReducers.selectGetFullScreen);
this.routeLoading = this.store.select(appReducers.selectGetRouteLoading); this.routeLoading = this.store.select(appReducers.selectGetRouteLoading);
this.InstallRouteEventHandler(); this.InstallRouteEventHandler();
this.InstallEventServiceEventHandler(); this.InstallEventServiceEventHandler();
} }
@HostListener('document:keyup', ['$event']) @HostListener('document:keyup', ['$event'])
keyUp(event: KeyboardEvent) { keyUp(event: KeyboardEvent) {
let x = event.keyCode; let x = event.keyCode;
if (x === 27) { if (x === 27) {
this.store.dispatch(new commonActions.Escape(true,false)); this.store.dispatch(new commonActions.Escape(true,false));
} }
} }
ngOnDestroy() { ngOnDestroy() {
// Subscription clean-up // Subscription clean-up
if(this.routerSub$) this.routerSub$.unsubscribe(); if(this.routerSub$) this.routerSub$.unsubscribe();
if(this.eventSub$) this.eventSub$.unsubscribe(); if(this.eventSub$) this.eventSub$.unsubscribe();
} }
private InstallRouteEventHandler() { private InstallRouteEventHandler() {
var other = this; var other = this;
this.routerSub$ = this.router.events.subscribe(event => { this.routerSub$ = this.router.events.subscribe(event => {
if (event instanceof RouteConfigLoadStart) { if (event instanceof RouteConfigLoadStart) {
other.store.dispatch(new commonActions.StartRouteLoading()); other.store.dispatch(new commonActions.StartRouteLoading());
} }
if (event instanceof RouteConfigLoadEnd) { if (event instanceof RouteConfigLoadEnd) {
other.store.dispatch(new commonActions.EndRouteLoading()); other.store.dispatch(new commonActions.EndRouteLoading());
} }
}); });
} }
private InstallEventServiceEventHandler() { private InstallEventServiceEventHandler() {
var other = this; var other = this;
this.eventSub$ = this.eventService.event.subscribe(event => { this.eventSub$ = this.eventService.event.subscribe(event => {
var action = other.getActionFromEvent(event); var action = other.getActionFromEvent(event);
if (action) other.store.dispatch(action); if (action) other.store.dispatch(action);
}); });
} }
handleClick(event: MouseEvent) { handleClick(event: MouseEvent) {
this.store.dispatch(new commonActions.Escape(false,true)); this.store.dispatch(new commonActions.Escape(false,true));
} }
} }

170
projects/common/src/fm/components/side-panel/side-panel.component.ts
View File

@ -1,85 +1,85 @@
import { Component, Input,ViewChild,ElementRef,OnChanges,SimpleChanges,HostListener,ChangeDetectorRef } from '@angular/core'; import { Component, Input,ViewChild,ElementRef,OnChanges,SimpleChanges,HostListener,ChangeDetectorRef } from '@angular/core';
@Component({ @Component({
selector: 'fm-side-panel', selector: 'fm-side-panel',
templateUrl: 'side-panel.component.html', templateUrl: 'side-panel.component.html',
styleUrls: ['side-panel.component.scss'] styleUrls: ['side-panel.component.scss']
}) })
export class SidePanelComponent implements OnChanges { export class SidePanelComponent implements OnChanges {
@Input() public visible: boolean; @Input() public visible: boolean;
@Input() public collapsed: boolean; @Input() public collapsed: boolean;
@Input() public collapsable: boolean; @Input() public collapsable: boolean;
@Input() public resizeable: boolean = false; @Input() public resizeable: boolean = false;
@ViewChild("resizeGrip") elementView: ElementRef; @ViewChild("resizeGrip", { static: false }) elementView: ElementRef;
public mobile:boolean = true; public mobile:boolean = true;
private parentHeight:number = 0; private parentHeight:number = 0;
public top = "100%"; public top = "100%";
private resizeTop:number=50; private resizeTop:number=50;
public resizing:boolean=false; public resizing:boolean=false;
constructor(private element: ElementRef,private ref: ChangeDetectorRef) { constructor(private element: ElementRef,private ref: ChangeDetectorRef) {
this.collapsable = false; this.collapsable = false;
this.setTop(); this.setTop();
} }
checkMobile():boolean { checkMobile():boolean {
let size = parseFloat(getComputedStyle(document.documentElement).width); let size = parseFloat(getComputedStyle(document.documentElement).width);
let rem = parseFloat(getComputedStyle(document.documentElement).fontSize); let rem = parseFloat(getComputedStyle(document.documentElement).fontSize);
let threshold = 44 * rem; let threshold = 44 * rem;
return !(size>threshold); return !(size>threshold);
} }
setTop() { setTop() {
this.mobile = this.checkMobile(); this.mobile = this.checkMobile();
this.resizeTop = this.mobile?50:0; this.resizeTop = this.mobile?50:0;
this.top = (this.visible?this.resizeTop: (this.mobile? 100:0)) + "%"; this.top = (this.visible?this.resizeTop: (this.mobile? 100:0)) + "%";
} }
ngAfterViewInit() { ngAfterViewInit() {
this.parentHeight = this.element.nativeElement.offsetParent.clientHeight; this.parentHeight = this.element.nativeElement.offsetParent.clientHeight;
} }
handleToggleClick(event) { handleToggleClick(event) {
if (this.collapsable) { if (this.collapsable) {
this.collapsed = !this.collapsed; this.collapsed = !this.collapsed;
} }
} }
handleStartGripDrag(event:DragEvent|TouchEvent) { handleStartGripDrag(event:DragEvent|TouchEvent) {
this.resizing=true; this.resizing=true;
if(event instanceof DragEvent) { if(event instanceof DragEvent) {
var crt = new Image(); var crt = new Image();
crt.style.display = "none"; crt.style.display = "none";
document.body.appendChild(crt); document.body.appendChild(crt);
event.dataTransfer.setDragImage(crt,0,0); event.dataTransfer.setDragImage(crt,0,0);
} }
} }
handleEndGripDrag() { handleEndGripDrag() {
this.resizing = false; this.resizing = false;
} }
handleGripDrag(event:DragEvent|TouchEvent) { handleGripDrag(event:DragEvent|TouchEvent) {
var clientY = 0; var clientY = 0;
if((event instanceof TouchEvent)) { if((event instanceof TouchEvent)) {
clientY = (event as TouchEvent).changedTouches[0].clientY; clientY = (event as TouchEvent).changedTouches[0].clientY;
} else { } else {
clientY=(event as DragEvent).clientY; clientY=(event as DragEvent).clientY;
} }
this.resizeTop = Math.min(98, Math.max(0, clientY / (this.parentHeight / 100))); this.resizeTop = Math.min(98, Math.max(0, clientY / (this.parentHeight / 100)));
this.top = (this.visible? this.resizeTop:(this.mobile? 100:0)) + "%"; this.top = (this.visible? this.resizeTop:(this.mobile? 100:0)) + "%";
} }
ngOnChanges(changes: SimpleChanges) { ngOnChanges(changes: SimpleChanges) {
if(changes.visible) { if(changes.visible) {
this.top = (changes.visible.currentValue?this.resizeTop:(this.mobile? 100:0)) + "%"; this.top = (changes.visible.currentValue?this.resizeTop:(this.mobile? 100:0)) + "%";
} }
} }
@HostListener('window:resize', ['$event']) @HostListener('window:resize', ['$event'])
onResize(event) { onResize(event) {
this.setTop(); this.setTop();
} }
} }

208
projects/common/src/fm/components/tag-input/tag-input.component.ts
View File

@ -1,104 +1,104 @@
import { Component, Input, forwardRef,ElementRef,ViewChild } from '@angular/core'; import { Component, Input, forwardRef,ElementRef,ViewChild } from '@angular/core';
import { ControlValueAccessor, NG_VALUE_ACCESSOR,NgModel } from '@angular/forms'; import { ControlValueAccessor, NG_VALUE_ACCESSOR,NgModel } from '@angular/forms';
import { Observable,of } from 'rxjs'; import { Observable,of } from 'rxjs';
import { tap,catchError,debounceTime,distinctUntilChanged,switchMap } from 'rxjs/operators' import { tap,catchError,debounceTime,distinctUntilChanged,switchMap } from 'rxjs/operators'
import { TypeaheadService } from '../../services/typeahead.service'; import { TypeaheadService } from '../../services/typeahead.service';
@Component({ @Component({
selector: 'fm-tag-input', selector: 'fm-tag-input',
templateUrl: 'tag-input.component.html', templateUrl: 'tag-input.component.html',
styleUrls: ['tag-input.component.scss'], styleUrls: ['tag-input.component.scss'],
providers: [ providers: [
{ {
provide: NG_VALUE_ACCESSOR, provide: NG_VALUE_ACCESSOR,
useExisting: forwardRef(() => TagInputComponent), useExisting: forwardRef(() => TagInputComponent),
multi: true multi: true
} }
] ]
}) })
export class TagInputComponent implements ControlValueAccessor { export class TagInputComponent implements ControlValueAccessor {
@Input() tags: string[] @Input() tags: string[]
@ViewChild('taginput') tagInputElement: ElementRef; @ViewChild('taginput', { static: true }) tagInputElement: ElementRef;
public tag: string; public tag: string;
searching = false; searching = false;
searchFailed = false; searchFailed = false;
constructor(private typeaheadService: TypeaheadService) { constructor(private typeaheadService: TypeaheadService) {
} }
tagExists(tag) { tagExists(tag) {
if (tag.length == 0) return true; if (tag.length == 0) return true;
for (let t of this.tags) { for (let t of this.tags) {
if (t.toLowerCase() == tag.toLowerCase()) return true; if (t.toLowerCase() == tag.toLowerCase()) return true;
} }
return false; return false;
} }
handleDeleteTag(tag) { handleDeleteTag(tag) {
let tags = []; let tags = [];
for (let t of this.tags) { for (let t of this.tags) {
if (t != tag) tags.push(t); if (t != tag) tags.push(t);
} }
this.tags = tags; this.tags = tags;
this.propagateChange(tags); this.propagateChange(tags);
} }
handleAddTag(event) { handleAddTag(event) {
if (!this.tagExists(this.tag)) { if (!this.tagExists(this.tag)) {
this.tags.push(this.tag); this.tags.push(this.tag);
this.propagateChange(this.tags); this.propagateChange(this.tags);
} }
this.tag = ""; this.tag = "";
this.tagInputElement.nativeElement.focus(); this.tagInputElement.nativeElement.focus();
} }
handleCheckAddTag(event: KeyboardEvent) { handleCheckAddTag(event: KeyboardEvent) {
if (event.keyCode == 188) { if (event.keyCode == 188) {
let tag = this.tag.substr(0, this.tag.length - 1); // strip , let tag = this.tag.substr(0, this.tag.length - 1); // strip ,
if (!this.tagExists(tag)) { if (!this.tagExists(tag)) {
this.tags.push(tag); this.tags.push(tag);
this.propagateChange(this.tags); this.propagateChange(this.tags);
} }
this.tag = ""; this.tag = "";
} }
} }
handleSelect(event) { handleSelect(event) {
if (!this.tagExists(event.item)) { if (!this.tagExists(event.item)) {
this.tags.push(event.item); this.tags.push(event.item);
this.propagateChange(this.tags); this.propagateChange(this.tags);
} }
event.preventDefault(); event.preventDefault();
this.tag = ""; this.tag = "";
} }
propagateChange = (_: any) => { }; propagateChange = (_: any) => { };
registerOnChange(fn) { registerOnChange(fn) {
this.propagateChange = fn; this.propagateChange = fn;
} }
findTag = (text$: Observable<string>) => findTag = (text$: Observable<string>) =>
text$.pipe( text$.pipe(
debounceTime(200), debounceTime(200),
distinctUntilChanged(), distinctUntilChanged(),
tap(() => this.searching = true), tap(() => this.searching = true),
switchMap(term => term.length < 1 ? of([]) : switchMap(term => term.length < 1 ? of([]) :
this.typeaheadService.getTagTypeaheadItems(term).pipe( this.typeaheadService.getTagTypeaheadItems(term).pipe(
tap(() => this.searchFailed = false), tap(() => this.searchFailed = false),
catchError(() => { catchError(() => {
this.searchFailed = true; this.searchFailed = true;
return of([]); return of([]);
})) }))
), ),
tap(() => this.searching = false) tap(() => this.searching = false)
); );
writeValue(value: any) { writeValue(value: any) {
this.tags = value; this.tags = value;
this.tag = ""; this.tag = "";
} }
registerOnTouched() { } registerOnTouched() { }
} }

1166
projects/common/src/fm/components/timespan/timespan.component.ts
View File

File diff suppressed because it is too large Load Diff

2
src/polyfills.ts
View File

@ -43,7 +43,7 @@
* *
* (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame * (window as any).__Zone_disable_requestAnimationFrame = true; // disable patch requestAnimationFrame
* (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick * (window as any).__Zone_disable_on_property = true; // disable patch onProperty such as onclick
* (window as any).__zone_symbol__BLACK_LISTED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames * (window as any).__zone_symbol__UNPATCHED_EVENTS = ['scroll', 'mousemove']; // disable patch specified eventNames
* *
* in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js * in IE/Edge developer tools, the addEventListener will also be wrapped by zone.js
* with the following flag, it will bypass `zone.js` patch for IE/Edge * with the following flag, it will bypass `zone.js` patch for IE/Edge

22
src/tsconfig.app.json
View File

@ -1,11 +1,11 @@
{ {
"extends": "../tsconfig.json", "extends": "../tsconfig.json",
"compilerOptions": { "compilerOptions": {
"outDir": "../out-tsc/app", "outDir": "../out-tsc/app",
"types": [] "types": []
}, },
"exclude": [ "exclude": [
"test.ts", "test.ts",
"**/*.spec.ts" "**/*.spec.ts"
] ]
} }

36
src/tsconfig.spec.json
View File

@ -1,18 +1,18 @@
{ {
"extends": "../tsconfig.json", "extends": "../tsconfig.json",
"compilerOptions": { "compilerOptions": {
"outDir": "../out-tsc/spec", "outDir": "../out-tsc/spec",
"types": [ "types": [
"jasmine", "jasmine",
"node" "node"
] ]
}, },
"files": [ "files": [
"test.ts", "test.ts",
"polyfills.ts" "polyfills.ts"
], ],
"include": [ "include": [
"**/*.spec.ts", "**/*.spec.ts",
"**/*.d.ts" "**/*.d.ts"
] ]
} }

5
tsconfig.json
View File

@ -2,15 +2,16 @@
"compileOnSave": false, "compileOnSave": false,
"compilerOptions": { "compilerOptions": {
"baseUrl": "./", "baseUrl": "./",
"downlevelIteration": true,
"outDir": "./dist/out-tsc", "outDir": "./dist/out-tsc",
"sourceMap": true, "sourceMap": true,
"declaration": false, "declaration": false,
"module": "es2015", "module": "esnext",
"moduleResolution": "node", "moduleResolution": "node",
"emitDecoratorMetadata": true, "emitDecoratorMetadata": true,
"experimentalDecorators": true, "experimentalDecorators": true,
"importHelpers": true, "importHelpers": true,
"target": "es5", "target": "es2015",
"typeRoots": [ "typeRoots": [
"node_modules/@types" "node_modules/@types"
], ],

150
tslint.json
View File

@ -1,75 +1,75 @@
{ {
"extends": "tslint:recommended", "extends": "tslint:recommended",
"rulesDirectory": [ "rulesDirectory": [
"codelyzer" "codelyzer"
], ],
"rules": { "rules": {
"array-type": false, "array-type": false,
"arrow-parens": false, "arrow-parens": false,
"deprecation": { "deprecation": {
"severity": "warn" "severity": "warn"
}, },
"import-blacklist": [ "import-blacklist": [
true, true,
"rxjs/Rx" "rxjs/Rx"
], ],
"interface-name": false, "interface-name": false,
"max-classes-per-file": false, "max-classes-per-file": false,
"max-line-length": [ "max-line-length": [
true, true,
140 140
], ],
"member-access": false, "member-access": false,
"member-ordering": [ "member-ordering": [
true, true,
{ {
"order": [ "order": [
"static-field", "static-field",
"instance-field", "instance-field",
"static-method", "static-method",
"instance-method" "instance-method"
] ]
} }
], ],
"no-consecutive-blank-lines": false, "no-consecutive-blank-lines": false,
"no-console": [ "no-console": [
true, true,
"debug", "debug",
"info", "info",
"time", "time",
"timeEnd", "timeEnd",
"trace" "trace"
], ],
"no-empty": false, "no-empty": false,
"no-inferrable-types": [ "no-inferrable-types": [
true, true,
"ignore-params" "ignore-params"
], ],
"no-non-null-assertion": true, "no-non-null-assertion": true,
"no-redundant-jsdoc": true, "no-redundant-jsdoc": true,
"no-switch-case-fall-through": true, "no-switch-case-fall-through": true,
"no-use-before-declare": true, "no-use-before-declare": true,
"no-var-requires": false, "no-var-requires": false,
"object-literal-key-quotes": [ "object-literal-key-quotes": [
true, true,
"as-needed" "as-needed"
], ],
"object-literal-sort-keys": false, "object-literal-sort-keys": false,
"ordered-imports": false, "ordered-imports": false,
"quotemark": [ "quotemark": [
true, true,
"single" "single"
], ],
"trailing-comma": false, "trailing-comma": false,
"no-output-on-prefix": true, "no-output-on-prefix": true,
"use-input-property-decorator": true, "no-inputs-metadata-property": true,
"use-output-property-decorator": true, "no-outputs-metadata-property": true,
"use-host-property-decorator": true, "no-host-metadata-property": true,
"no-input-rename": true, "no-input-rename": true,
"no-output-rename": true, "no-output-rename": true,
"use-life-cycle-interface": true, "use-lifecycle-interface": true,
"use-pipe-transform-interface": true, "use-pipe-transform-interface": true,
"component-class-suffix": true, "component-class-suffix": true,
"directive-class-suffix": true "directive-class-suffix": true
} }
} }