DefinitelyTyped/types/daterangepicker/daterangepicker-tests.ts

import moment = require('moment');
import daterangepicker = require('daterangepicker');

function tests_simple() {
    $('#daterange').daterangepicker();
    $('input[name="daterange"]')
        .daterangepicker({
            timePicker: true,
            timePickerIncrement: 30,
            locale: {
                format: 'MM/DD/YYYY h:mm A'
            },
            maxSpan: { days: 10 },
            applyButtonClasses: 'my-apply-class',
            cancelButtonClasses: 'my-cancel-class',
            showDropdowns: true,
            maxYear: 3000,
            minYear: 2000
        })
        .data('daterangepicker')
        .remove();

    $('#reportrange').daterangepicker({
        ranges: {
            Today: [moment(), moment()],
            Yesterday: [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
            'Last 7 Days': [moment().subtract(6, 'days'), moment()],
            'Last 30 Days': [moment().subtract(29, 'days'), moment()],
            'This Month': [moment().startOf('month'), moment().endOf('month')],
            'Last Month': [
                moment()
                    .subtract(1, 'month')
                    .startOf('month'),
                moment()
                    .subtract(1, 'month')
                    .endOf('month')
            ]
        }
    });

    $('input[name="datefilter"]').on('apply.daterangepicker', function(ev, picker) {
        $(this).val(
            `${picker.startDate.format('MM/DD/YYYY')} - ${picker.endDate.format('MM/DD/YYYY')}`
        );
    });

    $('input[name="datefilter"]').on('cancel.daterangepicker', function(ev, picker) {
        $(this).val('');
    });

    $('#demo').daterangepicker(
        {
            startDate: '05/06/2016',
            endDate: '05/12/2016'
        },
        (start: moment.Moment, end: moment.Moment, label: string) => {
            console.log(
                "New date range selected: ' + start.format('YYYY-MM-DD') + ' to ' + end.format('YYYY-MM-DD') + ' (predefined range: ' + label + ')"
            );
        }
    );

    $(() => {
        function cb(start: moment.Moment, end: moment.Moment) {
            $('#reportrange span').html(
                `${start.format('MMMM D, YYYY')} - ${end.format('MMMM D, YYYY')}`
            );
        }
        cb(moment().subtract(29, 'days'), moment());

        $('#reportrange').daterangepicker(
            {
                ranges: {
                    Today: [moment(), moment()],
                    Yesterday: [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                    'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                    'Last 30 Days': [moment().subtract(29, 'days'), moment()],
                    'This Month': [moment().startOf('month'), moment().endOf('month')],
                    'Last Month': [
                        moment()
                            .subtract(1, 'month')
                            .startOf('month'),
                        moment()
                            .subtract(1, 'month')
                            .endOf('month')
                    ]
                }
            },
            cb
        );

        $('#reportrange').daterangepicker(
            {
                ranges: {
                    Today: [moment(), moment()],
                    Yesterday: [moment().subtract(1, 'days'), moment().subtract(1, 'days')],
                    'Last 7 Days': [moment().subtract(6, 'days'), moment()],
                    'Last 30 Days': [moment().subtract(29, 'days'), moment()]
                },
                showCustomRangeLabel: false
            },
            cb
        );

        $('#endDate').daterangepicker({
            singleDatePicker: true,
            startDate: moment()
        });
    });
}

declare const host: HTMLElement;
function test_from_amd() {
    const picker = new daterangepicker(host);
    console.log(picker.startDate.format('YYYY-MM-DD'));
}