import {ChangeDetectorRef, Component, Inject, OnChanges, OnInit} from '@angular/core'; import {ConfigService} from '../../config.service'; import {BaseComponent} from '../base-page/base.component'; import {DOCUMENT} from '@angular/common'; @Component({ selector: 'framadate-dates', templateUrl: './dates.component.html', styleUrls: ['./dates.component.scss'] }) export class DatesComponent extends BaseComponent implements OnInit, OnChanges { showDateInterval: boolean = true; startDateInterval: any; intervalDays: any; intervalDaysDefault: number = 7; endDateInterval: any; constructor(public config: ConfigService, private cd: ChangeDetectorRef, @Inject(DOCUMENT) private document: any ) { super(config); } ngOnChanges() { // compute the number of days in the date interval if (this.endDateInterval && this.startDateInterval) { this.intervalDays = (this.dayDiff(this.endDateInterval, this.startDateInterval)).toFixed(0) } } /** * set the interval options */ ngOnInit() { let dateCurrent = new Date(); const dateJson = dateCurrent.toISOString(); console.log('dateJson', dateJson.substring(0, 10)); this.startDateInterval = dateJson.substring(0, 10); this.endDateInterval = this.addDaysToDate(this.intervalDaysDefault, dateCurrent).toISOString().substring(0, 10); } addDate() { this.config.dateList.push({literal: '', timeList: []}); } addtime() { this.config.timeList.push({literal: '', timeList: []}); } /** * add some days to a date, to compute intervals * @param days * @param date */ addDaysToDate(days: number, date: Date) { var date = new Date(date.valueOf()); date.setDate(date.getDate() + days); return date; }; /** * add a time period to a specific date choice, * focus on the new input * @param config * @param id */ addTimetoDate(config: any, id: number) { config.timeList.push({literal: ''}); let selector = '[ng-reflect-name="dateTime_' + id + '_Choices_' + (config.timeList.length - 1) + '"]'; console.log('selector', selector); this.cd.detectChanges(); const elem = this.document.querySelector(selector); if (elem) { elem.focus(); } } /** * remove all input contents, does not reset to default */ emptyAll() { this.config.dateList.forEach(element => { element.literal = ''; element.timeList = ['', '', '']; }); this.config.timeList.forEach(element => { element.literal = ''; }); } /** * add all the dates between the start and end dates */ addIntervalOfDates() { let newIntervalArray = this.getDatesInrange(this.startDateInterval, this.endDateInterval, 1); console.log('newIntervalArray', newIntervalArray); const converted = []; newIntervalArray.forEach(element => { converted.push({literal: element, timeList: []}); }); this.config.dateList = [...new Set(converted)]; // add only dates that are not already present with a Set of unique items console.log('converted', converted); console.log('this.config.dateList', this.config.dateList); } getDatesInrange(d1, d2, interval) { d1 = new Date(d1); d2 = new Date(d2); var dates = []; while (+d1 < +d2) { dates.push(this.formateDate(d1)); d1.setDate(d1.getDate() + interval) } return dates.slice(0) } dayDiff(d1: Date, d2: Date): Number { console.log('Number(((d2.getTime()) - (d1.getTime()) / 31536000000))', Number(((d2.getTime()) - (d1.getTime()) / 31536000000))); return Number(((d2.getTime()) - (d1.getTime()) / 31536000000)); } /** * format a date object to the date format used by the inputs of type date * YYYY-MM-DD * @param date */ formateDate(date) { return [ date.getFullYear(), this.getDoubleDigits(date.getMonth() + 1), this.getDoubleDigits(date.getDate()), ].join('-') } getDoubleDigits(str) { return ("00" + str).slice(-2); } }