primevue
Version:
[](https://opensource.org/licenses/MIT) [](https://badge.fury.io/js/primevue) [ • 108 kB
JavaScript
'use strict';
var utils = require('primevue/utils');
var OverlayEventBus = require('primevue/overlayeventbus');
var InputText = require('primevue/inputtext');
var Button = require('primevue/button');
var Ripple = require('primevue/ripple');
var vue = require('vue');
function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
var OverlayEventBus__default = /*#__PURE__*/_interopDefaultLegacy(OverlayEventBus);
var InputText__default = /*#__PURE__*/_interopDefaultLegacy(InputText);
var Button__default = /*#__PURE__*/_interopDefaultLegacy(Button);
var Ripple__default = /*#__PURE__*/_interopDefaultLegacy(Ripple);
var script = {
name: 'Calendar',
inheritAttrs: false,
emits: ['show', 'hide', 'month-change', 'year-change', 'date-select', 'update:modelValue', 'today-click', 'clear-click'],
props: {
modelValue: null,
selectionMode: {
type: String,
default: 'single'
},
dateFormat: {
type: String,
default: null
},
inline: {
type: Boolean,
default: false
},
showOtherMonths: {
type: Boolean,
default: true
},
selectOtherMonths: {
type: Boolean,
default: false
},
showIcon: {
type: Boolean,
default: false
},
icon: {
type: String,
default: 'pi pi-calendar'
},
numberOfMonths: {
type: Number,
default: 1
},
view: {
type: String,
default: 'date'
},
touchUI: {
type: Boolean,
default: false
},
monthNavigator: {
type: Boolean,
default: false
},
yearNavigator: {
type: Boolean,
default: false
},
yearRange: {
type: String,
default: null
},
panelClass: {
type: String,
default: null
},
minDate: {
type: Date,
value: null
},
maxDate: {
type: Date,
value: null
},
disabledDates: {
type: Array,
value: null
},
disabledDays: {
type: Array,
value: null
},
maxDateCount: {
type: Number,
value: null
},
showOnFocus: {
type: Boolean,
default: true
},
autoZIndex: {
type: Boolean,
default: true
},
baseZIndex: {
type: Number,
default: 0
},
showButtonBar: {
type: Boolean,
default: false
},
shortYearCutoff: {
type: String,
default: '+10'
},
showTime: {
type: Boolean,
default: false
},
timeOnly: {
type: Boolean,
default: false
},
hourFormat: {
type: String,
default: '24'
},
stepHour: {
type: Number,
default: 1
},
stepMinute: {
type: Number,
default: 1
},
stepSecond: {
type: Number,
default: 1
},
showSeconds: {
type: Boolean,
default: false
},
hideOnDateTimeSelect: {
type: Boolean,
default: false
},
timeSeparator: {
type: String,
default: ':'
},
showWeek: {
type: Boolean,
default: false
},
manualInput: {
type: Boolean,
default: true
},
appendTo: {
type: String,
default: 'body'
},
inputClass: null,
inputStyle: null,
class: null,
style: null
},
navigationState: null,
scrollHandler: null,
outsideClickListener: null,
maskClickListener: null,
resizeListener: null,
overlay: null,
mask: null,
timePickerTimer: null,
isKeydown: false,
created() {
this.updateCurrentMetaData();
},
mounted() {
if (this.inline && !this.$attrs.disabled) {
this.initFocusableCell();
}
},
updated() {
if (this.overlay) {
this.updateFocus();
}
if (this.$refs.input && this.selectionStart != null && this.selectionEnd != null) {
this.$refs.input.$el.selectionStart = this.selectionStart;
this.$refs.input.$el.selectionEnd = this.selectionEnd;
this.selectionStart = null;
this.selectionEnd = null;
}
},
beforeUnmount() {
if (this.timePickerTimer) {
clearTimeout(this.timePickerTimer);
}
if (this.mask) {
this.destroyMask();
}
this.unbindOutsideClickListener();
this.unbindResizeListener();
if (this.scrollHandler) {
this.scrollHandler.destroy();
this.scrollHandler = null;
}
if (this.overlay && this.autoZIndex) {
utils.ZIndexUtils.clear(this.overlay);
}
this.overlay = null;
},
data() {
return {
currentMonth: null,
currentYear: null,
currentHour: null,
currentMinute: null,
currentSecond: null,
pm: null,
focused: false,
overlayVisible: false
}
},
watch: {
modelValue() {
this.updateCurrentMetaData();
},
showTime() {
this.updateCurrentMetaData();
}
},
methods: {
isComparable() {
return this.modelValue != null && typeof this.modelValue !== 'string';
},
isSelected(dateMeta) {
if (!this.isComparable()) {
return false;
}
if (this.modelValue) {
if (this.isSingleSelection()) {
return this.isDateEquals(this.modelValue, dateMeta);
}
else if (this.isMultipleSelection()) {
let selected = false;
for (let date of this.modelValue) {
selected = this.isDateEquals(date, dateMeta);
if (selected) {
break;
}
}
return selected;
}
else if( this.isRangeSelection()) {
if (this.modelValue[1])
return this.isDateEquals(this.modelValue[0], dateMeta) || this.isDateEquals(this.modelValue[1], dateMeta) || this.isDateBetween(this.modelValue[0], this.modelValue[1], dateMeta);
else {
return this.isDateEquals(this.modelValue[0], dateMeta);
}
}
}
return false;
},
isMonthSelected(month) {
return this.isComparable() ? (this.modelValue.getMonth() === month && this.modelValue.getFullYear() === this.currentYear) : false;
},
isDateEquals(value, dateMeta) {
if (value)
return value.getDate() === dateMeta.day && value.getMonth() === dateMeta.month && value.getFullYear() === dateMeta.year;
else
return false;
},
isDateBetween(start, end, dateMeta) {
let between = false;
if (start && end) {
let date = new Date(dateMeta.year, dateMeta.month, dateMeta.day);
return start.getTime() <= date.getTime() && end.getTime() >= date.getTime();
}
return between;
},
getFirstDayOfMonthIndex(month, year) {
let day = new Date();
day.setDate(1);
day.setMonth(month);
day.setFullYear(year);
let dayIndex = day.getDay() + this.sundayIndex;
return dayIndex >= 7 ? dayIndex - 7 : dayIndex;
},
getDaysCountInMonth(month, year) {
return 32 - this.daylightSavingAdjust(new Date(year, month, 32)).getDate();
},
getDaysCountInPrevMonth(month, year) {
let prev = this.getPreviousMonthAndYear(month, year);
return this.getDaysCountInMonth(prev.month, prev.year);
},
getPreviousMonthAndYear(month, year) {
let m, y;
if (month === 0) {
m = 11;
y = year - 1;
}
else {
m = month - 1;
y = year;
}
return {'month':m, 'year': y};
},
getNextMonthAndYear(month, year) {
let m, y;
if (month === 11) {
m = 0;
y = year + 1;
}
else {
m = month + 1;
y = year;
}
return {'month':m,'year':y};
},
daylightSavingAdjust(date) {
if (!date) {
return null;
}
date.setHours(date.getHours() > 12 ? date.getHours() + 2 : 0);
return date;
},
isToday(today, day, month, year) {
return today.getDate() === day && today.getMonth() === month && today.getFullYear() === year;
},
isSelectable(day, month, year, otherMonth) {
let validMin = true;
let validMax = true;
let validDate = true;
let validDay = true;
if (otherMonth && !this.selectOtherMonths) {
return false;
}
if (this.minDate) {
if (this.minDate.getFullYear() > year) {
validMin = false;
}
else if (this.minDate.getFullYear() === year) {
if (this.minDate.getMonth() > month) {
validMin = false;
}
else if (this.minDate.getMonth() === month) {
if (this.minDate.getDate() > day) {
validMin = false;
}
}
}
}
if (this.maxDate) {
if (this.maxDate.getFullYear() < year) {
validMax = false;
}
else if (this.maxDate.getFullYear() === year) {
if (this.maxDate.getMonth() < month) {
validMax = false;
}
else if (this.maxDate.getMonth() === month) {
if (this.maxDate.getDate() < day) {
validMax = false;
}
}
}
}
if (this.disabledDates) {
validDate = !this.isDateDisabled(day,month,year);
}
if (this.disabledDays) {
validDay = !this.isDayDisabled(day,month,year);
}
return validMin && validMax && validDate && validDay;
},
onOverlayEnter(el) {
if (this.autoZIndex) {
if (this.touchUI)
utils.ZIndexUtils.set('modal', el, this.baseZIndex || this.$primevue.config.zIndex.modal);
else
utils.ZIndexUtils.set('overlay', el, this.baseZIndex || this.$primevue.config.zIndex.overlay);
}
this.alignOverlay();
this.$emit('show');
},
onOverlayEnterComplete() {
this.bindOutsideClickListener();
this.bindScrollListener();
this.bindResizeListener();
},
onOverlayAfterLeave(el) {
if (this.autoZIndex) {
utils.ZIndexUtils.clear(el);
}
},
onOverlayLeave() {
this.unbindOutsideClickListener();
this.unbindScrollListener();
this.unbindResizeListener();
this.$emit('hide');
if (this.mask) {
this.disableModality();
}
this.overlay = null;
},
onPrevButtonClick(event) {
if(this.showOtherMonths) {
this.navigationState = {backward: true, button: true};
this.navBackward(event);
}
},
onNextButtonClick(event) {
if(this.showOtherMonths) {
this.navigationState = {backward: false, button: true};
this.navForward(event);
}
},
navBackward(event) {
event.preventDefault();
if (!this.isEnabled()) {
return;
}
if (this.view === 'month') {
this.decrementYear();
}
else {
if (this.currentMonth === 0) {
this.currentMonth = 11;
this.decrementYear();
}
else {
this.currentMonth--;
}
this.$emit('month-change', {month: this.currentMonth, year: this.currentYear});
}
},
navForward(event) {
event.preventDefault();
if (!this.isEnabled()) {
return;
}
if (this.view === 'month') {
this.incrementYear();
}
else {
if (this.currentMonth === 11) {
this.currentMonth = 0;
this.incrementYear();
}
else {
this.currentMonth++;
}
this.$emit('month-change', {month: this.currentMonth , year: this.currentYear});
}
},
decrementYear() {
this.currentYear--;
},
incrementYear() {
this.currentYear++;
},
isEnabled() {
return !this.$attrs.disabled && !this.$attrs.readonly;
},
updateCurrentTimeMeta(date) {
let currentHour = date.getHours();
if (this.hourFormat === '12') {
this.pm = currentHour > 11;
if (currentHour >= 12)
currentHour = (currentHour == 12) ? 12 : currentHour - 12;
else
currentHour = (currentHour == 0) ? 12 : currentHour;
}
this.currentHour = Math.floor(currentHour / this.stepHour) * this.stepHour;
this.currentMinute = Math.floor(date.getMinutes() / this.stepMinute) * this.stepMinute;
this.currentSecond = Math.floor(date.getSeconds() / this.stepSecond) * this.stepSecond;
},
bindOutsideClickListener() {
if (!this.outsideClickListener) {
this.outsideClickListener = (event) => {
if (this.overlayVisible && this.isOutsideClicked(event)) {
this.overlayVisible = false;
}
};
document.addEventListener('mousedown', this.outsideClickListener);
}
},
unbindOutsideClickListener() {
if (this.outsideClickListener) {
document.removeEventListener('mousedown', this.outsideClickListener);
this.outsideClickListener = null;
}
},
bindScrollListener() {
if (!this.scrollHandler) {
this.scrollHandler = new utils.ConnectedOverlayScrollHandler(this.$refs.container, () => {
if (this.overlayVisible) {
this.overlayVisible = false;
}
});
}
this.scrollHandler.bindScrollListener();
},
unbindScrollListener() {
if (this.scrollHandler) {
this.scrollHandler.unbindScrollListener();
}
},
bindResizeListener() {
if (!this.resizeListener) {
this.resizeListener = () => {
if (this.overlayVisible) {
this.overlayVisible = false;
}
};
window.addEventListener('resize', this.resizeListener);
}
},
unbindResizeListener() {
if (this.resizeListener) {
window.removeEventListener('resize', this.resizeListener);
this.resizeListener = null;
}
},
isOutsideClicked(event) {
return !(this.$el.isSameNode(event.target) || this.isNavIconClicked(event) ||
this.$el.contains(event.target) || (this.overlay && this.overlay.contains(event.target)));
},
isNavIconClicked(event) {
return (utils.DomHandler.hasClass(event.target, 'p-datepicker-prev') || utils.DomHandler.hasClass(event.target, 'p-datepicker-prev-icon')
|| utils.DomHandler.hasClass(event.target, 'p-datepicker-next') || utils.DomHandler.hasClass(event.target, 'p-datepicker-next-icon'));
},
alignOverlay() {
if (this.touchUI) {
this.enableModality();
}
else if (this.overlay) {
if (this.appendDisabled) {
utils.DomHandler.relativePosition(this.overlay, this.$el);
}
else {
this.overlay.style.minWidth = utils.DomHandler.getOuterWidth(this.$el) + 'px';
utils.DomHandler.absolutePosition(this.overlay, this.$el);
}
}
},
onButtonClick() {
if (this.isEnabled()) {
if (!this.overlayVisible) {
this.$refs.input.$el.focus();
this.overlayVisible = true;
}
else {
this.overlayVisible = false;
}
}
},
isDateDisabled(day, month, year) {
if (this.disabledDates) {
for (let disabledDate of this.disabledDates) {
if (disabledDate.getFullYear() === year && disabledDate.getMonth() === month && disabledDate.getDate() === day) {
return true;
}
}
}
return false;
},
isDayDisabled(day, month, year) {
if (this.disabledDays) {
let weekday = new Date(year, month, day);
let weekdayNumber = weekday.getDay();
return this.disabledDays.indexOf(weekdayNumber) !== -1;
}
return false;
},
onMonthDropdownChange(value) {
this.currentMonth = parseInt(value);
this.$emit('month-change', {month: this.currentMonth + 1, year: this.currentYear});
},
onYearDropdownChange(value) {
this.currentYear = parseInt(value);
this.$emit('year-change', {month: this.currentMonth + 1, year: this.currentYear});
},
onDateSelect(event, dateMeta) {
if (this.$attrs.disabled || !dateMeta.selectable) {
return;
}
utils.DomHandler.find(this.overlay, '.p-datepicker-calendar td span:not(.p-disabled)').forEach(cell => cell.tabIndex = -1);
if (event) {
event.currentTarget.focus();
}
if (this.isMultipleSelection() && this.isSelected(dateMeta)) {
let newValue = this.modelValue.filter(date => !this.isDateEquals(date, dateMeta));
this.updateModel(newValue);
}
else {
if (this.shouldSelectDate(dateMeta)) {
if (dateMeta.otherMonth) {
this.currentMonth = dateMeta.month;
this.currentYear = dateMeta.year;
this.selectDate(dateMeta);
}
else {
this.selectDate(dateMeta);
}
}
}
if (this.isSingleSelection() && (!this.showTime || this.hideOnDateTimeSelect)) {
setTimeout(() => {
this.overlayVisible = false;
}, 150);
}
},
selectDate(dateMeta) {
let date = new Date(dateMeta.year, dateMeta.month, dateMeta.day);
if (this.showTime) {
if (this.hourFormat === '12' && this.pm && this.currentHour != 12)
date.setHours(this.currentHour + 12);
else
date.setHours(this.currentHour);
date.setMinutes(this.currentMinute);
date.setSeconds(this.currentSecond);
}
if (this.minDate && this.minDate > date) {
date = this.minDate;
this.currentHour = date.getHours();
this.currentMinute = date.getMinutes();
this.currentSecond = date.getSeconds();
}
if (this.maxDate && this.maxDate < date) {
date = this.maxDate;
this.currentHour = date.getHours();
this.currentMinute = date.getMinutes();
this.currentSecond = date.getSeconds();
}
let modelVal = null;
if (this.isSingleSelection()) {
modelVal = date;
}
else if (this.isMultipleSelection()) {
modelVal = this.modelValue ? [...this.modelValue, date] : [date];
}
else if (this.isRangeSelection()) {
if (this.modelValue && this.modelValue.length) {
let startDate = this.modelValue[0];
let endDate = this.modelValue[1];
if (!endDate && date.getTime() >= startDate.getTime()) {
endDate = date;
}
else {
startDate = date;
endDate = null;
}
modelVal = [startDate, endDate];
}
else {
modelVal = [date, null];
}
}
if (modelVal !== null) {
this.updateModel(modelVal);
}
this.$emit('date-select', date);
},
updateModel(value) {
this.$emit('update:modelValue', value);
},
shouldSelectDate() {
if (this.isMultipleSelection())
return this.maxDateCount != null ? this.maxDateCount > (this.modelValue ? this.modelValue.length : 0) : true;
else
return true;
},
isSingleSelection() {
return this.selectionMode === 'single';
},
isRangeSelection() {
return this.selectionMode === 'range';
},
isMultipleSelection() {
return this.selectionMode === 'multiple';
},
formatValue(value) {
if (typeof value === 'string') {
return value;
}
let formattedValue = '';
if (value) {
try {
if (this.isSingleSelection()) {
formattedValue = this.formatDateTime(value);
}
else if (this.isMultipleSelection()) {
for(let i = 0; i < value.length; i++) {
let dateAsString = this.formatDateTime(value[i]);
formattedValue += dateAsString;
if(i !== (value.length - 1)) {
formattedValue += ', ';
}
}
}
else if (this.isRangeSelection()) {
if (value && value.length) {
let startDate = value[0];
let endDate = value[1];
formattedValue = this.formatDateTime(startDate);
if (endDate) {
formattedValue += ' - ' + this.formatDateTime(endDate);
}
}
}
}
catch(err) {
formattedValue = value;
}
}
return formattedValue;
},
formatDateTime(date) {
let formattedValue = null;
if (date) {
if(this.timeOnly) {
formattedValue = this.formatTime(date);
}
else {
formattedValue = this.formatDate(date, this.datePattern);
if(this.showTime) {
formattedValue += ' ' + this.formatTime(date);
}
}
}
return formattedValue;
},
formatDate(date, format) {
if (!date) {
return '';
}
let iFormat;
const lookAhead = (match) => {
const matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) === match);
if (matches) {
iFormat++;
}
return matches;
},
formatNumber = (match, value, len) => {
let num = '' + value;
if (lookAhead(match)) {
while (num.length < len) {
num = '0' + num;
}
}
return num;
},
formatName = (match, value, shortNames, longNames) => {
return (lookAhead(match) ? longNames[value] : shortNames[value]);
};
let output = '';
let literal = false;
if (date) {
for (iFormat = 0; iFormat < format.length; iFormat++) {
if (literal) {
if (format.charAt(iFormat) === '\'' && !lookAhead('\'')) {
literal = false;
} else {
output += format.charAt(iFormat);
}
} else {
switch (format.charAt(iFormat)) {
case 'd':
output += formatNumber('d', date.getDate(), 2);
break;
case 'D':
output += formatName('D', date.getDay(), this.$primevue.config.locale.dayNamesShort, this.$primevue.config.locale.dayNames);
break;
case 'o':
output += formatNumber('o',
Math.round((
new Date(date.getFullYear(), date.getMonth(), date.getDate()).getTime() -
new Date(date.getFullYear(), 0, 0).getTime()) / 86400000), 3);
break;
case 'm':
output += formatNumber('m', date.getMonth() + 1, 2);
break;
case 'M':
output += formatName('M',date.getMonth(), this.$primevue.config.locale.monthNamesShort, this.$primevue.config.locale.monthNames);
break;
case 'y':
output += lookAhead('y') ? date.getFullYear() : (date.getFullYear() % 100 < 10 ? '0' : '') + (date.getFullYear() % 100);
break;
case '@':
output += date.getTime();
break;
case '!':
output += date.getTime() * 10000 + this.ticksTo1970;
break;
case '\'':
if (lookAhead('\'')) {
output += '\'';
} else {
literal = true;
}
break;
default:
output += format.charAt(iFormat);
}
}
}
}
return output;
},
formatTime(date) {
if (!date) {
return '';
}
let output = '';
let hours = date.getHours();
let minutes = date.getMinutes();
let seconds = date.getSeconds();
if (this.hourFormat === '12' && hours > 11 && hours !== 12) {
hours -= 12;
}
if (this.hourFormat === '12') {
output += hours === 0 ? 12 : (hours < 10) ? '0' + hours : hours;
}
else {
output += (hours < 10) ? '0' + hours : hours;
}
output += ':';
output += (minutes < 10) ? '0' + minutes : minutes;
if (this.showSeconds) {
output += ':';
output += (seconds < 10) ? '0' + seconds : seconds;
}
if (this.hourFormat === '12') {
output += date.getHours() > 11 ? ' PM' : ' AM';
}
return output;
},
onTodayButtonClick(event) {
let date = new Date();
let dateMeta = {
day: date.getDate(),
month: date.getMonth(),
year: date.getFullYear(),
otherMonth: date.getMonth() !== this.currentMonth || date.getFullYear() !== this.currentYear,
today: true,
selectable: true
};
this.onDateSelect(null, dateMeta);
this.$emit('today-click', date);
event.preventDefault();
},
onClearButtonClick(event) {
this.updateModel(null);
this.overlayVisible = false;
this.$emit('clear-click', event);
event.preventDefault();
},
onTimePickerElementMouseDown(event, type, direction) {
if (this.isEnabled()) {
this.repeat(event, null, type, direction);
event.preventDefault();
}
},
onTimePickerElementMouseUp(event) {
if (this.isEnabled()) {
this.clearTimePickerTimer();
this.updateModelTime();
event.preventDefault();
}
},
onTimePickerElementMouseLeave() {
this.clearTimePickerTimer();
},
repeat(event, interval, type, direction) {
let i = interval||500;
this.clearTimePickerTimer();
this.timePickerTimer = setTimeout(() => {
this.repeat(event, 100, type, direction);
}, i);
switch(type) {
case 0:
if (direction === 1)
this.incrementHour(event);
else
this.decrementHour(event);
break;
case 1:
if (direction === 1)
this.incrementMinute(event);
else
this.decrementMinute(event);
break;
case 2:
if (direction === 1)
this.incrementSecond(event);
else
this.decrementSecond(event);
break;
}
},
convertTo24Hour(hours, pm) {
if (this.hourFormat == '12') {
if (hours === 12) {
return (pm ? 12 : 0);
} else {
return (pm ? hours + 12 : hours);
}
}
return hours;
},
validateTime(hour, minute, second, pm) {
let value = this.modelValue;
const convertedHour = this.convertTo24Hour(hour, pm);
if (!this.isComparable()) {
return true;
}
if (this.isRangeSelection()) {
value = this.modelValue[1] || this.modelValue[0];
}
if (this.isMultipleSelection()) {
value = this.modelValue[this.modelValue.length - 1];
}
const valueDateString = value ? value.toDateString() : null;
if (this.minDate && valueDateString && this.minDate.toDateString() === valueDateString) {
if (this.minDate.getHours() > convertedHour) {
return false;
}
if (this.minDate.getHours() === convertedHour) {
if (this.minDate.getMinutes() > minute) {
return false;
}
if (this.minDate.getMinutes() === minute) {
if (this.minDate.getSeconds() > second) {
return false;
}
}
}
}
if (this.maxDate && valueDateString && this.maxDate.toDateString() === valueDateString) {
if (this.maxDate.getHours() < convertedHour) {
return false;
}
if (this.maxDate.getHours() === convertedHour) {
if (this.maxDate.getMinutes() < minute) {
return false;
}
if (this.maxDate.getMinutes() === minute) {
if (this.maxDate.getSeconds() < second) {
return false;
}
}
}
}
return true;
},
incrementHour(event) {
let prevHour = this.currentHour;
let newHour = this.currentHour + this.stepHour;
let newPM = this.pm;
if (this.hourFormat == '24')
newHour = (newHour >= 24) ? (newHour - 24) : newHour;
else if (this.hourFormat == '12') {
// Before the AM/PM break, now after
if (prevHour < 12 && newHour > 11) {
newPM= !this.pm;
}
newHour = (newHour >= 13) ? (newHour - 12) : newHour;
}
if (this.validateTime(newHour, this.currentMinute, this.currentSecond, newPM)) {
this.currentHour = newHour;
this.pm = newPM;
}
event.preventDefault();
},
decrementHour(event) {
let newHour = this.currentHour - this.stepHour;
let newPM = this.pm;
if (this.hourFormat == '24')
newHour = (newHour < 0) ? (24 + newHour) : newHour;
else if (this.hourFormat == '12') {
// If we were at noon/midnight, then switch
if (this.currentHour === 12) {
newPM = !this.pm;
}
newHour = (newHour <= 0) ? (12 + newHour) : newHour;
}
if (this.validateTime(newHour, this.currentMinute, this.currentSecond, newPM)) {
this.currentHour = newHour;
this.pm = newPM;
}
event.preventDefault();
},
incrementMinute(event) {
let newMinute = this.currentMinute + this.stepMinute;
if (this.validateTime(this.currentHour, newMinute, this.currentSecond, true)) {
this.currentMinute = (newMinute > 59) ? newMinute - 60 : newMinute;
}
event.preventDefault();
},
decrementMinute(event) {
let newMinute = this.currentMinute - this.stepMinute;
newMinute = (newMinute < 0) ? 60 + newMinute : newMinute;
if (this.validateTime(this.currentHour, newMinute, this.currentSecond, true)) {
this.currentMinute = newMinute;
}
event.preventDefault();
},
incrementSecond(event) {
let newSecond = this.currentSecond + this.stepSecond;
if (this.validateTime(this.currentHour, this.currentMinute, newSecond, true)) {
this.currentSecond = (newSecond > 59) ? newSecond - 60 : newSecond;
}
event.preventDefault();
},
decrementSecond(event) {
let newSecond = this.currentSecond - this.stepSecond;
newSecond = (newSecond < 0) ? 60 + newSecond : newSecond;
if (this.validateTime(this.currentHour, this.currentMinute, newSecond, true)) {
this.currentSecond = newSecond;
}
event.preventDefault();
},
updateModelTime() {
let value = this.isComparable() ? this.modelValue : new Date();
if (this.isRangeSelection()) {
value = this.modelValue[1] || this.modelValue[0];
}
if (this.isMultipleSelection()) {
value = this.modelValue[this.modelValue.length - 1];
}
value = value ? new Date(value.getTime()) : new Date();
if (this.hourFormat == '12') {
if (this.currentHour === 12)
value.setHours(this.pm ? 12 : 0);
else
value.setHours(this.pm ? this.currentHour + 12 : this.currentHour);
}
else {
value.setHours(this.currentHour);
}
value.setMinutes(this.currentMinute);
value.setSeconds(this.currentSecond);
if (this.isRangeSelection()) {
if (this.modelValue[1])
value = [this.modelValue[0], value];
else
value = [value, null];
}
if (this.isMultipleSelection()){
value = [...this.modelValue.slice(0, -1), value];
}
this.updateModel(value);
this.$emit('date-select', value);
},
toggleAMPM(event) {
this.pm = !this.pm;
this.updateModelTime();
event.preventDefault();
},
clearTimePickerTimer() {
if (this.timePickerTimer) {
clearInterval(this.timePickerTimer);
}
},
onMonthSelect(event, index) {
this.onDateSelect(event, {year: this.currentYear, month: index, day: 1, selectable: true});
},
enableModality() {
if (!this.mask) {
this.mask = document.createElement('div');
this.mask.style.zIndex = String(parseInt(this.overlay.style.zIndex, 10) - 1);
utils.DomHandler.addMultipleClasses(this.mask, 'p-datepicker-mask p-datepicker-mask-scrollblocker');
this.maskClickListener = () => {
this.overlayVisible = false;
};
this.mask.addEventListener('click', this.maskClickListener);
document.body.appendChild(this.mask);
utils.DomHandler.addClass(document.body, 'p-overflow-hidden');
setTimeout(() => {
utils.DomHandler.addClass(this.mask, 'p-component-overlay');
}, 1);
}
},
disableModality() {
if (this.mask) {
utils.DomHandler.addClass(this.mask, 'p-datepicker-mask-leave');
this.mask.addEventListener('transitionend', () => {
this.destroyMask();
});
}
},
destroyMask() {
this.mask.removeEventListener('click', this.maskClickListener);
this.maskClickListener = null;
document.body.removeChild(this.mask);
this.mask = null;
let bodyChildren = document.body.children;
let hasBlockerMasks;
for (let i = 0; i < bodyChildren.length; i++) {
let bodyChild = bodyChildren[i];
if(utils.DomHandler.hasClass(bodyChild, 'p-datepicker-mask-scrollblocker')) {
hasBlockerMasks = true;
break;
}
}
if (!hasBlockerMasks) {
utils.DomHandler.removeClass(document.body, 'p-overflow-hidden');
}
},
updateCurrentMetaData() {
const viewDate = this.viewDate;
this.currentMonth = viewDate.getMonth();
this.currentYear = viewDate.getFullYear();
if (this.showTime || this.timeOnly) {
this.updateCurrentTimeMeta(viewDate);
}
},
isValidSelection(value) {
let isValid = true;
if (this.isSingleSelection()) {
if (!this.isSelectable(value.getDate(), value.getMonth(), value.getFullYear(), false)) {
isValid = false;
}
} else if (value.every(v => this.isSelectable(v.getDate(), v.getMonth(), v.getFullYear(), false))) {
if (this.isRangeSelection()) {
isValid = value.length > 1 && value[1] > value[0] ? true : false;
}
}
return isValid;
},
parseValue(text) {
if (!text || text.trim().length === 0) {
return null;
}
let value;
if (this.isSingleSelection()) {
value = this.parseDateTime(text);
}
else if (this.isMultipleSelection()) {
let tokens = text.split(',');
value = [];
for (let token of tokens) {
value.push(this.parseDateTime(token.trim()));
}
}
else if (this.isRangeSelection()) {
let tokens = text.split(' - ');
value = [];
for (let i = 0; i < tokens.length; i++) {
value[i] = this.parseDateTime(tokens[i].trim());
}
}
return value;
},
parseDateTime(text) {
let date;
let parts = text.split(' ');
if (this.timeOnly) {
date = new Date();
this.populateTime(date, parts[0], parts[1]);
}
else {
const dateFormat = this.datePattern;
if (this.showTime) {
date = this.parseDate(parts[0], dateFormat);
this.populateTime(date, parts[1], parts[2]);
}
else {
date = this.parseDate(text, dateFormat);
}
}
return date;
},
populateTime(value, timeString, ampm) {
if (this.hourFormat == '12' && !ampm) {
throw 'Invalid Time';
}
this.pm = (ampm === 'PM' || ampm === 'pm');
let time = this.parseTime(timeString);
value.setHours(time.hour);
value.setMinutes(time.minute);
value.setSeconds(time.second);
},
parseTime(value) {
let tokens = value.split(':');
let validTokenLength = this.showSeconds ? 3 : 2;
let regex = (/^[0-9][0-9]$/);
if (tokens.length !== validTokenLength || !tokens[0].match(regex) || !tokens[1].match(regex) || (this.showSeconds && !tokens[2].match(regex))) {
throw "Invalid time";
}
let h = parseInt(tokens[0]);
let m = parseInt(tokens[1]);
let s = this.showSeconds ? parseInt(tokens[2]) : null;
if (isNaN(h) || isNaN(m) || h > 23 || m > 59 || (this.hourFormat == '12' && h > 12) || (this.showSeconds && (isNaN(s) || s > 59))) {
throw "Invalid time";
}
else {
if (this.hourFormat == '12' && h !== 12 && this.pm) {
h+= 12;
}
return {hour: h, minute: m, second: s};
}
},
parseDate(value, format) {
if (format == null || value == null) {
throw "Invalid arguments";
}
value = (typeof value === "object" ? value.toString() : value + "");
if (value === "") {
return null;
}
let iFormat, dim, extra,
iValue = 0,
shortYearCutoff = (typeof this.shortYearCutoff !== "string" ? this.shortYearCutoff : new Date().getFullYear() % 100 + parseInt(this.shortYearCutoff, 10)),
year = -1,
month = -1,
day = -1,
doy = -1,
literal = false,
date,
lookAhead = (match) => {
let matches = (iFormat + 1 < format.length && format.charAt(iFormat + 1) === match);
if (matches) {
iFormat++;
}
return matches;
},
getNumber = (match) => {
let isDoubled = lookAhead(match),
size = (match === "@" ? 14 : (match === "!" ? 20 :
(match === "y" && isDoubled ? 4 : (match === "o" ? 3 : 2)))),
minSize = (match === "y" ? size : 1),
digits = new RegExp("^\\d{" + minSize + "," + size + "}"),
num = value.substring(iValue).match(digits);
if (!num) {
throw "Missing number at position " + iValue;
}
iValue += num[ 0 ].length;
return parseInt(num[ 0 ], 10);
},
getName = (match, shortNames, longNames) => {
let index = -1;
let arr = lookAhead(match) ? longNames : shortNames;
let names = [];
for (let i = 0; i < arr.length; i++) {
names.push([i,arr[i]]);
}
names.sort((a,b) => {
return -(a[ 1 ].length - b[ 1 ].length);
});
for (let i = 0; i < names.length; i++) {
let name = names[i][1];
if (value.substr(iValue, name.length).toLowerCase() === name.toLowerCase()) {
index = names[i][0];
iValue += name.length;
break;
}
}
if (index !== -1) {
return index + 1;
} else {
throw "Unknown name at position " + iValue;
}
},
checkLiteral = () => {
if (value.charAt(iValue) !== format.charAt(iFormat)) {
throw "Unexpected literal at position " + iValue;
}
iValue++;
};
if (this.view === 'month') {
day = 1;
}
for (iFormat = 0; iFormat < format.length; iFormat++) {
if (literal) {
if (format.charAt(iFormat) === "'" && !lookAhead("'")) {
literal = false;
} else {
checkLiteral();
}
} else {
switch (format.charAt(iFormat)) {
case "d":
day = getNumber("d");
break;
case "D":
getName("D", this.$primevue.config.locale.dayNamesShort, this.$primevue.config.locale.dayNames);
break;
case "o":
doy = getNumber("o");
break;
case "m":
month = getNumber("m");
break;
case "M":
month = getName("M", this.$primevue.config.locale.monthNamesShort, this.$primevue.config.locale.monthNames);
break;
case "y":
year = getNumber("y");
break;
case "@":
date = new Date(getNumber("@"));
year = date.getFullYear();
month = date.getMonth() + 1;
day = date.getDate();
break;
case "!":
date = new Date((getNumber("!") - this.ticksTo1970) / 10000);
year = date.getFullYear();
month = date.getMonth() + 1;
day = date.getDate();
break;
case "'":
if (lookAhead("'")) {
checkLiteral();
} else {
literal = true;
}