Time filter minute

package.json

@@ -56,6 +56,7 @@
     "hammerjs": "^2.0.8",
     "jspdf": "^1.3.5",
     "jwt-decode": "^2.2.0",
+    "moment": "^2.22.2",
     "openlayers": "^4.6.5",
     "rxjs": "^5.5.2",
     "ts-md5": "^1.2.0",

src/lib/catalog/catalog-layers-list/catalog-layers-list-binding.directive.ts

@@ -15,7 +15,6 @@ import {
 import { Catalog, CatalogService } from '../shared';
 import { CatalogLayersListComponent } from './catalog-layers-list.component';
 
-
 @Directive({
   selector: '[igoCatalogLayersListBinding]'
 })
@@ -71,6 +70,7 @@ export class CatalogLayersListBindingDirective implements OnInit, OnDestroy {
     let currentRegFilter;
     let boolRegFilter = true;
     let objGroupLayers;
+    let timeFilter;
     // Dig all levels until last level (layer object are not defined on last level)
     for (const group of layerList.Layer) {
       if (group.queryable === false && typeof group.Layer !== 'undefined') {
@@ -98,13 +98,16 @@ export class CatalogLayersListBindingDirective implements OnInit, OnDestroy {
             }
             // If layer regex is okay (or not define), add the layer to the group
             if (boolRegFilter === true) {
+             timeFilter =  this.capabilitiesService.getTimeFilter(layer);
               arrLayer.push({
                 title: layer.Title,
                 type: 'wms',
                 url: catalog.url,
                 params: {
                   layers: layer.Name
-                }
+                },
+                 // Merge catalog time filter in layer timeFilter
+                timeFilter: {...timeFilter, ...catalog.timeFilter}
               });
             }
             return arrLayer;

src/lib/datasource/shared/capabilities.service.ts

@@ -149,7 +149,7 @@ export class CapabilitiesService {
     return scale / (39.37 * dpi);
   }
 
-  private getTimeFilter(layer): TimeFilterOptions {
+  getTimeFilter(layer): TimeFilterOptions {
     let dimension;
 
     if (layer.Dimension) {

src/lib/datasource/shared/datasources/wms-datasource.ts

@@ -268,6 +268,7 @@ export class WMSDataSource extends DataSource
     let month = value.getMonth() + 1;
     let day = value.getUTCDate();
     let hour = value.getUTCHours();
+    let minute = value.getUTCMinutes();
 
     if (Number(month) < 10) {
       month = '0' + month;
@@ -281,7 +282,11 @@ export class WMSDataSource extends DataSource
       hour = '0' + hour;
     }
 
-    return year + '-' + month + '-' + day + 'T' + hour + ':00:00Z';
+    if (Number(minute) < 10) {
+      minute = '0' + minute;
+    }
+
+    return year + '-' + month + '-' + day + 'T' + hour + ':' + minute + ':00Z';
   }
 
   filterByDate(date: Date | [Date, Date]) {

src/lib/filter/shared/time-filter.interface.ts

@@ -9,4 +9,5 @@ export interface TimeFilterOptions {
   style?: 'calendar' | 'slider';
   step?: number;
   timeInterval?: number;
+  current?: boolean;
 }

src/lib/filter/time-filter-form/time-filter-form.component.ts

@@ -8,6 +8,7 @@ import {
 } from '@angular/core';
 import { MatSlider } from '@angular/material';
 import { TimeFilterOptions } from '../shared';
+import * as moment from 'moment';
 
 @Component({
   selector: 'igo-time-filter-form',
@@ -95,7 +96,7 @@ export class TimeFilterFormComponent implements OnInit {
           step = 10800000;
       }
     } else {
-      step = this.options.step;
+      step = this.getStepDefinition(this.options.step);
     }
 
     return step;
@@ -164,7 +165,12 @@ export class TimeFilterFormComponent implements OnInit {
   handleDateChange(event: any) {
     this.setupDateOutput();
     this.applyTypeChange();
-    this.change.emit([this.startDate, this.endDate]);
+    // Only if is range, use 2 dates to make the range
+    if (this.isRange) {
+      this.change.emit([this.startDate, this.endDate]);
+    } else {
+        this.change.emit(this.startDate);
+    }
   }
 
   handleYearChange(event: any) {
@@ -270,6 +276,10 @@ export class TimeFilterFormComponent implements OnInit {
   }
 
   handleSliderValue(): number {
+    if (this.options.current === true) {
+      const currentDate = new Date();
+      this.date = this.getRoundedDate(currentDate);
+    }
     return this.date === undefined ? this.min.getTime() : this.date.getTime();
   }
 
@@ -353,7 +363,8 @@ export class TimeFilterFormComponent implements OnInit {
           }
         }
 
-        if (!this.isRange) {
+        // Minutes and second not important for step more than 1hour
+        if (!this.isRange && this.step > (60 * 60 * 1000) ) {
           this.startDate.setMinutes(0);
           this.startDate.setSeconds(0);
           this.endDate.setMinutes(59);
@@ -373,4 +384,25 @@ export class TimeFilterFormComponent implements OnInit {
   getRangeMaxDate(): Date {
     return this.endDate === undefined ? this.max : this.endDate;
   }
+
+  /**
+  Round date at a certain time, 10 minutes by Default
+  @param date - Date to Round
+  @param atMinute - round to closest 'atMinute' minute, rounded 10 by default
+  @return the rounded date
+  */
+  getRoundedDate(date, atMinute = 10) {
+    const coeff = 1000 * 60 * atMinute;
+    return new Date(Math.round(date.getTime() / coeff) * coeff)
+  }
+
+  /**
+  Get the step (period) definition from the layer dimension tag
+  @param step The step as ISO 8601 example: PT10M for 10 Minutes
+  @return the duration in milliseconds
+  */
+  getStepDefinition(step) {
+    return moment.duration(step).asMilliseconds();
+
+  }
 }