datepicker stub

datepicker.js

'use strict';
angular.module('roadatlasApp')
    .directive('datepicker', function (DateUtilities) {
        return {
            restrict: 'EA',
            templateUrl: 'views/directives/datepicker.html',
            replace: true,
            scope: {
                stopover: '=',
                stopovers: '=',
                stopoverIndex: '=',
                first: '='
            },
            link: function (scope, element, attrs) {
                scope.momentFormatOptions = {
                    sameDay: '[Today]',
                    nextDay: '[Tomorrow]',
                    nextWeek: moment.localeData().longDateFormat('L'),
                    lastDay: '[Yesterday]',
                    lastWeek: '[Last] dddd'
                };
                scope.toggleDatepicker = function () {
                    if (!scope.stopover.opened) scope.$parent.collapseAllCategories();
                    generateHighlightDays();
                    scope.stopover.opened = !scope.stopover.opened
                };
                scope.daysSelected = [];
                scope.highlightDays = [];
                var enumerateDaysBetweenDates = function (startDate, endDate) {
                    if (!startDate.isBefore(endDate)) {
                        var tempDate = endDate;
                        endDate = startDate;
                        startDate = tempDate;
                    }
                    var dates = [];
                    var currDate = startDate.clone().startOf('day');
                    var lastDate = endDate.clone().startOf('day');
                    while (currDate.add('days', 1).diff(lastDate) < 0) {
                        dates.push(currDate.clone());
                    }
                    return dates;
                };
                var generateHighlightDays = function () {
                    scope.highlightDays.length = 0;
                    R.forEach(function (stopover) {
                        var css = 'selected-unfocused';
                        var selectable = false;
                        if (stopover === scope.stopover) {
                            return;
                        }
                        if (stopover.arrival) {
                            scope.highlightDays.push({
                                date: stopover.arrival.clone(),
                                css: css,
                                selectable: selectable,
                                title: 'Arrival'
                            });
                        }
                        if (stopover.departure) {
                            scope.highlightDays.push({
                                date: stopover.departure.clone(),
                                css: css,
                                selectable: selectable,
                                title: 'Departure'
                            });
                        }
                        if ((stopover !== scope.stopover) && stopover.arrival && stopover.departure) {
                            R.forEach(function (date) {
                                scope.highlightDays.push({
                                    date: date.clone(),
                                    css: 'between',
                                    selectable: false,
                                    title: 'Departure'
                                });
                            }, enumerateDaysBetweenDates(stopover.arrival, stopover.departure));
                        }
                    }, scope.stopovers);
                    if (!scope.first && scope.stopovers[scope.stopoverIndex - 1].arrival) {
                        for (var lastDate = scope.stopovers[scope.stopoverIndex - 1].arrival.clone(); lastDate.date() >= 1; lastDate.subtract(1, 'days')) {
                            scope.highlightDays.push({date: lastDate.clone(), css: 'off', selectable: false});
                            if (lastDate.date() === 1) {
                                break;
                            }
                        }
                    }
                    scope.originalHighlightDays = scope.highlightDays.slice(0);
                    if (scope.stopover.arrival) {
                        scope.highlightDays.push({
                            date: scope.stopover.arrival.clone(),
                            css: 'selected-active',
                            selectable: true,
                            title: 'Arrival'
                        });
                    }
                    if (scope.stopover.departure) {
                        scope.highlightDays.push({
                            date: scope.stopover.departure.clone(),
                            css: 'selected-active',
                            selectable: true,
                            title: 'Arrival'
                        });
                    }
                    if (scope.stopover.departure && scope.stopover.arrival) {
                        R.forEach(function (date) {
                            scope.daysSelected.push(date.clone());
                        }, enumerateDaysBetweenDates(scope.stopover.arrival, scope.stopover.departure));
                    }
                };

                scope.selectDates = function (event, date) {
                    if (date.selectable) {
                        if (scope.first) {
                            scope.highlightDays = scope.originalHighlightDays.slice(0);
                            scope.daysSelected.forEach(function (selectedDate) {
                                selectedDate.selected = false;
                            });
                            scope.daysSelected = [];
                            scope.daysSelected.push(date);
                            scope.stopover.arrival = date;
                            scope.stopover.departure = date;
                            scope.highlightDays.push({
                                date: scope.stopover.arrival.clone(),
                                css: 'selected-active',
                                selectable: true,
                                title: 'Arrival'
                            });
                        } else {
                            if (scope.daysSelected.length === 1) {
                                if (!scope.daysSelected[0].isBefore(date)) {
                                    var tempDate = date;
                                    date = scope.daysSelected[0];
                                    scope.daysSelected[0] = tempDate;
                                }
                                scope.stopover.arrival = scope.daysSelected[0].clone();
                                scope.stopover.departure = date;

                                scope.daysSelected = enumerateDaysBetweenDates(scope.daysSelected[0], date);
                                scope.highlightDays = scope.originalHighlightDays.slice(0);
                                scope.highlightDays.push({
                                    date: scope.stopover.arrival.clone(),
                                    css: 'selected-active',
                                    selectable: true,
                                    title: 'Arrival'
                                });
                                scope.highlightDays.push({
                                    date: scope.stopover.departure.clone(),
                                    css: 'selected-active',
                                    selectable: true,
                                    title: 'Departure'
                                });
                            } else {
                                scope.highlightDays = scope.originalHighlightDays.slice(0);
                                scope.daysSelected.length = 0;
                                scope.stopover.arrival = date.clone();
                                scope.stopover.departure = date.clone();

                                scope.highlightDays.push({
                                    date: scope.stopover.arrival.clone(),
                                    css: 'selected-active',
                                    selectable: true,
                                    title: 'Arrival'
                                });
                                scope.daysSelected.push(date);
                            }
                        }
                        scope.selectedDate = date.calendar();
                    }
                };
                scope.$watch('stopovers[0].arrival', function () {
                    if (angular.isDefined(scope.stopovers)) {
                        scope.stopovers[0].departure = angular.copy(scope.stopovers[0].arrival);
                    }
                });
            }
        };
    });