Datepicker: Use Globalize 1.0.0

- Fix merge conflict in value method
- Fix common unit tests
- Fix calendar localization tests
- Fix rebase regression: labels update on refresh
- Add new pass through options
- lint fixes
This commit is contained in:
Felix Nagel 2015-04-30 13:06:56 +02:00
parent e0acb2da48
commit 8732ff7a8c
5 changed files with 45 additions and 45 deletions

View File

@ -1,16 +1,15 @@
define( [ TestHelpers.commonWidgetTests( "calendar", {
"lib/common",
"ui/calendar",
"globalize-locales"
], function( common ) {
common.testWidget( "calendar", {
defaults: { defaults: {
buttons: [], buttons: [],
classes: {},
dateFormat: { date: "short" },
disabled: false, disabled: false,
eachDay: $.noop, eachDay: $.noop,
labels: {
"datePickerRole": "date picker",
"nextText": "Next",
"prevText": "Prev",
"weekHeader": "Wk"
},
locale: "en",
max: null, max: null,
min: null, min: null,
numberOfMonths: 1, numberOfMonths: 1,
@ -22,5 +21,3 @@ common.testWidget( "calendar", {
select: null select: null
} }
}); });
} );

View File

@ -85,12 +85,18 @@ test( "base structure", function() {
test( "Localization", function() { test( "Localization", function() {
expect( 10 ); expect( 10 );
var defaultLocale = Globalize.locale(), var element = $( "#calendar" ),
element = $( "#calendar" ),
date = new Date( 2014, 0, 1 ), date = new Date( 2014, 0, 1 ),
initCalendar = function() { optionsDe = {
locale: "de",
labels: {
"nextText": "Vor",
"prevText": "Zurück"
}
},
initCalendar = function( options ) {
element element
.calendar() .calendar( options )
.calendar( "valueAsDate", date ); .calendar( "valueAsDate", date );
}, },
testLocalization = function( message ) { testLocalization = function( message ) {
@ -108,26 +114,23 @@ test( "Localization", function() {
); );
equal( equal(
element.find( ".ui-calendar-prev" ).text(), element.find( ".ui-calendar-prev" ).text(),
"<Zurück", message + "header prev" "Zurück", message + "header prev"
); );
equal( equal(
element.find( ".ui-calendar-next" ).text(), element.find( ".ui-calendar-next" ).text(),
"Vor>", message + "header next" "Vor", message + "header next"
); );
}; };
Globalize.locale( "de" ); initCalendar( optionsDe );
initCalendar();
testLocalization( "Init: " ); testLocalization( "Init: " );
element.calendar( "destroy" ); element.calendar( "destroy" );
Globalize.locale( defaultLocale.locale ); initCalendar( {} );
initCalendar(); element
Globalize.locale( "de" ); .calendar( "option", optionsDe )
element.calendar( "refresh" ); .calendar( "refresh" );
testLocalization( "After init: " ); testLocalization( "After init: " );
Globalize.locale( defaultLocale.locale );
}); });
asyncTest( "keyboard handling", function() { asyncTest( "keyboard handling", function() {

View File

@ -1,17 +1,16 @@
define( [ TestHelpers.commonWidgetTests( "datepicker", {
"lib/common",
"ui/datepicker",
"globalize-locales"
], function( common ) {
common.testWidget( "datepicker", {
defaults: { defaults: {
appendTo: null, appendTo: null,
buttons: [], buttons: [],
classes: {},
dateFormat: { date: "short" },
disabled: false, disabled: false,
eachDay: $.noop, eachDay: $.noop,
labels: {
"datePickerRole": "date picker",
"nextText": "Next",
"prevText": "Prev",
"weekHeader": "Wk"
},
locale: "en",
max: null, max: null,
min: null, min: null,
numberOfMonths: 1, numberOfMonths: 1,
@ -31,5 +30,3 @@ common.testWidget( "datepicker", {
select: null select: null
} }
}); });
} );

View File

@ -180,6 +180,7 @@ return $.widget( "ui.calendar", {
var globalize = new Globalize( locale ), var globalize = new Globalize( locale ),
weekdayShortFormatter = globalize.dateFormatter({ pattern: "EEEEEE" }), weekdayShortFormatter = globalize.dateFormatter({ pattern: "EEEEEE" }),
weekdayNarrowFormatter = globalize.dateFormatter({ pattern: "EEEEE" }); weekdayNarrowFormatter = globalize.dateFormatter({ pattern: "EEEEE" });
this._format = globalize.dateFormatter({ date: "short" }); this._format = globalize.dateFormatter({ date: "short" });
this._parse = globalize.dateParser({ date: "short" }); this._parse = globalize.dateParser({ date: "short" });
this._calendarDateOptions = { this._calendarDateOptions = {
@ -188,6 +189,7 @@ return $.widget( "ui.calendar", {
// Return the short weekday if its length is < 3. Otherwise, its narrow form. // Return the short weekday if its length is < 3. Otherwise, its narrow form.
var shortWeekday = weekdayShortFormatter( date ); var shortWeekday = weekdayShortFormatter( date );
return shortWeekday.length > 3 ? weekdayNarrowFormatter( date ) : shortWeekday; return shortWeekday.length > 3 ? weekdayNarrowFormatter( date ) : shortWeekday;
}, },
formatWeekdayFull: globalize.dateFormatter({ pattern: "EEEE" }), formatWeekdayFull: globalize.dateFormatter({ pattern: "EEEE" }),
@ -325,7 +327,7 @@ return $.widget( "ui.calendar", {
if ( this.options.showWeek ) { if ( this.options.showWeek ) {
cells += "<th class='ui-calendar-week-col'>" + this._getTranslation( "weekHeader" ) + "</th>"; cells += "<th class='ui-calendar-week-col'>" + this._getTranslation( "weekHeader" ) + "</th>";
} }
for ( i; i < weekDayLength; i++ ) { for ( ; i < weekDayLength; i++ ) {
cells += this._buildGridHeaderCell( weekdays[ i ] ); cells += this._buildGridHeaderCell( weekdays[ i ] );
} }
@ -492,6 +494,7 @@ return $.widget( "ui.calendar", {
// with the prev and next links would cause loss of focus issues because the links being // with the prev and next links would cause loss of focus issues because the links being
// interacted with will disappear while focused. // interacted with will disappear while focused.
refresh: function() { refresh: function() {
this.labels = this.options.labels;
// Determine which day gridcell to focus after refresh // Determine which day gridcell to focus after refresh
// TODO: Prevent disabled cells from being focused // TODO: Prevent disabled cells from being focused
@ -541,7 +544,7 @@ return $.widget( "ui.calendar", {
value: function( value ) { value: function( value ) {
if ( arguments.length ) { if ( arguments.length ) {
this.valueAsDate( locale.parse( value ) ); this.valueAsDate( this._parse( value ) );
} else { } else {
return this._format( this.option( "value" ) ); return this._format( this.option( "value" ) );
} }

View File

@ -37,7 +37,6 @@ var widget = $.widget( "ui.datepicker", {
version: "@VERSION", version: "@VERSION",
options: { options: {
appendTo: null, appendTo: null,
locale: "en",
position: { position: {
my: "left top", my: "left top",
at: "left bottom" at: "left bottom"
@ -52,8 +51,8 @@ var widget = $.widget( "ui.datepicker", {
select: null select: null
}, },
calendarOptions: [ "buttons", "dateFormat", "disabled", "eachDay", "max", calendarOptions: [ "buttons", "disabled", "eachDay", "labels", "locale",
"min", "numberOfMonths", "showWeek" ], "max", "min", "numberOfMonths", "showWeek" ],
_create: function() { _create: function() {
this.suppressExpandOnFocus = false; this.suppressExpandOnFocus = false;
@ -283,6 +282,7 @@ var widget = $.widget( "ui.datepicker", {
_setLocale: function( locale ) { _setLocale: function( locale ) {
var globalize = new Globalize( locale ); var globalize = new Globalize( locale );
this._format = globalize.dateFormatter({ date: "short" }); this._format = globalize.dateFormatter({ date: "short" });
this._parse = globalize.dateParser({ date: "short" }); this._parse = globalize.dateParser({ date: "short" });
this._parseYMD = globalize.dateParser({ pattern: "yyyy-MM-dd" }); this._parseYMD = globalize.dateParser({ pattern: "yyyy-MM-dd" });