/** * DevExtreme (ui/scheduler/ui.scheduler.navigator.js) * Version: 19.1.16 * Build date: Tue Oct 18 2022 * * Copyright (c) 2012 - 2022 Developer Express Inc. ALL RIGHTS RESERVED * Read about DevExtreme licensing here: https://js.devexpress.com/Licensing/ */ "use strict"; var $ = require("../../core/renderer"); var noop = require("../../core/utils/common").noop; var isNumeric = require("../../core/utils/type").isNumeric; var errors = require("../widget/ui.errors"); var dateUtils = require("../../core/utils/date"); var typeUtils = require("../../core/utils/type"); var extend = require("../../core/utils/extend").extend; var registerComponent = require("../../core/component_registrator"); var devices = require("../../core/devices"); var Widget = require("../widget/ui.widget"); var Button = require("../button"); var Calendar = require("../calendar"); var Popover = require("../popover"); var Popup = require("../popup"); var publisherMixin = require("./ui.scheduler.publisher_mixin"); var dateLocalization = require("../../localization/date"); var isDefined = require("../../core/utils/type").isDefined; var ELEMENT_CLASS = "dx-scheduler-navigator"; var CALENDAR_CLASS = "dx-scheduler-navigator-calendar"; var NEXT_BUTTON_CLASS = "dx-scheduler-navigator-next"; var CAPTION_BUTTON_CLASS = "dx-scheduler-navigator-caption"; var PREVIOUS_BUTTON_CLASS = "dx-scheduler-navigator-previous"; var CALENDAR_POPOVER_CLASS = "dx-scheduler-navigator-calendar-popover"; var MONDAY_INDEX = 1; var getDefaultFirstDayOfWeekIndex = function(shift) { return shift ? MONDAY_INDEX : dateLocalization.firstDayOfWeekIndex() }; var getDateMonthFormat = function(short) { return function(date) { var monthName = dateLocalization.getMonthNames(short ? "abbreviated" : "wide")[date.getMonth()]; return [dateLocalization.format(date, "day"), monthName].join(" ") } }; var getMonthYearFormat = function(date) { return dateLocalization.getMonthNames("abbreviated")[date.getMonth()] + " " + dateLocalization.format(date, "year") }; var getCaptionFormat = function getCaptionFormat(short, intervalCount, duration) { var dateMonthFormat = getDateMonthFormat(short); return function(date) { if (intervalCount > 1) { var lastIntervalDate = new Date(date); var defaultViewDuration = duration; lastIntervalDate.setDate(date.getDate() + defaultViewDuration - 1); var isDifferentMonthDates = date.getMonth() !== lastIntervalDate.getMonth(); var useShortFormat = isDifferentMonthDates || short; var firstWeekDateText = dateLocalization.format(date, isDifferentMonthDates ? getDateMonthFormat(useShortFormat) : "d"); var lastWeekDateText = dateLocalization.format(lastIntervalDate, getCaptionFormat(useShortFormat)); return firstWeekDateText + "-" + lastWeekDateText } return [dateMonthFormat(date), dateLocalization.format(date, "year")].join(" ") } }; var getWeekCaption = function(date, shift, rejectWeekend) { var firstDayOfWeek = this.option("firstDayOfWeek"); var firstDayOfWeekIndex = isDefined(firstDayOfWeek) ? firstDayOfWeek : getDefaultFirstDayOfWeekIndex(shift); if (0 === firstDayOfWeekIndex && rejectWeekend) { firstDayOfWeekIndex = MONDAY_INDEX } var firstWeekDate = dateUtils.getFirstWeekDate(date, firstDayOfWeekIndex); var weekendDuration = 2; if (rejectWeekend) { firstWeekDate = dateUtils.normalizeDateByWeek(firstWeekDate, date) } if (firstDayOfWeek >= 6 && rejectWeekend) { firstWeekDate.setDate(firstWeekDate.getDate() + (7 - firstDayOfWeek + 1)) } var lastWeekDate = new Date(firstWeekDate); var intervalCount = this.option("intervalCount"); shift = shift || 6; lastWeekDate = new Date(lastWeekDate.setDate(lastWeekDate.getDate() + (intervalCount > 1 ? 7 * (intervalCount - 1) + shift : shift))); if (lastWeekDate.getDay() % 6 === 0 && rejectWeekend) { lastWeekDate.setDate(lastWeekDate.getDate() + weekendDuration) } return { text: formatCaptionByMonths.call(this, lastWeekDate, firstWeekDate), startDate: firstWeekDate, endDate: lastWeekDate } }; var formatCaptionByMonths = function(lastDate, firstDate) { var isDifferentMonthDates = firstDate.getMonth() !== lastDate.getMonth(); var isDifferentYears = firstDate.getFullYear() !== lastDate.getFullYear(); var useShortFormat = isDifferentMonthDates || this.option("_useShortDateFormat"); var lastDateText; var firstDateText; if (isDifferentYears) { firstDateText = dateLocalization.format(firstDate, getCaptionFormat(true)); lastDateText = dateLocalization.format(lastDate, getCaptionFormat(true)) } else { firstDateText = dateLocalization.format(firstDate, isDifferentMonthDates ? getDateMonthFormat(useShortFormat) : "d"); lastDateText = dateLocalization.format(lastDate, getCaptionFormat(useShortFormat)) } return firstDateText + "-" + lastDateText }; var getMonthCaption = function(date) { var firstDate = new Date(dateUtils.getFirstMonthDate(date)); var lastDate = new Date(dateUtils.getLastMonthDate(firstDate)); var text; if (this.option("intervalCount") > 1) { lastDate = new Date(firstDate); lastDate.setMonth(firstDate.getMonth() + this.option("intervalCount") - 1); lastDate = new Date(dateUtils.getLastMonthDate(lastDate)); var isSameYear = firstDate.getYear() === lastDate.getYear(); var lastDateText = getMonthYearFormat(lastDate); var firstDateText = isSameYear ? dateLocalization.getMonthNames("abbreviated")[firstDate.getMonth()] : getMonthYearFormat(firstDate); text = firstDateText + "-" + lastDateText } else { text = dateLocalization.format(date, "monthandyear") } return { text: text, startDate: firstDate, endDate: lastDate } }; var dateGetter = function(date, offset) { return new Date(date[this.setter](date[this.getter]() + offset)) }; var getConfig = function(step) { var agendaDuration; switch (step) { case "day": return { duration: 1 * this.option("intervalCount"), setter: "setDate", getter: "getDate", getDate: dateGetter, getCaption: function(date) { var format = getCaptionFormat(false, this.option("intervalCount"), this._getConfig().duration); return { text: dateLocalization.format(date, format), startDate: date, endDate: date } } }; case "week": return { duration: 7 * this.option("intervalCount"), setter: "setDate", getter: "getDate", getDate: dateGetter, getCaption: getWeekCaption }; case "workWeek": return { duration: 7 * this.option("intervalCount"), setter: "setDate", getter: "getDate", getDate: dateGetter, getCaption: function(date) { return getWeekCaption.call(this, date, 4, true) } }; case "month": return { duration: 1 * this.option("intervalCount"), setter: "setMonth", getter: "getMonth", getDate: function(date, offset) { var currentDate = date.getDate(); date.setDate(1); date = dateGetter.call(this, date, offset); var lastDate = dateUtils.getLastMonthDay(date); date.setDate(currentDate < lastDate ? currentDate : lastDate); return date }, getCaption: getMonthCaption }; case "agenda": agendaDuration = this.invoke("getAgendaDuration"); agendaDuration = isNumeric(agendaDuration) && agendaDuration > 0 ? agendaDuration : 7; return { duration: agendaDuration, setter: "setDate", getter: "getDate", getDate: dateGetter, getCaption: function(date) { var format = getCaptionFormat(this.option("_useShortDateFormat")); var firstDate = new Date(date); var lastDate = new Date(date); var text; if (agendaDuration > 1) { lastDate.setDate(lastDate.getDate() + agendaDuration - 1); text = formatCaptionByMonths.call(this, lastDate, date) } else { text = dateLocalization.format(date, format) } return { text: text, startDate: firstDate, endDate: lastDate } } } } }; var SchedulerNavigator = Widget.inherit({ _getDefaultOptions: function() { return extend(this.callBase(), { date: new Date, displayedDate: void 0, step: "day", intervalCount: 1, min: void 0, max: void 0, firstDayOfWeek: void 0, _useShortDateFormat: false }) }, _defaultOptionsRules: function() { return this.callBase().concat([{ device: function() { return !devices.real().generic || devices.isSimulator() }, options: { _useShortDateFormat: true } }]) }, _optionChanged: function(args) { switch (args.name) { case "step": case "date": case "intervalCount": case "displayedDate": this._updateButtonsState(); this._renderCaption(); this._setCalendarOption("value", this.option("date")); break; case "min": case "max": this._updateButtonsState(); this._setCalendarOption(args.name, args.value); break; case "firstDayOfWeek": this._setCalendarOption(args.name, args.value); break; case "customizeDateNavigatorText": this._renderCaption(); break; case "tabIndex": case "focusStateEnabled": this._next.option(args.name, args.value); this._caption.option(args.name, args.value); this._prev.option(args.name, args.value); this._setCalendarOption(args.name, args.value); this.callBase(args); break; case "_useShortDateFormat": break; default: this.callBase(args) } }, _init: function() { this.callBase(); this.$element().addClass(ELEMENT_CLASS); this._initButtons() }, _initButtons: function() { var $next = $("