/**
* The DatePickerSelect Utility
*
* @module aui-datepicker
*/
var Lang = A.Lang,
isArray = Lang.isArray,
isString = Lang.isString,
isBoolean = Lang.isBoolean,
isValue = Lang.isValue,
isNumber = Lang.isNumber,
isDate = Lang.isDate,
toInt = Lang.toInt,
DataType = A.DataType,
DateMath = DataType.DateMath,
nodeSetter = function(v) {
return A.one(v);
},
createButton = function() {
return A.Node.create(BUTTON_TPL);
},
createSelect = function() {
return A.Node.create(SELECT_TPL);
},
DOC = A.config.doc,
APPEND_ORDER = 'appendOrder',
BLANK = '',
BODY = 'body',
BOUNDING_BOX = 'boundingBox',
BUTTON = 'button',
BUTTON_NODE = 'buttonNode',
BUTTONITEM = 'buttonitem',
CALENDAR = 'calendar',
CHANGE = 'change',
CLEARFIX = 'clearfix',
CONTENT = 'content',
CONTENT_BOX = 'contentBox',
DATA_COMPONENT_ID = 'data-auiComponentID',
DATEPICKER = 'datepicker',
DAY = 'day',
DAY_NODE = 'dayNode',
DAY_NODE_NAME = 'dayNodeName',
DISABLED = 'disabled',
DISPLAY = 'display',
DOT = '.',
HELPER = 'helper',
KEY_PRESS = 'keypress',
LOCALE = 'locale',
MAX_DATE = 'maxDate',
MIN_DATE = 'minDate',
MONTH = 'month',
MONTH_NODE = 'monthNode',
MONTH_NODE_NAME = 'monthNodeName',
NAME = 'name',
NULLABLE_DAY = 'nullableDay',
NULLABLE_MONTH = 'nullableMonth',
NULLABLE_YEAR = 'nullableYear',
OPTION = 'option',
POPULATE_DAY = 'populateDay',
POPULATE_MONTH = 'populateMonth',
POPULATE_YEAR = 'populateYear',
SELECT = 'select',
SELECT_MULTIPLE_DATES = 'selectionMode',
SELECT_WRAPPER_NODE = 'selectWrapperNode',
SELECTED = 'selected',
SELECTED_DATES = 'selectedDates',
SPACE = ' ',
SRC_NODE = 'srcNode',
TRIGGER = 'trigger',
WRAPPER = 'wrapper',
YEAR = 'year',
YEAR_NODE = 'yearNode',
YEAR_NODE_NAME = 'yearNodeName',
YEAR_RANGE = 'yearRange',
getClassName = A.getClassName,
CSS_BUTTONITEM = getClassName(BUTTONITEM),
CSS_DATEPICKER = getClassName(DATEPICKER),
CSS_DATEPICKER_BUTTON_WRAPPER = getClassName(DATEPICKER, BUTTON, WRAPPER),
CSS_DATEPICKER_DAY = getClassName(DATEPICKER, DAY),
CSS_DATEPICKER_DISPLAY = getClassName(DATEPICKER, DISPLAY),
CSS_DATEPICKER_DISPLAY_CONTENT = getClassName(DATEPICKER, DISPLAY, CONTENT),
CSS_DATEPICKER_MONTH = getClassName(DATEPICKER, MONTH),
CSS_DATEPICKER_SELECT_WRAPPER = getClassName(DATEPICKER, SELECT, WRAPPER),
CSS_DATEPICKER_YEAR = getClassName(DATEPICKER, YEAR),
CSS_HELPER_CLEARFIX = getClassName(HELPER, CLEARFIX),
BUTTON_TPL = '<button />',
SELECT_TPL = '<select></select>',
SELECT_OPTION_TPL = '<option></option>',
WRAPPER_BUTTON_TPL = '<div class="' + CSS_DATEPICKER_BUTTON_WRAPPER + '"></div>',
WRAPPER_SELECT_TPL = '<div class=' + CSS_DATEPICKER_SELECT_WRAPPER + '></div>';
/**
* <p><img src="assets/images/aui-calendar-datepicker-select/main.png"/></p>
*
* A base class for DatePickerSelect, providing:
* <ul>
* <li>Widget Lifecycle (initializer, renderUI, bindUI, syncUI, destructor)</li>
* <li>Select a date from Calendar to select elements</li>
* </ul>
*
* Quick Example:<br/>
*
* <pre><code>var instance = new A.DatePickerSelect({
* srcNode: '#srcNodeId',
* calendar: {
* // locale: 'pt-br',
* dateFormat: '%m/%d/%y',
* yearRange: [ 1970, 2009 ]
* }
* }).render();
* </code></pre>
*
* Check the list of <a href="DatePickerSelect.html#configattributes">Configuration Attributes</a> available for
* DatePickerSelect.
*
* @class DatePickerSelect
* @param config {Object} Object literal specifying widget configuration properties.
* @constructor
* @extends Component
*/
var DatePickerSelect = A.Component.create({
/**
* Static property provides a string to identify the class.
*
* @property DatePickerSelect.NAME
* @type String
* @static
*/
NAME: DATEPICKER,
/**
* Static property used to define the default attribute
* configuration for the DatePickerSelect.
*
* @property DatePickerSelect.ATTRS
* @type Object
* @static
*/
ATTRS: {
/**
* The order the selects elements are appended to the
* <a href="DatePickerSelect.html#config_srcNode">srcNode</a>.
*
* @attribute appendOrder
* @default [ 'm', 'd', 'y' ]
* @type Array
*/
appendOrder: {
validator: isArray,
value: ['m', 'd', 'y']
},
/**
* DOM Node to display the button of the DatePickerSelect. If not
* specified try to query using HTML_PARSER an element inside
* contentBox which matches <code>aui-buttonitem</code>.
*
* @attribute buttonNode
* @default Generated div element.
* @type String
*/
buttonNode: {
setter: nodeSetter,
valueFn: createButton
},
/**
* <a href="Calendar.html">Calendar</a> configuration Object.</a>
*
* @attribute calendar
* @default {}
* @type Object
*/
calendar: {
setter: '_setCalendar'
},
/**
* DOM Node to display the day of the DatePickerSelect. If not
* specified try to query using HTML_PARSER an element inside
* contentBox which matches <code>aui-datepicker-year</code>.
*
* @attribute dayNode
* @default Generated div element.
* @type String | Node
*/
dayNode: {
setter: nodeSetter,
valueFn: createSelect
},
/**
* Name attribute used on the
* <a href="DatePickerSelect.html#config_dayNode">dayNode</a>.
*
* @attribute dayNodeName
* @default day
* @type String
*/
dayNodeName: {
valueFn: function() {
return this.get(DAY_NODE).get(NAME) || DAY;
}
},
/**
* Current locale
*
* @attribute locale
* @default en
* @type String
*/
locale: {
validator: 'isString',
value: 'en'
},
/**
* DOM Node to display the month of the DatePickerSelect. If not
* specified try to query using HTML_PARSER an element inside
* contentBox which matches <code>aui-datepicker-year</code>.
*
* @attribute monthNode
* @default Generated div element.
* @type String | Node
*/
monthNode: {
setter: nodeSetter,
valueFn: createSelect
},
/**
* Name attribute used on the
* <a href="DatePickerSelect.html#config_monthNode">monthNode</a>.
*
* @attribute monthNodeName
* @default month
* @type String
*/
monthNodeName: {
valueFn: function() {
return this.get(MONTH_NODE).get(NAME) || MONTH;
}
},
/**
* If true the select element for the day will be nullable
*
* @attribute nullableDay
* @default false
* @type boolean
*/
nullableDay: {
value: false
},
/**
* If true the select element for the month will be nullable
*
* @attribute nullableMonth
* @default false
* @type boolean
*/
nullableMonth: {
value: false
},
/**
* If true the select element for the year will be nullable
*
* @attribute nullableYear
* @default false
* @type boolean
*/
nullableYear: {
value: false
},
/**
* If true the select element for the days will be automatic
* populated.
*
* @attribute populateDay
* @default true
* @type boolean
*/
populateDay: {
value: true
},
/**
* If true the select element for the month will be automatic
* populated.
*
* @attribute populateMonth
* @default true
* @type boolean
*/
populateMonth: {
value: true
},
/**
* If true the select element for the year will be automatic
* populated.
*
* @attribute populateYear
* @default true
* @type boolean
*/
populateYear: {
value: true
},
/**
* DOM Node to display the selects of the DatePickerSelect. If not
* specified try to query using HTML_PARSER an element inside
* contentBox which matches <code>aui-datepicker-select-wrapper</code>.
*
* @attribute selectWrapperNode
* @default Generated div element.
* @type String
*/
selectWrapperNode: {
valueFn: function() {
return A.Node.create(WRAPPER_SELECT_TPL);
}
},
/**
* Trigger element to open the calendar. Inherited from
* <a href="OverlayContext.html#config_trigger">OverlayContext</a>.
*
* @attribute trigger
* @default Generated HTLM div element
* @type {Node | String}
*/
trigger: {
setter: function(value) {
if (value instanceof A.NodeList) {
return value;
}
else if (Lang.isString(value)) {
return A.all(value);
}
return new A.NodeList(value);
},
valueFn: function() {
return A.NodeList.create(WRAPPER_BUTTON_TPL);
}
},
/**
* DOM Node to display the year of the DatePickerSelect. If not
* specified try to query using HTML_PARSER an element inside
* contentBox which matches <code>aui-datepicker-year</code>.
*
* @attribute yearNode
* @default Generated div element.
* @type String | Node
*/
yearNode: {
setter: nodeSetter,
valueFn: createSelect
},
/**
* Name attribute used on the
* <a href="DatePickerSelect.html#config_yearNode">yearNode</a>.
*
* @attribute yearNodeName
* @default year
* @type String
*/
yearNodeName: {
valueFn: function() {
return this.get(YEAR_NODE).get(NAME) || YEAR;
}
},
/**
* Year range to be displayed on the year select element. By default
* it displays from -10 to +10 years from the current year.
*
* @attribute yearRange
* @default [ year - 10, year + 10 ]
* @type Array
*/
yearRange: {
validator: isArray,
valueFn: function() {
var year = new Date().getFullYear();
return [year - 10, year + 10];
}
}
},
/**
* Object hash, defining how attribute values are to be parsed from
* markup contained in the widget's content box.
*
* @property DatePickerSelect.HTML_PARSER
* @type Object
* @static
*/
HTML_PARSER: {
buttonNode: DOT + CSS_BUTTONITEM,
dayNode: DOT + CSS_DATEPICKER_DAY,
monthNode: DOT + CSS_DATEPICKER_MONTH,
selectWrapperNode: DOT + CSS_DATEPICKER_SELECT_WRAPPER,
trigger: DOT + CSS_DATEPICKER_BUTTON_WRAPPER,
yearNode: DOT + CSS_DATEPICKER_YEAR
},
EXTENDS: A.Component,
prototype: {
/**
* Bind the events on the DatePickerSelect UI. Lifecycle.
*
* @method bindUI
* @protected
*/
bindUI: function() {
var instance = this;
instance._bindSelectEvents();
instance.after('calendar:selectionChange', instance._afterSelectionChange);
},
/**
* Destructor lifecycle implementation for the Datepicker class.
* Purges events attached to the node (and all child nodes).
*
* @method destructor
* @protected
*/
destructor: function() {
var instance = this;
instance.datePicker.destroy();
},
/**
* Create the DOM structure for the DatePickerSelect. Lifecycle.
*
* @method renderUI
* @protected
*/
renderUI: function() {
var instance = this;
instance._renderElements();
instance._renderTriggerButton();
instance._renderCalendar();
},
/**
* Sync the DatePickerSelect UI. Lifecycle.
*
* @method syncUI
* @protected
*/
syncUI: function() {
var instance = this;
instance._populateSelects();
instance._syncSelectsUI();
},
/**
* Get current date.
*
* @method getCurrentDate
* @return {Date}
*/
getCurrentDate: function(offsetYear, offsetMonth, offsetDay) {
var instance = this;
var date = instance._normalizeYearMonth();
var newDay = date.day + toInt(offsetDay);
var newMonth = date.month + toInt(offsetMonth);
var newYear = date.year + toInt(offsetYear);
var totalMonthDays = instance.getDaysInMonth(date.year, newMonth);
if (newDay > totalMonthDays) {
newDay = totalMonthDays;
}
return DateMath.getDate(newYear, newMonth, newDay);
},
/**
* Fires when a date is selected on the Calendar.
*
* @method _afterSelectDate
* @param {Event} event
* @protected
*/
_afterSelectionChange: function(event) {
var instance = this;
var selectedDates = event.newSelection;
if (selectedDates.length) {
instance._syncSelectsUI(selectedDates[selectedDates.length - 1]);
}
},
/**
* Bind events on each select element (change, keypress, etc).
*
* @method _bindSelectEvents
* @protected
*/
_bindSelectEvents: function() {
var instance = this;
var selects = instance.get(SELECT_WRAPPER_NODE).all(SELECT);
selects.on(CHANGE, instance._onSelectChange, instance);
selects.on(KEY_PRESS, instance._onSelectChange, instance);
},
/**
* Gets an Array with the field elements in the correct order defined
* on <a href="DatePickerSelect.html#config_appendOrder">appendOrder</a>.
*
* @method _getAppendOrder
* @protected
* @return {Array}
*/
_getAppendOrder: function() {
var instance = this;
var appendOrder = instance.get(APPEND_ORDER);
var id = instance.get('id');
var mapping = {
d: instance.get(DAY_NODE),
m: instance.get(MONTH_NODE),
y: instance.get(YEAR_NODE)
};
var firstField = mapping[appendOrder[0]];
var secondField = mapping[appendOrder[1]];
var thirdField = mapping[appendOrder[2]];
firstField.setAttribute(DATA_COMPONENT_ID, id);
secondField.setAttribute(DATA_COMPONENT_ID, id);
thirdField.setAttribute(DATA_COMPONENT_ID, id);
return [firstField, secondField, thirdField];
},
/**
* Get the number of days in the passed year and month.
*
* @method getDaysInMonth
* @param {Number} year Year in the format YYYY.
* @param {Number} month 0 for January 11 for December.
* @return {Number}
*/
_getDaysInMonth: function(year, month) {
var instance = this;
var date = instance._normalizeYearMonth(year, month);
return DateMath.getDaysInMonth(date.year, date.month);
},
/**
* Get the locale map containing the respective values for the
* <a href="Widget.html#config_locale">locale</a> used.
*
* <pre><code>A.DataType.Date.Locale['pt-br'] = A.merge(
* A.DataType.Date.Locale['en'], {
* a: ['Dom', 'Seg', 'Ter', 'Qua', 'Qui', 'Fri', 'Sat'],
* A: ['Domingo','Segunda-feira','Terça-feira','Quarta-feira','Quinta-feira','Sexta-feira','Sabado'],
* b: ['Jan','Fev','Mar','Abr','Mai','Jun', 'Jul','Ago','Set','Out','Nov','Dez'],
* B: ['Janeiro','Fevereiro','Março','Abril','Maio','Junho', 'Julho','Agosto','Setembro','Outubro','Novembro','Dezembro'],
* c: '%a %d %b %Y %T %Z',
* p: ['AM', 'PM'],
* P: ['am', 'pm'],
* r: '%I:%M:%S %p',
* x: '%d/%m/%y',
* X: '%T'
* }
*);</code></pre>
*
* @method _getLocaleMap
* @protected
* @return {Object}
*/
_getLocaleMap: function() {
var instance = this;
return DataType.Date.Locale[instance.get(LOCALE)];
},
/**
* Returns an Object with the current day, month and year.
*
* @method _normalizeYearMonth
* @param {Number} year Year in the format YYYY.
* @param {Number} month 0 for January 11 for December.
* @param {Number} day
* @protected
* @return {Object}
*/
_normalizeYearMonth: function(year, month, day) {
var instance = this;
var selectedDates = instance.calendar.get(SELECTED_DATES);
var date = selectedDates.length ? selectedDates[0] : new Date();
if (!isValue(day)) {
day = date.getDate();
}
if (!isValue(month)) {
month = date.getMonth();
}
if (!isValue(year)) {
year = date.getFullYear();
}
return {
year: year,
month: month,
day: day
};
},
/**
* Fired on any select change.
*
* @method _onSelectChange
* @param {EventFacade} event
* @protected
*/
_onSelectChange: function(event) {
var instance = this;
var target = event.currentTarget || event.target;
var monthChanged = target.test(DOT + CSS_DATEPICKER_MONTH);
var currentDay = instance.get(DAY_NODE).val();
var currentMonth = instance.get(MONTH_NODE).val();
var currentYear = instance.get(YEAR_NODE).val();
var validDay = (currentDay > -1);
var validMonth = (currentMonth > -1);
var validYear = (currentYear > -1);
if (validMonth && validYear) {
var totalMonthDays = instance._getDaysInMonth(currentYear, currentMonth);
if (currentDay > totalMonthDays) {
currentDay = totalMonthDays;
}
}
var date = new Date(currentYear, currentMonth, currentDay);
if (!validDay || !validMonth || !validYear) {
instance.calendar._clearSelection();
}
else {
instance.calendar.set(SELECTED_DATES, date);
}
if (monthChanged) {
instance._uiSetCurrentMonth();
if (validDay) {
instance._selectCurrentDay(date);
}
}
},
/**
* Populate the day select element with the correct data.
*
* @method _populateDays
* @protected
*/
_populateDays: function() {
var instance = this;
if (instance.get(POPULATE_DAY)) {
instance._populateSelect(
instance.get(DAY_NODE),
1,
instance._getDaysInMonth(),
null,
null,
instance.get(NULLABLE_DAY)
);
}
},
/**
* Populate the month select element with the correct data.
*
* @method _populateMonths
* @protected
*/
_populateMonths: function() {
var instance = this;
var localeMap = instance._getLocaleMap();
var monthLabels = localeMap.B;
if (instance.get(POPULATE_MONTH)) {
instance._populateSelect(
instance.get(MONTH_NODE),
0, (monthLabels.length - 1),
monthLabels,
null,
instance.get(NULLABLE_MONTH)
);
}
},
/**
* Populate a select element with the data passed on the params.
*
* @method _populateSelect
* @param {HTMLSelectElement} select Select to be populated
* @param {Number} fromIndex Index to start
* @param {Number} toIndex Index to end
* @param {Object} values Object with labels to be used as content of each
* option. Optional.
* @protected
* @return {String}
*/
_populateSelect: function(select, fromIndex, toIndex, labels, values, nullable) {
var i = 0;
var index = fromIndex;
var selectEl = A.Node.getDOMNode(select);
select.empty();
labels = labels || [];
values = values || [];
if (nullable) {
selectEl.options[0] = new Option(BLANK, -1);
i++;
}
while (index <= toIndex) {
var value = values[index] || index,
label = labels[index] || index;
selectEl.options[i] = new Option(label, index);
i++;
index++;
}
},
/**
* Populate each select element with the correct data for the day, month
* and year.
*
* @method _populateSelects
* @protected
*/
_populateSelects: function() {
var instance = this;
instance._populateDays();
instance._populateMonths();
instance._populateYears();
// restricting dates based on the selects values
var monthOptions = instance.get(MONTH_NODE).all(OPTION);
var yearOptions = instance.get(YEAR_NODE).all(OPTION);
var mLength = monthOptions.size() - 1;
var yLength = yearOptions.size() - 1;
var firstMonth = monthOptions.item(0).val();
var firstYear = yearOptions.item(0).val();
var lastMonth = monthOptions.item(mLength).val();
var lastYear = yearOptions.item(yLength).val();
var maxMonthDays = instance._getDaysInMonth(lastYear, lastMonth);
var minDate = new Date(firstYear, firstMonth, 1);
var maxDate = new Date(lastYear, lastMonth, maxMonthDays);
instance.calendar.set(MAX_DATE, maxDate);
instance.calendar.set(MIN_DATE, minDate);
},
/**
* Populate the year select element with the correct data.
*
* @method _populateYears
* @protected
*/
_populateYears: function() {
var instance = this;
var yearRange = instance.get(YEAR_RANGE);
if (instance.get(POPULATE_YEAR)) {
instance._populateSelect(
instance.get(YEAR_NODE),
yearRange[0],
yearRange[1],
null,
null,
instance.get(NULLABLE_YEAR)
);
}
},
_renderCalendar: function() {
var instance = this;
var datePickerConfig = {
calendar: instance.get(CALENDAR),
trigger: instance.get(TRIGGER).item(0)
};
var datePicker = new A.DatePickerDeprecated(datePickerConfig).render();
datePicker.addTarget(instance);
instance.datePicker = datePicker;
instance.calendar = datePicker.calendar;
},
/**
* Render DOM elements for the DatePickerSelect.
*
* @method _renderElements
* @protected
*/
_renderElements: function() {
var instance = this;
var boundingBox = instance.get(BOUNDING_BOX);
var contentBox = instance.get(CONTENT_BOX);
var dayNode = instance.get(DAY_NODE);
var monthNode = instance.get(MONTH_NODE);
var yearNode = instance.get(YEAR_NODE);
dayNode.addClass(CSS_DATEPICKER_DAY);
monthNode.addClass(CSS_DATEPICKER_MONTH);
yearNode.addClass(CSS_DATEPICKER_YEAR);
boundingBox.addClass(CSS_DATEPICKER_DISPLAY);
boundingBox.addClass(CSS_HELPER_CLEARFIX);
contentBox.addClass(CSS_DATEPICKER_DISPLAY_CONTENT);
// setting name of the fields
monthNode.set(NAME, instance.get(MONTH_NODE_NAME));
yearNode.set(NAME, instance.get(YEAR_NODE_NAME));
dayNode.set(NAME, instance.get(DAY_NODE_NAME));
if (!monthNode.inDoc(A.config.doc)) {
// append elements
var selectWrapper = instance.get(SELECT_WRAPPER_NODE);
var orderedFields = instance._getAppendOrder();
// this textNode is to prevent layout shifting only
// simulate the default browser space between inputs/selects on re-append
var textNode = A.one(
DOC.createTextNode(SPACE)
);
selectWrapper.append(orderedFields[0]);
selectWrapper.append(textNode.clone());
selectWrapper.append(orderedFields[1]);
selectWrapper.append(textNode);
selectWrapper.append(orderedFields[2]);
contentBox.append(selectWrapper);
}
},
/**
* Render DOM element for the trigger button of the DatePickerSelect.
*
* @method _renderTriggerButton
* @protected
*/
_renderTriggerButton: function() {
var instance = this;
var trigger = instance.get(TRIGGER).item(0);
instance._buttonItem = new A.ButtonItem({
boundingBox: instance.get(BUTTON_NODE),
icon: CALENDAR
});
instance.get(CONTENT_BOX).append(trigger);
trigger.setAttribute(DATA_COMPONENT_ID, instance.get('id'));
if (trigger.test(DOT + CSS_DATEPICKER_BUTTON_WRAPPER)) {
// use Button if the user doesn't specify a trigger
instance._buttonItem.render(trigger);
}
},
/**
* Select the current day on the respective input field.
*
* @method _selectCurrentDay
* @protected
*/
_selectCurrentDay: function(currentDate) {
var instance = this;
instance.get(DAY_NODE).val(
String(currentDate.getDate())
);
},
/**
* Select the current month on the respective input field.
*
* @method _selectCurrentMonth
* @protected
*/
_selectCurrentMonth: function(currentDate) {
var instance = this;
instance.get(MONTH_NODE).val(
String(currentDate.getMonth())
);
instance._uiSetCurrentMonth();
},
/**
* Select the current year on the respective input field.
*
* @method _selectCurrentYear
* @protected
*/
_selectCurrentYear: function(currentDate) {
var instance = this;
instance.get(YEAR_NODE).val(
String(currentDate.getFullYear())
);
},
_setCalendar: function(val) {
var instance = this;
return A.merge({
selectedDates: new Date()
},
val || {}
);
},
/**
* Sync the UI of each DOM Select element.
*
* @method _syncSelectsUI
* @protected
*/
_syncSelectsUI: function(date) {
var instance = this;
var selectedDates = instance.calendar.get(SELECTED_DATES);
date = date || (selectedDates.length ? selectedDates[0] : new Date());
instance._selectCurrentMonth(date);
instance._selectCurrentDay(date);
instance._selectCurrentYear(date);
},
/**
* Fired after
* <a href="DatePickerSelect.html#config_currentMonth">currentMonth</a> is set.
*
* @method _uiSetCurrentMonth
* @param {EventFacade} event
* @protected
*/
_uiSetCurrentMonth: function(value) {
var instance = this;
instance._populateDays();
},
/**
* Fired after
* <a href="DatePickerSelect.html#config_disabled">disabled</a> is set.
*
* @method _afterDisabledChangeDatePicker
* @param {EventFacade} event
* @protected
*/
_uiSetDisabled: function(disabled) {
var instance = this;
DatePickerSelect.superclass._uiSetDisabled.apply(instance, arguments);
instance.get(DAY_NODE).set('disabled', disabled);
instance.get(MONTH_NODE).set('disabled', disabled);
instance.get(YEAR_NODE).set('disabled', disabled);
instance.datePicker.set(DISABLED, disabled);
instance._buttonItem.set(DISABLED, disabled);
instance._buttonItem.StateInteraction.set(DISABLED, disabled);
}
}
});
A.DatePickerSelect = DatePickerSelect;