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

Use timespan for temporal items
Some checks failed
FarmMaps.Develop/FarmMapsLib/pipeline/head There was a failure building this commit
Details

Browse Source
This commit is contained in:
Willem Dantuma 2021-01-25 20:30:13 +01:00
parent b17bce1cd2
commit fe356441d0
2 changed files with 33 additions and 17 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

12
projects/common-map/src/fm-map/components/selected-item-temporal/selected-item-temporal.component.html
View File

@ -11,14 +11,14 @@
<div class="card menu-card"> <div class="card menu-card">
<h5>Date image: {{item.dataDate | date:'shortDate'}}</h5> <h5>Date image: {{item.dataDate | date:'shortDate'}}</h5>
<div class="d-flex justify-content-between"> <div class="d-flex justify-content-between">
<div *ngIf="hasPrevious()"> <div>
<button type="button" class="btn btn-link p-0" (click)="handlePreviousTemporal($event)"> <button *ngIf="hasPrevious()" type="button" class="btn btn-link p-0" (click)="handlePreviousTemporal($event)">
<i class="fal fa-arrow-circle-left" aria-hidden="true" i18n-title title="Previous"></i>&nbsp;{{ previousDate() | date:'shortDate'}} <i class="fal fa-arrow-circle-left" aria-hidden="true" i18n-title title="Previous"></i>&nbsp;{{ previousDate() }}
</button> </button>
</div> </div>
<div *ngIf="hasNext()"> <div>
<button type="button" class="btn btn-link p-0" (click)="handleNextTemporal($event)"> <button *ngIf="hasNext()" type="button" class="btn btn-link p-0" (click)="handleNextTemporal($event)">
{{ nextDate()| date:'shortDate' }}&nbsp;<i class="fal fa-arrow-circle-right" aria-hidden="true" i18n-title title="Next"></i> {{ nextDate()}}&nbsp;<i class="fal fa-arrow-circle-right" aria-hidden="true" i18n-title title="Next"></i>
</button> </button>
</div> </div>
</div> </div>

38
projects/common-map/src/fm-map/components/selected-item-temporal/selected-item-temporal.component.ts
View File

@ -1,8 +1,8 @@
import { Component, Injectable } from '@angular/core'; import { Component, Injectable } from '@angular/core';
import { Location } from '@angular/common'; import { Location,DatePipe } from '@angular/common';
import { Store } from '@ngrx/store'; import { Store } from '@ngrx/store';
import * as mapReducers from '../../reducers/map.reducer'; import * as mapReducers from '../../reducers/map.reducer';
import { commonReducers, ItemTypeService, ItemService, FolderService,IItem } from '@farmmaps/common'; import { commonReducers, ItemTypeService, ItemService, FolderService,IItem,TimespanService } from '@farmmaps/common';
import { Router } from '@angular/router'; import { Router } from '@angular/router';
import { ForItemType } from '../for-item/for-itemtype.decorator'; import { ForItemType } from '../for-item/for-itemtype.decorator';
import { AbstractSelectedItemComponent } from '../selected-item/selected-item.component'; import { AbstractSelectedItemComponent } from '../selected-item/selected-item.component';
@ -19,7 +19,7 @@ import * as mapActions from '../../actions/map.actions';
}) })
export class SelectedItemTemporalComponent extends AbstractSelectedItemComponent { export class SelectedItemTemporalComponent extends AbstractSelectedItemComponent {
constructor(store: Store<mapReducers.State | commonReducers.State>, itemTypeService: ItemTypeService, location: Location, router: Router, private itemService$: ItemService,private folderService$: FolderService) { constructor(store: Store<mapReducers.State | commonReducers.State>, itemTypeService: ItemTypeService, location: Location, router: Router, private itemService$: ItemService,private folderService$: FolderService, private timespanService$:TimespanService,private datePipe$: DatePipe) {
super(store, itemTypeService,location,router); super(store, itemTypeService,location,router);
} }
@ -32,11 +32,19 @@ export class SelectedItemTemporalComponent extends AbstractSelectedItemComponent
return temporalItemLayer && temporalItemLayer.nextItemLayer != null; return temporalItemLayer && temporalItemLayer.nextItemLayer != null;
} }
nextDate():Date { nextDate():string {
let temporalItemLayer = this.itemLayer as ITemporalItemLayer; let temporalItemLayer = this.itemLayer as ITemporalItemLayer;
if(temporalItemLayer.nextItemLayer.item) if(temporalItemLayer.nextItemLayer.item) {
return new Date(Date.parse(temporalItemLayer.nextItemLayer.item.dataDate)) ; if(temporalItemLayer.nextItemLayer.item.dataDate && temporalItemLayer.nextItemLayer.item.dataEndDate) {
return null; let sd = new Date(Date.parse(temporalItemLayer.nextItemLayer.item.dataDate));
let ed = new Date(Date.parse(temporalItemLayer.nextItemLayer.item.dataEndDate));
return this.timespanService$.getCaption(sd,ed);
} else {
let d = new Date(Date.parse(temporalItemLayer.nextItemLayer.item.dataDate));
return this.datePipe$.transform(d, "shortDate");
}
}
return "";
} }
hasPrevious():boolean { hasPrevious():boolean {
@ -44,11 +52,19 @@ export class SelectedItemTemporalComponent extends AbstractSelectedItemComponent
return temporalItemLayer && temporalItemLayer.previousItemLayer != null; return temporalItemLayer && temporalItemLayer.previousItemLayer != null;
} }
previousDate():Date { previousDate():string {
let temporalItemLayer = this.itemLayer as ITemporalItemLayer; let temporalItemLayer = this.itemLayer as ITemporalItemLayer;
if(temporalItemLayer.previousItemLayer.item) if(temporalItemLayer.previousItemLayer.item) {
return new Date(Date.parse(temporalItemLayer.previousItemLayer.item.dataDate)); if(temporalItemLayer.previousItemLayer.item.dataDate && temporalItemLayer.previousItemLayer.item.dataEndDate) {
return null; let sd = new Date(Date.parse(temporalItemLayer.previousItemLayer.item.dataDate));
let ed = new Date(Date.parse(temporalItemLayer.previousItemLayer.item.dataEndDate));
return this.timespanService$.getCaption(sd,ed);
} else {
let d = new Date(Date.parse(temporalItemLayer.previousItemLayer.item.dataDate));
return this.datePipe$.transform(d, "shortDate");
}
}
return "";
} }
handleNextTemporal(event:MouseEvent) { handleNextTemporal(event:MouseEvent) {