var _createClass = function () { function defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } } return function (Constructor, protoProps, staticProps) { if (protoProps) defineProperties(Constructor.prototype, protoProps); if (staticProps) defineProperties(Constructor, staticProps); return Constructor; }; }(); var _get = function get(object, property, receiver) { if (object === null) object = Function.prototype; var desc = Object.getOwnPropertyDescriptor(object, property); if (desc === undefined) { var parent = Object.getPrototypeOf(object); if (parent === null) { return undefined; } else { return get(parent, property, receiver); } } else if ("value" in desc) { return desc.value; } else { var getter = desc.get; if (getter === undefined) { return undefined; } return getter.call(receiver); } }; function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } } function _possibleConstructorReturn(self, call) { if (!self) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return call && (typeof call === "object" || typeof call === "function") ? call : self; } function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function, not " + typeof superClass); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, enumerable: false, writable: true, configurable: true } }); if (superClass) Object.setPrototypeOf ? Object.setPrototypeOf(subClass, superClass) : subClass.__proto__ = superClass; } (function ($) { 'use strict'; var _defaults = { // the default output format for the input field value format: 'mmm dd, yyyy', // Used to create date object from current input string parse: null, // The initial date to view when first opened defaultDate: null, // Make the `defaultDate` the initial selected value setDefaultDate: false, disableWeekends: false, disableDayFn: null, // First day of week (0: Sunday, 1: Monday etc) firstDay: 0, // The earliest date that can be selected minDate: null, // Thelatest date that can be selected maxDate: null, // Number of years either side, or array of upper/lower range yearRange: 10, // used internally (don't config outside) minYear: 0, maxYear: 9999, minMonth: undefined, maxMonth: undefined, startRange: null, endRange: null, isRTL: false, // Render the month after year in the calendar title showMonthAfterYear: false, // Render days of the calendar grid that fall in the next or previous month showDaysInNextAndPreviousMonths: false, // Specify a DOM element to render the calendar in container: null, // internationalization i18n: { clear: 'Clear', today: 'Today', done: 'Ok', previousMonth: '‹', nextMonth: '›', months: ['January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December'], monthsShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], weekdaysShort: ['Sun', 'Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat'], weekdays: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'], weekdaysAbbrev: ['S', 'M', 'T', 'W', 'T', 'F', 'S'] }, // events array events: [], // callback function onSelect: null, onOpen: null, onClose: null, onDraw: null }; /** * @class * */ var Datepicker = function (_Component) { _inherits(Datepicker, _Component); /** * Construct Datepicker instance and set up overlay * @constructor * @param {Element} el * @param {Object} options */ function Datepicker(el, options) { _classCallCheck(this, Datepicker); var _this = _possibleConstructorReturn(this, (Datepicker.__proto__ || Object.getPrototypeOf(Datepicker)).call(this, Datepicker, el, options)); _this.el.M_Datepicker = _this; _this.options = $.extend({}, Datepicker.defaults, options); // Remove time component from minDate and maxDate options if (_this.options.minDate) _this.options.minDate.setHours(0, 0, 0, 0); if (_this.options.maxDate) _this.options.maxDate.setHours(0, 0, 0, 0); _this.id = M.guid(); _this._setupVariables(); _this._insertHTMLIntoDOM(); _this._setupModal(); _this._setupEventHandlers(); if (!_this.options.defaultDate) { _this.options.defaultDate = new Date(Date.parse(_this.el.value)); _this.options.setDefaultDate = true; } var defDate = _this.options.defaultDate; if (Datepicker._isDate(defDate)) { if (_this.options.setDefaultDate) { _this.setDate(defDate, true); } else { _this.gotoDate(defDate); } } else { _this.gotoDate(new Date()); } /** * Describes open/close state of datepicker * @type {Boolean} */ _this.isOpen = false; return _this; } _createClass(Datepicker, [{ key: 'destroy', /** * Teardown component */ value: function destroy() { this._removeEventHandlers(); this.modal.destroy(); $(this.modalEl).remove(); this.el.M_Datepicker = undefined; } }, { key: '_insertHTMLIntoDOM', value: function _insertHTMLIntoDOM() { this.clearBtn.innerHTML = this.options.i18n.clear; this.todayBtn.innerHTML = this.options.i18n.today; this.doneBtn.innerHTML = this.options.i18n.done; var containerEl = document.querySelector(this.options.container); if (this.options.container && !!containerEl) { this.$modalEl.appendTo(containerEl); } else { this.$modalEl.insertBefore(this.el); } } }, { key: '_setupModal', value: function _setupModal() { var _this2 = this; this.modalEl.id = 'modal-' + this.id; this.modal = M.Modal.init(this.modalEl, { onCloseEnd: function () { _this2.isOpen = false; } }); } }, { key: 'toString', value: function toString(format) { var _this3 = this; format = format || this.options.format; if (!Datepicker._isDate(this.date)) { return ''; } var formatArray = format.split(/(d{1,4}|m{1,4}|y{4}|yy|!.)/g); var formattedDate = formatArray.map(function (label) { if (_this3.formats[label]) { return _this3.formats[label](); } return label; }).join(''); return formattedDate; } }, { key: 'setDate', value: function setDate(date, preventOnSelect) { if (!date) { this.date = null; this._renderDateDisplay(); return this.draw(); } if (typeof date === 'string') { date = new Date(Date.parse(date)); } if (!Datepicker._isDate(date)) { return; } var min = this.options.minDate, max = this.options.maxDate; if (Datepicker._isDate(min) && date < min) { date = min; } else if (Datepicker._isDate(max) && date > max) { date = max; } this.date = new Date(date.getTime()); this._renderDateDisplay(); Datepicker._setToStartOfDay(this.date); this.gotoDate(this.date); if (!preventOnSelect && typeof this.options.onSelect === 'function') { this.options.onSelect.call(this, this.date); } } }, { key: 'setInputValue', value: function setInputValue() { this.el.value = this.toString(); this.$el.trigger('change', { firedBy: this }); } }, { key: '_renderDateDisplay', value: function _renderDateDisplay() { var displayDate = Datepicker._isDate(this.date) ? this.date : new Date(); var i18n = this.options.i18n; var day = i18n.weekdaysShort[displayDate.getDay()]; var month = i18n.monthsShort[displayDate.getMonth()]; var date = displayDate.getDate(); this.yearTextEl.innerHTML = displayDate.getFullYear(); this.dateTextEl.innerHTML = day + ', ' + month + ' ' + date; } /** * change view to a specific date */ }, { key: 'gotoDate', value: function gotoDate(date) { var newCalendar = true; if (!Datepicker._isDate(date)) { return; } if (this.calendars) { var firstVisibleDate = new Date(this.calendars[0].year, this.calendars[0].month, 1), lastVisibleDate = new Date(this.calendars[this.calendars.length - 1].year, this.calendars[this.calendars.length - 1].month, 1), visibleDate = date.getTime(); // get the end of the month lastVisibleDate.setMonth(lastVisibleDate.getMonth() + 1); lastVisibleDate.setDate(lastVisibleDate.getDate() - 1); newCalendar = visibleDate < firstVisibleDate.getTime() || lastVisibleDate.getTime() < visibleDate; } if (newCalendar) { this.calendars = [{ month: date.getMonth(), year: date.getFullYear() }]; // if (this.options.mainCalendar === 'right') { // this.calendars[0].month += 1 - this.options.numberOfMonths; // } } this.adjustCalendars(); } }, { key: 'adjustCalendars', value: function adjustCalendars() { this.calendars[0] = this.adjustCalendar(this.calendars[0]); // for (let c = 1; c < this.options.numberOfMonths; c++) { // this.calendars[c] = this.adjustCalendar({ // month: this.calendars[0].month + c, // year: this.calendars[0].year // }); // } this.draw(); } }, { key: 'adjustCalendar', value: function adjustCalendar(calendar) { if (calendar.month < 0) { calendar.year -= Math.ceil(Math.abs(calendar.month) / 12); calendar.month += 12; } if (calendar.month > 11) { calendar.year += Math.floor(Math.abs(calendar.month) / 12); calendar.month -= 12; } return calendar; } }, { key: 'nextMonth', value: function nextMonth() { this.calendars[0].month++; this.adjustCalendars(); } }, { key: 'prevMonth', value: function prevMonth() { this.calendars[0].month--; this.adjustCalendars(); } }, { key: 'render', value: function render(year, month, randId) { var opts = this.options, now = new Date(), days = Datepicker._getDaysInMonth(year, month), before = new Date(year, month, 1).getDay(), data = [], row = []; Datepicker._setToStartOfDay(now); if (opts.firstDay > 0) { before -= opts.firstDay; if (before < 0) { before += 7; } } var previousMonth = month === 0 ? 11 : month - 1, nextMonth = month === 11 ? 0 : month + 1, yearOfPreviousMonth = month === 0 ? year - 1 : year, yearOfNextMonth = month === 11 ? year + 1 : year, daysInPreviousMonth = Datepicker._getDaysInMonth(yearOfPreviousMonth, previousMonth); var cells = days + before, after = cells; while (after > 7) { after -= 7; } cells += 7 - after; var isWeekSelected = false; for (var i = 0, r = 0; i < cells; i++) { var day = new Date(year, month, 1 + (i - before)), isSelected = Datepicker._isDate(this.date) ? Datepicker._compareDates(day, this.date) : false, isToday = Datepicker._compareDates(day, now), hasEvent = opts.events.indexOf(day.toDateString()) !== -1 ? true : false, isEmpty = i < before || i >= days + before, dayNumber = 1 + (i - before), monthNumber = month, yearNumber = year, isStartRange = opts.startRange && Datepicker._compareDates(opts.startRange, day), isEndRange = opts.endRange && Datepicker._compareDates(opts.endRange, day), isInRange = opts.startRange && opts.endRange && opts.startRange < day && day < opts.endRange, isDisabled = opts.minDate && day < opts.minDate || opts.maxDate && day > opts.maxDate || opts.disableWeekends && Datepicker._isWeekend(day) || opts.disableDayFn && opts.disableDayFn(day); if (isEmpty) { if (i < before) { dayNumber = daysInPreviousMonth + dayNumber; monthNumber = previousMonth; yearNumber = yearOfPreviousMonth; } else { dayNumber = dayNumber - days; monthNumber = nextMonth; yearNumber = yearOfNextMonth; } } var dayConfig = { day: dayNumber, month: monthNumber, year: yearNumber, hasEvent: hasEvent, isSelected: isSelected, isToday: isToday, isDisabled: isDisabled, isEmpty: isEmpty, isStartRange: isStartRange, isEndRange: isEndRange, isInRange: isInRange, showDaysInNextAndPreviousMonths: opts.showDaysInNextAndPreviousMonths }; row.push(this.renderDay(dayConfig)); if (++r === 7) { data.push(this.renderRow(row, opts.isRTL, isWeekSelected)); row = []; r = 0; isWeekSelected = false; } } return this.renderTable(opts, data, randId); } }, { key: 'renderDay', value: function renderDay(opts) { var arr = []; var ariaSelected = 'false'; if (opts.isEmpty) { if (opts.showDaysInNextAndPreviousMonths) { arr.push('is-outside-current-month'); arr.push('is-selection-disabled'); } else { return '