funky-framadate-front/src/app/pages/dates/dates.component.ts

import {ChangeDetectorRef, Component, Inject, OnInit} from '@angular/core';
import {ConfigService} from '../../services/config.service';
import {BaseComponent} from '../base-page/base.component';
import {DOCUMENT} from '@angular/common';
import {MessageService} from "primeng/api";
import {defaultTimeOfDay} from "../../config/defaultConfigs";

@Component({
    selector: 'framadate-dates',
    templateUrl: './dates.component.html',
    styleUrls: ['./dates.component.scss']
})
export class DatesComponent extends BaseComponent implements OnInit {
    showDateInterval: boolean = true;
    startDateInterval: any;
    intervalDays: any;
    intervalDaysDefault: number = 7;
    endDateInterval: any;

    constructor(public config: ConfigService,
                private cd: ChangeDetectorRef,
                private messageService: MessageService,
                @Inject(DOCUMENT) private document: any
    ) {
        super(config);
    }

    countDays() {
        // 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();
        this.startDateInterval = dateJson.substring(0, 10);
        this.endDateInterval = this.addDaysToDate(this.intervalDaysDefault, dateCurrent).toISOString().substring(0, 10);
    }

    addDate() {
        this.config.dateList.push({
            literal: '',
            date_object: new Date(),
            timeList: []
        });
        let selector = '[ng-reflect-name="dateChoices_' + (this.config.dateList.length - 1) + '"]';
        this.cd.detectChanges();
        const elem = this.document.querySelector(selector);
        if (elem) {
            elem.focus();
        }
    }

    /**
     * change time spans
     */
    addTime() {
        this.config.timeList.push(
            {
                literal: '',
                timeList: [],
                date_object: new Date()
            }
        );
    }

    removeAllTimes() {
        this.config.timeList = [];
    }

    resetTimes() {
        this.config.timeList = defaultTimeOfDay;
    }

    /**
     * add some days to a date, to compute intervals
     * @param days
     * @param date
     */
    addDaysToDate(days: number, date: Date) {
        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) + '"]';
        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.date_object = new Date();
            element.timeList = ['', '', ''];
        });
        this.config.timeList.forEach(element => {
            element.literal = '';
        });
    }


    /**
     * add all the dates between the start and end dates in the interval section
     */
    addIntervalOfDates() {
        let newIntervalArray = this.getDatesInRange(this.startDateInterval, this.endDateInterval, 1);

        const converted = [];
        newIntervalArray.forEach(element => {
            converted.push({
                literal: element.literal,
                date_object: element.date_object,
                timeList: []
            });
        });
        this.config.dateList = [...new Set(converted)]; // add only dates that are not already present with a Set of unique items
        this.showDateInterval = false;

        this.messageService.add({
            severity: 'success',
            summary: 'Dates ajoutées',
            detail: `les dates ont été ajoutées aux réponses possibles`
        });

    }

    /**
     *
     * @param d1
     * @param d2
     * @param interval
     */
    getDatesInRange(d1: Date, d2: Date, interval: number) {
        d1 = new Date(d1);
        d2 = new Date(d2);
        const dates = [];
        while (+d1 < +d2) {
            dates.push({
                literal: this.formateDate(d1),
                date_object: d1
            });
            d1.setDate(d1.getDate() + interval)
        }
        return dates.slice(0);
    }

    /**
     * get the number of days between two dates
     * @param d1
     * @param d2
     */
    dayDiff(d1: Date, d2: Date): Number {
        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);
    }
}