" )
.addClass( "ui-calendar-buttonpane ui-widget-content ui-helper-clearfix" );
this.buttonSet = $( "
" )
.addClass( "ui-calendar-buttonset" )
.appendTo( this.buttonPane );
this._createButtons();
},
_createButtons: function() {
var that = this,
buttons = this.options.buttons;
this.buttonPane.remove();
this.buttonSet.empty();
if ( $.isEmptyObject( buttons ) || ( $.isArray( buttons ) && !buttons.length ) ) {
this.element.removeClass( "ui-calendar-buttons" );
return;
}
$.each( buttons, function( name, props ) {
var click, buttonOptions;
props = $.isFunction( props ) ?
{ click: props, text: name } :
props;
// Default to a non-submitting button
props = $.extend( { type: "button" }, props );
// Change the context for the click callback to be the main element
click = props.click;
props.click = function() {
click.apply( that.buttonClickContext, arguments );
};
buttonOptions = {
icons: props.icons,
text: props.showText
};
delete props.icons;
delete props.showText;
$( "
", props )
.button( buttonOptions )
.appendTo( that.buttonSet );
} );
this.element.addClass( "ui-calendar-buttons" );
this.buttonPane.appendTo( this.element );
},
_refresh: function() {
this.viewDate.setTime( this.date.date().getTime() );
this.refresh();
},
// Refreshing the entire calendar during interaction confuses screen readers, specifically
// because the grid heading is marked up as a live region and will often not update if it's
// destroyed and recreated instead of just having its text change. Additionally, interacting
// with the prev and next links would cause loss of focus issues because the links being
// interacted with will disappear while focused.
refresh: function() {
this.labels = this.options.labels;
// Determine which day gridcell to focus after refresh
// TODO: Prevent disabled cells from being focused
if ( this.options.numberOfMonths === 1 ) {
this.grid = $( this._buildGrid() );
this.element.find( ".ui-calendar-title" ).html( this._buildTitle() );
this.element.find( ".ui-calendar-calendar" ).replaceWith( this.grid );
$( ".ui-calendar-prev", this.element ).attr( "title", this.labels.prevText )
.children().html( this.labels.prevText );
$( ".ui-calendar-next", this.element ).attr( "title", this.labels.nextText )
.children().html( this.labels.nextText );
this._createButtons();
} else {
this._refreshMultiplePicker();
}
},
_refreshMultiplePicker: function() {
var i = 0;
for ( ; i < this.options.numberOfMonths; i++ ) {
this.element.find( ".ui-calendar-title" ).eq( i ).html( this._buildTitle() );
this.element.find( ".ui-calendar-calendar" ).eq( i ).html( this._buildGrid() );
this.viewDate.adjust( "M", 1 );
}
this.viewDate.adjust( "M", -this.options.numberOfMonths );
// TODO: This assumes focus is on the first grid. For multi pickers, the widget needs
// to maintain the currently focused grid and base queries like this off of it.
this.element.find( ".ui-state-focus" ).not( ":first" ).removeClass( "ui-state-focus" );
},
_getTranslation: function( key ) {
return $( "
" ).text( this.labels[ key ] ).html();
},
_setHiddenPicker: function() {
this.element.attr( {
"aria-hidden": "true",
"aria-expanded": "false"
} );
},
value: function( value ) {
if ( arguments.length ) {
this.valueAsDate( this._parse( value ) );
} else {
return this._format( this.option( "value" ) );
}
},
valueAsDate: function( value ) {
if ( arguments.length ) {
this.option( "value", value );
} else {
return this.options.value;
}
},
_isValid: function( value ) {
if ( $.type( value ) !== "date" ) {
return false;
}
if ( $.type( this.options.max ) === "date" ) {
if ( value > this.options.max ) {
return false;
}
}
if ( $.type( this.options.min ) === "date" ) {
if ( value < this.options.min ) {
return false;
}
}
return true;
},
_destroy: function() {
this.element
.off( ".calendar" )
.removeClass( "ui-calendar ui-widget ui-widget-content ui-helper-clearfix ui-corner-all ui-calendar-multi" )
.removeAttr( "role aria-labelledby" )
.removeUniqueId()
.empty();
},
_setOptions: function( options ) {
var that = this,
refresh = false,
dateAttributes = false;
$.each( options, function( key, value ) {
that._setOption( key, value );
if ( key in that.refreshRelatedOptions ) {
refresh = true;
}
if ( key === "dateFormat" || key === "locale" ) {
dateAttributes = true;
}
} );
if ( dateAttributes ) {
this._setLocale( this.options.locale, this.options.dateFormat );
this.date.setAttributes( this._calendarDateOptions );
this.viewDate.setAttributes( this._calendarDateOptions );
}
if ( refresh ) {
this._refresh();
}
},
_setOption: function( key, value ) {
if ( key === "value" ) {
if ( this._isValid( value ) ) {
this.date.setTime( value.getTime() );
this._super( key, value );
}
return;
}
if ( key === "max" || key === "min" ) {
if ( $.type( value ) === "date" || value === null ) {
this._super( key, value );
}
return;
}
this._super( key, value );
if ( key === "buttons" ) {
this._createButtons();
}
if ( key === "disabled" ) {
this.element
.toggleClass( "ui-state-disabled", value )
.attr( "aria-disabled", value );
}
if ( key === "eachDay" ) {
this.viewDate.eachDay = value;
}
}
} );
} ) );