',\n monthHtml = void 0,\n yearHtml = void 0,\n prev = true,\n next = true;\n\n for (arr = [], i = 0; i < 12; i++) {\n arr.push('
');\n }\n\n monthHtml = '
';\n\n if ($.isArray(opts.yearRange)) {\n i = opts.yearRange[0];\n j = opts.yearRange[1] + 1;\n } else {\n i = year - opts.yearRange;\n j = 1 + year + opts.yearRange;\n }\n\n for (arr = []; i < j && i <= opts.maxYear; i++) {\n if (i >= opts.minYear) {\n arr.push(\"
\");\n }\n }\n\n yearHtml = \"
\";\n var leftArrow = '
';\n html += \"
\";\n html += '
';\n\n if (opts.showMonthAfterYear) {\n html += yearHtml + monthHtml;\n } else {\n html += monthHtml + yearHtml;\n }\n\n html += '
';\n\n if (isMinYear && (month === 0 || opts.minMonth >= month)) {\n prev = false;\n }\n\n if (isMaxYear && (month === 11 || opts.maxMonth <= month)) {\n next = false;\n }\n\n var rightArrow = '
';\n html += \"
\";\n return html += '
';\n }\n /**\n * refresh the HTML\n */\n\n }, {\n key: \"draw\",\n value: function draw(force) {\n if (!this.isOpen && !force) {\n return;\n }\n\n var opts = this.options,\n minYear = opts.minYear,\n maxYear = opts.maxYear,\n minMonth = opts.minMonth,\n maxMonth = opts.maxMonth,\n html = '',\n randId = void 0;\n\n if (this._y <= minYear) {\n this._y = minYear;\n\n if (!isNaN(minMonth) && this._m < minMonth) {\n this._m = minMonth;\n }\n }\n\n if (this._y >= maxYear) {\n this._y = maxYear;\n\n if (!isNaN(maxMonth) && this._m > maxMonth) {\n this._m = maxMonth;\n }\n }\n\n randId = 'datepicker-title-' + Math.random().toString(36).replace(/[^a-z]+/g, '').substr(0, 2);\n\n for (var c = 0; c < 1; c++) {\n this._renderDateDisplay();\n\n html += this.renderTitle(this, c, this.calendars[c].year, this.calendars[c].month, this.calendars[0].year, randId) + this.render(this.calendars[c].year, this.calendars[c].month, randId);\n }\n\n this.destroySelects();\n this.calendarEl.innerHTML = html; // Init Materialize Select\n\n var yearSelect = this.calendarEl.querySelector('.orig-select-year');\n var monthSelect = this.calendarEl.querySelector('.orig-select-month');\n M.FormSelect.init(yearSelect, {\n classes: 'select-year',\n dropdownOptions: {\n container: document.body,\n constrainWidth: false\n }\n });\n M.FormSelect.init(monthSelect, {\n classes: 'select-month',\n dropdownOptions: {\n container: document.body,\n constrainWidth: false\n }\n }); // Add change handlers for select\n\n yearSelect.addEventListener('change', this._handleYearChange.bind(this));\n monthSelect.addEventListener('change', this._handleMonthChange.bind(this));\n\n if (typeof this.options.onDraw === 'function') {\n this.options.onDraw(this);\n }\n }\n /**\n * Setup Event Handlers\n */\n\n }, {\n key: \"_setupEventHandlers\",\n value: function _setupEventHandlers() {\n this._handleInputKeydownBound = this._handleInputKeydown.bind(this);\n this._handleInputClickBound = this._handleInputClick.bind(this);\n this._handleInputChangeBound = this._handleInputChange.bind(this);\n this._handleCalendarClickBound = this._handleCalendarClick.bind(this);\n this._finishSelectionBound = this._finishSelection.bind(this);\n this._handleMonthChange = this._handleMonthChange.bind(this);\n this._closeBound = this.close.bind(this);\n this.el.addEventListener('click', this._handleInputClickBound);\n this.el.addEventListener('keydown', this._handleInputKeydownBound);\n this.el.addEventListener('change', this._handleInputChangeBound);\n this.calendarEl.addEventListener('click', this._handleCalendarClickBound);\n this.doneBtn.addEventListener('click', this._finishSelectionBound);\n this.cancelBtn.addEventListener('click', this._closeBound);\n\n if (this.options.showClearBtn) {\n this._handleClearClickBound = this._handleClearClick.bind(this);\n this.clearBtn.addEventListener('click', this._handleClearClickBound);\n }\n }\n }, {\n key: \"_setupVariables\",\n value: function _setupVariables() {\n var _this56 = this;\n\n this.$modalEl = $(Datepicker._template);\n this.modalEl = this.$modalEl[0];\n this.calendarEl = this.modalEl.querySelector('.datepicker-calendar');\n this.yearTextEl = this.modalEl.querySelector('.year-text');\n this.dateTextEl = this.modalEl.querySelector('.date-text');\n\n if (this.options.showClearBtn) {\n this.clearBtn = this.modalEl.querySelector('.datepicker-clear');\n }\n\n this.doneBtn = this.modalEl.querySelector('.datepicker-done');\n this.cancelBtn = this.modalEl.querySelector('.datepicker-cancel');\n this.formats = {\n d: function d() {\n return _this56.date.getDate();\n },\n dd: function dd() {\n var d = _this56.date.getDate();\n\n return (d < 10 ? '0' : '') + d;\n },\n ddd: function ddd() {\n return _this56.options.i18n.weekdaysShort[_this56.date.getDay()];\n },\n dddd: function dddd() {\n return _this56.options.i18n.weekdays[_this56.date.getDay()];\n },\n m: function m() {\n return _this56.date.getMonth() + 1;\n },\n mm: function mm() {\n var m = _this56.date.getMonth() + 1;\n return (m < 10 ? '0' : '') + m;\n },\n mmm: function mmm() {\n return _this56.options.i18n.monthsShort[_this56.date.getMonth()];\n },\n mmmm: function mmmm() {\n return _this56.options.i18n.months[_this56.date.getMonth()];\n },\n yy: function yy() {\n return ('' + _this56.date.getFullYear()).slice(2);\n },\n yyyy: function yyyy() {\n return _this56.date.getFullYear();\n }\n };\n }\n /**\n * Remove Event Handlers\n */\n\n }, {\n key: \"_removeEventHandlers\",\n value: function _removeEventHandlers() {\n this.el.removeEventListener('click', this._handleInputClickBound);\n this.el.removeEventListener('keydown', this._handleInputKeydownBound);\n this.el.removeEventListener('change', this._handleInputChangeBound);\n this.calendarEl.removeEventListener('click', this._handleCalendarClickBound);\n }\n }, {\n key: \"_handleInputClick\",\n value: function _handleInputClick() {\n this.open();\n }\n }, {\n key: \"_handleInputKeydown\",\n value: function _handleInputKeydown(e) {\n if (e.which === M.keys.ENTER) {\n e.preventDefault();\n this.open();\n }\n }\n }, {\n key: \"_handleCalendarClick\",\n value: function _handleCalendarClick(e) {\n if (!this.isOpen) {\n return;\n }\n\n var $target = $(e.target);\n\n if (!$target.hasClass('is-disabled')) {\n if ($target.hasClass('datepicker-day-button') && !$target.hasClass('is-empty') && !$target.parent().hasClass('is-disabled')) {\n this.setDate(new Date(e.target.getAttribute('data-year'), e.target.getAttribute('data-month'), e.target.getAttribute('data-day')));\n\n if (this.options.autoClose) {\n this._finishSelection();\n }\n } else if ($target.closest('.month-prev').length) {\n this.prevMonth();\n } else if ($target.closest('.month-next').length) {\n this.nextMonth();\n }\n }\n }\n }, {\n key: \"_handleClearClick\",\n value: function _handleClearClick() {\n this.date = null;\n this.setInputValue();\n this.close();\n }\n }, {\n key: \"_handleMonthChange\",\n value: function _handleMonthChange(e) {\n this.gotoMonth(e.target.value);\n }\n }, {\n key: \"_handleYearChange\",\n value: function _handleYearChange(e) {\n this.gotoYear(e.target.value);\n }\n /**\n * change view to a specific month (zero-index, e.g. 0: January)\n */\n\n }, {\n key: \"gotoMonth\",\n value: function gotoMonth(month) {\n if (!isNaN(month)) {\n this.calendars[0].month = parseInt(month, 10);\n this.adjustCalendars();\n }\n }\n /**\n * change view to a specific full year (e.g. \"2012\")\n */\n\n }, {\n key: \"gotoYear\",\n value: function gotoYear(year) {\n if (!isNaN(year)) {\n this.calendars[0].year = parseInt(year, 10);\n this.adjustCalendars();\n }\n }\n }, {\n key: \"_handleInputChange\",\n value: function _handleInputChange(e) {\n var date = void 0; // Prevent change event from being fired when triggered by the plugin\n\n if (e.firedBy === this) {\n return;\n }\n\n if (this.options.parse) {\n date = this.options.parse(this.el.value, this.options.format);\n } else {\n date = new Date(Date.parse(this.el.value));\n }\n\n if (Datepicker._isDate(date)) {\n this.setDate(date);\n }\n }\n }, {\n key: \"renderDayName\",\n value: function renderDayName(opts, day, abbr) {\n day += opts.firstDay;\n\n while (day >= 7) {\n day -= 7;\n }\n\n return abbr ? opts.i18n.weekdaysAbbrev[day] : opts.i18n.weekdays[day];\n }\n /**\n * Set input value to the selected date and close Datepicker\n */\n\n }, {\n key: \"_finishSelection\",\n value: function _finishSelection() {\n this.setInputValue();\n this.close();\n }\n /**\n * Open Datepicker\n */\n\n }, {\n key: \"open\",\n value: function open() {\n if (this.isOpen) {\n return;\n }\n\n this.isOpen = true;\n\n if (typeof this.options.onOpen === 'function') {\n this.options.onOpen.call(this);\n }\n\n this.draw();\n this.modal.open();\n return this;\n }\n /**\n * Close Datepicker\n */\n\n }, {\n key: \"close\",\n value: function close() {\n if (!this.isOpen) {\n return;\n }\n\n this.isOpen = false;\n\n if (typeof this.options.onClose === 'function') {\n this.options.onClose.call(this);\n }\n\n this.modal.close();\n return this;\n }\n }], [{\n key: \"init\",\n value: function init(els, options) {\n return _get(Datepicker.__proto__ || Object.getPrototypeOf(Datepicker), \"init\", this).call(this, this, els, options);\n }\n }, {\n key: \"_isDate\",\n value: function _isDate(obj) {\n return /Date/.test(Object.prototype.toString.call(obj)) && !isNaN(obj.getTime());\n }\n }, {\n key: \"_isWeekend\",\n value: function _isWeekend(date) {\n var day = date.getDay();\n return day === 0 || day === 6;\n }\n }, {\n key: \"_setToStartOfDay\",\n value: function _setToStartOfDay(date) {\n if (Datepicker._isDate(date)) date.setHours(0, 0, 0, 0);\n }\n }, {\n key: \"_getDaysInMonth\",\n value: function _getDaysInMonth(year, month) {\n return [31, Datepicker._isLeapYear(year) ? 29 : 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31][month];\n }\n }, {\n key: \"_isLeapYear\",\n value: function _isLeapYear(year) {\n // solution by Matti Virkkunen: http://stackoverflow.com/a/4881951\n return year % 4 === 0 && year % 100 !== 0 || year % 400 === 0;\n }\n }, {\n key: \"_compareDates\",\n value: function _compareDates(a, b) {\n // weak date comparison (use setToStartOfDay(date) to ensure correct result)\n return a.getTime() === b.getTime();\n }\n }, {\n key: \"_setToStartOfDay\",\n value: function _setToStartOfDay(date) {\n if (Datepicker._isDate(date)) date.setHours(0, 0, 0, 0);\n }\n /**\n * Get Instance\n */\n\n }, {\n key: \"getInstance\",\n value: function getInstance(el) {\n var domElem = !!el.jquery ? el[0] : el;\n return domElem.M_Datepicker;\n }\n }, {\n key: \"defaults\",\n get: function get() {\n return _defaults;\n }\n }]);\n\n return Datepicker;\n }(Component);\n\n Datepicker._template = ['