Datepicker: Fix code style issues

This commit is contained in:
Felix Nagel 2014-04-23 17:49:03 +02:00 committed by Scott González
parent 77d7dd21a7
commit cfea8df90a
8 changed files with 818 additions and 775 deletions

View File

@ -28,7 +28,7 @@
<div class="demo-description">
<p>The datepicker can show the week of the year. The calculation follows
<a href="http://www.unicode.org/reports/tr35 /tr35-dates.html#Date_Field_Symbol_Table">Unicode CLDR specification</a>.
<a href="http://www.unicode.org/reports/tr35/tr35-dates.html#Date_Field_Symbol_Table">Unicode CLDR specification</a>.
This means that some days from one year may be placed into weeks 'belonging' to another year.</p>
</div>
</body>

2
external/date.js vendored
View File

@ -126,7 +126,7 @@ $.date.prototype = {
var day = ( dow + weekdaysRev[ Globalize.locale().supplemental.weekData.firstDay() ] ) % 7;
result.push({
shortname: Globalize.locale().main([ "dates/calendars/gregorian/days/format/abbreviated", weekdays[ day ] ]),
fullname: Globalize.locale().main([ "dates/calendars/gregorian/days/format/wide", weekdays[ day ] ]),
fullname: Globalize.locale().main([ "dates/calendars/gregorian/days/format/wide", weekdays[ day ] ])
});
}
return result;

View File

@ -40,7 +40,7 @@ asyncTest( "baseStructure", function() {
ok( header.children( ":eq(1)" ).is( ".ui-datepicker-next" ) && header.children( ":eq(1)" ).html() !== "", "Structure - next link" );
title = header.children( ":last" ).children( ":first" );
ok( title.is( "div.ui-datepicker-title" ) && title.html() !== "","Structure - title division" );
ok( title.is( "div.ui-datepicker-title" ) && title.html() !== "", "Structure - title division" );
equal( title.children().length, 2, "Structure - title child count" );
ok( title.children( ":first" ).is( "span.ui-datepicker-month" ) && title.children( ":first" ).text() !== "", "Structure - month text" );
ok( title.children( ":last" ).is( "span.ui-datepicker-year" ) && title.children( ":last" ).text() !== "", "Structure - year text" );
@ -95,7 +95,7 @@ asyncTest( "baseStructure", function() {
function step3() {
// Multi-month 2
inp = TestHelpers.datepicker.initNewInput({ numberOfMonths: 2 });
inp = TestHelpers.datepicker.initNewInput({ numberOfMonths: 2 } );
dp = inp.datepicker( "widget" ).find( ".ui-datepicker" );
inp.focus();
setTimeout(function() {
@ -121,7 +121,7 @@ asyncTest( "baseStructure", function() {
function step4() {
// Multi-month 3
inp = TestHelpers.datepicker.initNewInput({ numberOfMonths: 3 });
inp = TestHelpers.datepicker.initNewInput({ numberOfMonths: 3 } );
dp = inp.datepicker( "widget" ).find( ".ui-datepicker" );
inp.focus();
setTimeout(function() {
@ -135,7 +135,7 @@ asyncTest( "baseStructure", function() {
function step5() {
// Multi-month [2, 2]
inp = TestHelpers.datepicker.initNewInput({ numberOfMonths: [ 2, 2 ] });
inp = TestHelpers.datepicker.initNewInput({ numberOfMonths: [ 2, 2 ] } );
dp = inp.datepicker( "widget" ).find( ".ui-datepicker" );
inp.focus();
setTimeout(function() {
@ -224,39 +224,39 @@ test( "Keyboard handling", function() {
date = new Date();
input.datepicker( "open" )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date, "Keystroke enter" );
// Enter = Select today's date by default
input.val( "1/1/14" ).datepicker( "open" )
.simulate("keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), new Date( 2014, 0, 1 ),
"Keystroke enter - preset" );
// Control + Home = Change the calendar to the current month
input.val( "1/1/14" ).datepicker( "open" )
.simulate( "keydown", { ctrlKey: true, keyCode: $.ui.keyCode.HOME })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { ctrlKey: true, keyCode: $.ui.keyCode.HOME } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date, "Keystroke ctrl+home" );
// Control + End = Close the calendar and clear the input
input.val( "1/1/14" ).datepicker( "open" )
.simulate( "keydown", { ctrlKey: true, keyCode: $.ui.keyCode.END });
.simulate( "keydown", { ctrlKey: true, keyCode: $.ui.keyCode.END } );
equal( input.val(), "", "Keystroke ctrl+end" );
input.val( "" ).datepicker( "open" );
ok( instance.isOpen, "datepicker is open before escape" );
input.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE });
input.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } );
ok( !instance.isOpen, "escape closes the datepicker" );
input.val( "1/1/14" ).datepicker( "open" )
.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE });
.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), new Date( 2014, 0, 1 ),
"Keystroke esc - preset" );
input.val( "1/1/14" ).datepicker( "open" )
.simulate( "keydown", { ctrlKey: true, keyCode: $.ui.keyCode.PAGE_UP })
.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE });
.simulate( "keydown", { ctrlKey: true, keyCode: $.ui.keyCode.PAGE_UP } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ESCAPE } );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), new Date( 2014, 0, 1 ),
"Keystroke esc - abandoned" );
@ -279,38 +279,38 @@ asyncTest( "keyboard handling", function() {
picker = input.datepicker( "widget" );
ok( !picker.is( ":visible" ), "datepicker closed" );
input.val( "" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
ok( picker.is( ":visible" ), "Keystroke down opens datepicker" );
input.datepicker( "destroy" );
step2();
});
};
}
function step2() {
input.datepicker();
picker = input.datepicker( "widget" )
picker = input.datepicker( "widget" );
ok( !picker.is( ":visible" ), "datepicker closed" );
input.val( "" )
.simulate( "keydown", { keyCode: $.ui.keyCode.UP });
.simulate( "keydown", { keyCode: $.ui.keyCode.UP } );
setTimeout(function() {
ok( picker.is( ":visible" ), "Keystroke up opens datepicker" );
input.datepicker( "destroy" );
step3();
});
};
}
function step3() {
input.datepicker()
.val( "1/1/14" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
$( ":focus" )
.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
date = new Date( 2013, 12 - 1, 31 );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date,
"Keystroke left to switch to previous day" );
@ -318,17 +318,17 @@ asyncTest( "keyboard handling", function() {
input.datepicker( "destroy" );
step4();
}, 100 );
};
}
function step4() {
input.datepicker()
.val( "1/1/14" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
$( ":focus" )
.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
date = new Date( 2014, 1 - 1, 2 );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date,
"Keystroke right to switch to next day" );
@ -336,17 +336,17 @@ asyncTest( "keyboard handling", function() {
input.datepicker( "destroy" );
step5();
}, 100 );
};
}
function step5() {
input.datepicker()
.val( "1/1/14" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
$( ":focus" )
.simulate( "keydown", { keyCode: $.ui.keyCode.UP })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.UP } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
date = new Date( 2013, 12 - 1, 25 );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date,
"Keystroke up to move to the previous week" );
@ -354,17 +354,17 @@ asyncTest( "keyboard handling", function() {
input.datepicker( "destroy" );
step6();
}, 100 );
};
}
function step6() {
input.datepicker()
.val( "1/1/14" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
$( ":focus" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
date = new Date( 2014, 1 - 1, 8 );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date,
"Keystroke down to move to the next week" );
@ -372,17 +372,17 @@ asyncTest( "keyboard handling", function() {
input.datepicker( "destroy" );
step7();
}, 100 );
};
}
function step7() {
input.datepicker()
.val( "1/1/14" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
$( ":focus" )
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
date = new Date( 2013, 12 - 1, 1 );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date,
"Keystroke Page Up moves date to previous month" );
@ -390,17 +390,17 @@ asyncTest( "keyboard handling", function() {
input.datepicker( "destroy" );
step8();
}, 100 );
};
}
function step8() {
input.datepicker()
.val( "1/1/14" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
$( ":focus" )
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP, altKey: true })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP, altKey: true } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
date = new Date( 2013, 1 - 1, 1 );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date,
"Keystroke Page Up + Ctrl moves date to previous year" );
@ -408,17 +408,17 @@ asyncTest( "keyboard handling", function() {
input.datepicker( "destroy" );
step9();
}, 100 );
};
}
function step9() {
input.datepicker()
.val( "1/1/14" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
$( ":focus" )
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
date = new Date( 2014, 2 - 1, 1 );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date,
"Keystroke Page Down moves date to next month" );
@ -426,17 +426,17 @@ asyncTest( "keyboard handling", function() {
input.datepicker( "destroy" );
step10();
}, 100 );
};
}
function step10() {
input.datepicker()
.val( "1/1/14" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
$( ":focus" )
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN, altKey: true })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN, altKey: true } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
date = new Date( 2015, 1 - 1, 1 );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date,
"Keystroke Page Down + Ctrl moves date to next year" );
@ -444,18 +444,18 @@ asyncTest( "keyboard handling", function() {
input.datepicker( "destroy" );
step11();
}, 100 );
};
}
// Check for moving to short months
function step11() {
input.datepicker()
.val( "3/31/14" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
$( ":focus" )
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
date = new Date( 2014, 2 - 1, 28 );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date,
"Keystroke Page Up and short months" );
@ -463,17 +463,17 @@ asyncTest( "keyboard handling", function() {
input.datepicker( "destroy" );
step12();
}, 100 );
};
}
function step12() {
input.datepicker()
.val( "1/30/16" )
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN });
.simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
setTimeout(function() {
$( ":focus" )
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
date = new Date( 2016, 2 - 1, 29 );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), date,
"Keystroke Page Down and leap years" );
@ -481,23 +481,23 @@ asyncTest( "keyboard handling", function() {
input.datepicker( "destroy" );
start();
}, 100 );
};
}
step1();
});
/*
// TODO: Re-add tests if we implement a stepMonths option
input.datepicker( "option", { stepMonths: 2, gotoCurrent: false })
input.datepicker( "option", { stepMonths: 2, gotoCurrent: false } )
.datepicker( "close" ).val( "02/04/2008" ).datepicker( "open" )
.late( "keydown", { keyCode: $.ui.keyCode.PAGE_UP })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.late( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), new Date( 2007, 12 - 1, 4 ),
"Keystroke pgup step 2" );
input.val( "02/04/2008" ).datepicker( "open" )
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN })
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER });
.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } )
.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), new Date( 2008, 4 - 1, 4 ),
"Keystroke pgdn step 2" );
*/
@ -516,8 +516,8 @@ test( "mouse", function() {
input.val( "2/4/08" ).datepicker( "open" );
$( ".ui-datepicker-calendar tbody a:contains(12)", picker ).simulate( "mousedown", {} );
TestHelpers.datepicker.equalsDate( input.datepicker("valueAsDate"), new Date( 2008, 2 - 1, 12 ),
"Mouse click - preset") ;
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), new Date( 2008, 2 - 1, 12 ),
"Mouse click - preset" ) ;
input.val( "" ).datepicker( "open" );
$( "button.ui-datepicker-close", picker ).simulate( "click", {} );
@ -547,15 +547,15 @@ test( "mouse", function() {
"Mouse click - previous" );
input.val( "2/4/08" ).datepicker( "open" );
$(".ui-datepicker-next", picker ).simulate( "click" );
$(".ui-datepicker-calendar tbody a:contains(18)", picker ).simulate( "mousedown" );
TestHelpers.datepicker.equalsDate( input.datepicker("valueAsDate"), new Date( 2008, 3 - 1, 18 ),
$( ".ui-datepicker-next", picker ).simulate( "click" );
$( ".ui-datepicker-calendar tbody a:contains(18)", picker ).simulate( "mousedown" );
TestHelpers.datepicker.equalsDate( input.datepicker( "valueAsDate" ), new Date( 2008, 3 - 1, 18 ),
"Mouse click - next" );
/*
// TODO: Re-add when min and max options are introduced.
// Previous/next with minimum/maximum
input.datepicker("option", {
input.datepicker( "option", {
minDate: new Date( 2008, 2 - 1, 2 ),
maxDate: new Date( 2008, 2 - 1, 26 )
}).val( "2/4/08" ).datepicker( "open" );
@ -580,13 +580,13 @@ test( "mouse", function() {
date.setDate( 10 );
TestHelpers.datepicker.equalsDate( inline.datepicker( "valueAsDate" ), date, "Mouse click inline" );
inline.datepicker( "option", { showButtonPanel: true })
inline.datepicker( "option", { showButtonPanel: true } )
.datepicker( "valueAsDate", new Date( 2008, 2 - 1, 4 ));
$( ".ui-datepicker-calendar tbody a:contains(12)", picker ).simulate( "mousedown", {} );
TestHelpers.datepicker.equalsDate( inline.datepicker( "valueAsDate" ), new Date( 2008, 2 - 1, 12 ),
"Mouse click inline - preset" );
inline.datepicker("option", { showButtonPanel: true });
inline.datepicker( "option", { showButtonPanel: true } );
$( ".ui-datepicker-current", picker ).simulate( "click", {} );
$( ".ui-datepicker-calendar tbody a:contains(14)", picker ).simulate( "mousedown", {} );
date.setDate( 14 );

View File

@ -1,3 +1,10 @@
// The implement of events is completely changing therefore these tests are no longer directly
// relevant. Leaving them around commented out so we can ensure the functionality is replicated.
// For example:
// TODO: In the old implementation the Enter key select's today's date when the <input> has
// focus and is empty. Do we want to replicate this behavior in the rewrite?
/*
(function( $ ) {
module( "datepicker: events" );
@ -18,12 +25,6 @@ test( "select", function() {
expect( 0 );
});
// The implement of events is completely changing therefore these tests are no longer directly
// relevant. Leaving them around commented out so we can ensure the functionality is replicated.
// For example:
// TODO: In the old implementation the Enter key select's today's date when the <input> has
// focus and is empty. Do we want to replicate this behavior in the rewrite?
/*
var selectedThis = null,
selectedDate = null,
selectedInst = null;
@ -40,110 +41,110 @@ function callback2(year, month, inst) {
selectedInst = inst;
}
test("events", function() {
test( "events", function() {
expect( 26 );
var dateStr, newMonthYear, inp2,
inp = TestHelpers.datepicker.init("#inp", {onSelect: callback}),
inp = TestHelpers.datepicker.init( "#inp", {onSelect: callback}),
date = new Date();
// onSelect
inp.val("").datepicker("show").
simulate("keydown", {keyCode: $.ui.keyCode.ENTER});
equal(selectedThis, inp[0], "Callback selected this");
equal(selectedInst, $.data(inp[0], TestHelpers.datepicker.PROP_NAME), "Callback selected inst");
equal(selectedDate, $.datepicker.formatDate("mm/dd/yy", date),
"Callback selected date");
inp.val("").datepicker("show").
simulate("keydown", {ctrlKey: true, keyCode: $.ui.keyCode.DOWN}).
simulate("keydown", {keyCode: $.ui.keyCode.ENTER});
inp.val( "" ).datepicker( "show" ).
simulate( "keydown", {keyCode: $.ui.keyCode.ENTER});
equal(selectedThis, inp[0], "Callback selected this" );
equal(selectedInst, $.data(inp[0], TestHelpers.datepicker.PROP_NAME), "Callback selected inst" );
equal(selectedDate, $.datepicker.formatDate( "mm/dd/yy", date),
"Callback selected date" );
inp.val( "" ).datepicker( "show" ).
simulate( "keydown", {ctrlKey: true, keyCode: $.ui.keyCode.DOWN}).
simulate( "keydown", {keyCode: $.ui.keyCode.ENTER});
date.setDate(date.getDate() + 7);
equal(selectedDate, $.datepicker.formatDate("mm/dd/yy", date),
"Callback selected date - ctrl+down");
inp.val("").datepicker("show").
simulate("keydown", {keyCode: $.ui.keyCode.ESCAPE});
equal(selectedDate, $.datepicker.formatDate("mm/dd/yy", date),
"Callback selected date - esc");
equal(selectedDate, $.datepicker.formatDate( "mm/dd/yy", date),
"Callback selected date - ctrl+down" );
inp.val( "" ).datepicker( "show" ).
simulate( "keydown", {keyCode: $.ui.keyCode.ESCAPE});
equal(selectedDate, $.datepicker.formatDate( "mm/dd/yy", date),
"Callback selected date - esc" );
dateStr = "02/04/2008";
inp.val(dateStr).datepicker("show").
simulate("keydown", {keyCode: $.ui.keyCode.ENTER});
inp.val(dateStr).datepicker( "show" ).
simulate( "keydown", {keyCode: $.ui.keyCode.ENTER});
equal(dateStr, selectedDate,
"onSelect is called after enter keydown");
"onSelect is called after enter keydown" );
// onChangeMonthYear
inp.datepicker("option", {onChangeMonthYear: callback2, onSelect: null}).
val("").datepicker("show");
inp.datepicker( "option", {onChangeMonthYear: callback2, onSelect: null}).
val( "" ).datepicker( "show" );
newMonthYear = function(date) {
return date.getFullYear() + "/" + (date.getMonth() + 1);
};
date = new Date();
date.setDate(1);
inp.simulate("keydown", {keyCode: $.ui.keyCode.PAGE_UP});
inp.simulate( "keydown", {keyCode: $.ui.keyCode.PAGE_UP});
date.setMonth(date.getMonth() - 1);
equal(selectedThis, inp[0], "Callback change month/year this");
equal(selectedInst, $.data(inp[0], TestHelpers.datepicker.PROP_NAME), "Callback change month/year inst");
equal(selectedThis, inp[0], "Callback change month/year this" );
equal(selectedInst, $.data(inp[0], TestHelpers.datepicker.PROP_NAME), "Callback change month/year inst" );
equal(selectedDate, newMonthYear(date),
"Callback change month/year date - pgup");
inp.simulate("keydown", {keyCode: $.ui.keyCode.PAGE_DOWN});
"Callback change month/year date - pgup" );
inp.simulate( "keydown", {keyCode: $.ui.keyCode.PAGE_DOWN});
date.setMonth(date.getMonth() + 1);
equal(selectedDate, newMonthYear(date),
"Callback change month/year date - pgdn");
inp.simulate("keydown", {ctrlKey: true, keyCode: $.ui.keyCode.PAGE_UP});
"Callback change month/year date - pgdn" );
inp.simulate( "keydown", {ctrlKey: true, keyCode: $.ui.keyCode.PAGE_UP});
date.setFullYear(date.getFullYear() - 1);
equal(selectedDate, newMonthYear(date),
"Callback change month/year date - ctrl+pgup");
inp.simulate("keydown", {ctrlKey: true, keyCode: $.ui.keyCode.HOME});
"Callback change month/year date - ctrl+pgup" );
inp.simulate( "keydown", {ctrlKey: true, keyCode: $.ui.keyCode.HOME});
date.setFullYear(date.getFullYear() + 1);
equal(selectedDate, newMonthYear(date),
"Callback change month/year date - ctrl+home");
inp.simulate("keydown", {ctrlKey: true, keyCode: $.ui.keyCode.PAGE_DOWN});
"Callback change month/year date - ctrl+home" );
inp.simulate( "keydown", {ctrlKey: true, keyCode: $.ui.keyCode.PAGE_DOWN});
date.setFullYear(date.getFullYear() + 1);
equal(selectedDate, newMonthYear(date),
"Callback change month/year date - ctrl+pgdn");
inp.datepicker("setDate", new Date(2007, 1 - 1, 26));
equal(selectedDate, "2007/1", "Callback change month/year date - setDate");
"Callback change month/year date - ctrl+pgdn" );
inp.datepicker( "setDate", new Date(2007, 1 - 1, 26));
equal(selectedDate, "2007/1", "Callback change month/year date - setDate" );
selectedDate = null;
inp.datepicker("setDate", new Date(2007, 1 - 1, 12));
ok(selectedDate == null, "Callback change month/year date - setDate no change");
inp.datepicker( "setDate", new Date(2007, 1 - 1, 12));
ok(selectedDate == null, "Callback change month/year date - setDate no change" );
// onChangeMonthYear step by 2
inp.datepicker("option", {stepMonths: 2}).
datepicker("hide").val("").datepicker("show").
simulate("keydown", {keyCode: $.ui.keyCode.PAGE_UP});
inp.datepicker( "option", {stepMonths: 2}).
datepicker( "hide" ).val( "" ).datepicker( "show" ).
simulate( "keydown", {keyCode: $.ui.keyCode.PAGE_UP});
date.setMonth(date.getMonth() - 14);
equal(selectedDate, newMonthYear(date),
"Callback change month/year by 2 date - pgup");
inp.simulate("keydown", {ctrlKey: true, keyCode: $.ui.keyCode.PAGE_UP});
"Callback change month/year by 2 date - pgup" );
inp.simulate( "keydown", {ctrlKey: true, keyCode: $.ui.keyCode.PAGE_UP});
date.setMonth(date.getMonth() - 12);
equal(selectedDate, newMonthYear(date),
"Callback change month/year by 2 date - ctrl+pgup");
inp.simulate("keydown", {keyCode: $.ui.keyCode.PAGE_DOWN});
"Callback change month/year by 2 date - ctrl+pgup" );
inp.simulate( "keydown", {keyCode: $.ui.keyCode.PAGE_DOWN});
date.setMonth(date.getMonth() + 2);
equal(selectedDate, newMonthYear(date),
"Callback change month/year by 2 date - pgdn");
inp.simulate("keydown", {ctrlKey: true, keyCode: $.ui.keyCode.PAGE_DOWN});
"Callback change month/year by 2 date - pgdn" );
inp.simulate( "keydown", {ctrlKey: true, keyCode: $.ui.keyCode.PAGE_DOWN});
date.setMonth(date.getMonth() + 12);
equal(selectedDate, newMonthYear(date),
"Callback change month/year by 2 date - ctrl+pgdn");
"Callback change month/year by 2 date - ctrl+pgdn" );
// onClose
inp.datepicker("option", {onClose: callback, onChangeMonthYear: null, stepMonths: 1}).
val("").datepicker("show").
simulate("keydown", {keyCode: $.ui.keyCode.ESCAPE});
equal(selectedThis, inp[0], "Callback close this");
equal(selectedInst, $.data(inp[0], TestHelpers.datepicker.PROP_NAME), "Callback close inst");
equal(selectedDate, "", "Callback close date - esc");
inp.val("").datepicker("show").
simulate("keydown", {keyCode: $.ui.keyCode.ENTER});
equal(selectedDate, $.datepicker.formatDate("mm/dd/yy", new Date()),
"Callback close date - enter");
inp.val("02/04/2008").datepicker("show").
simulate("keydown", {keyCode: $.ui.keyCode.ESCAPE});
equal(selectedDate, "02/04/2008", "Callback close date - preset");
inp.val("02/04/2008").datepicker("show").
simulate("keydown", {ctrlKey: true, keyCode: $.ui.keyCode.END});
equal(selectedDate, "", "Callback close date - ctrl+end");
inp.datepicker( "option", {onClose: callback, onChangeMonthYear: null, stepMonths: 1}).
val( "" ).datepicker( "show" ).
simulate( "keydown", {keyCode: $.ui.keyCode.ESCAPE});
equal(selectedThis, inp[0], "Callback close this" );
equal(selectedInst, $.data(inp[0], TestHelpers.datepicker.PROP_NAME), "Callback close inst" );
equal(selectedDate, "", "Callback close date - esc" );
inp.val( "" ).datepicker( "show" ).
simulate( "keydown", {keyCode: $.ui.keyCode.ENTER});
equal(selectedDate, $.datepicker.formatDate( "mm/dd/yy", new Date()),
"Callback close date - enter" );
inp.val( "02/04/2008" ).datepicker( "show" ).
simulate( "keydown", {keyCode: $.ui.keyCode.ESCAPE});
equal(selectedDate, "02/04/2008", "Callback close date - preset" );
inp.val( "02/04/2008" ).datepicker( "show" ).
simulate( "keydown", {ctrlKey: true, keyCode: $.ui.keyCode.END});
equal(selectedDate, "", "Callback close date - ctrl+end" );
inp2 = TestHelpers.datepicker.init("#inp2");
inp2.datepicker().datepicker("option", {onClose: callback}).datepicker("show");
inp.datepicker("show");
equal(selectedThis, inp2[0], "Callback close this");
inp2 = TestHelpers.datepicker.init( "#inp2" );
inp2.datepicker().datepicker( "option", {onClose: callback}).datepicker( "show" );
inp.datepicker( "show" );
equal(selectedThis, inp2[0], "Callback close this" );
});
*/
})( jQuery );
*/

View File

@ -51,7 +51,7 @@ test( "enable / disable", function() {
test( "widget", function() {
expect( 1 );
var actual = $( "#datepicker" ).datepicker().datepicker( "widget" );
deepEqual( $("body > .ui-front" )[ 0 ], actual[ 0 ] );
deepEqual( $( "body > .ui-front" )[ 0 ], actual[ 0 ] );
actual.remove();
});

File diff suppressed because it is too large Load Diff

View File

@ -1,18 +1,18 @@
TestHelpers.datepicker = {
addMonths: function(date, offset) {
var maxDay = 32 - new Date(date.getFullYear(), date.getMonth() + offset, 32).getDate();
date.setDate(Math.min(date.getDate(), maxDay));
date.setMonth(date.getMonth() + offset);
addMonths: function( date, offset ) {
var maxDay = 32 - new Date( date.getFullYear(), date.getMonth() + offset, 32 ).getDate();
date.setDate( Math.min( date.getDate(), maxDay ) );
date.setMonth( date.getMonth() + offset );
return date;
},
equalsDate: function(d1, d2, message) {
if (!d1 || !d2) {
ok(false, message + " - missing date");
equalsDate: function( d1, d2, message ) {
if ( !d1 || !d2 ) {
ok( false, message + " - missing date" );
return;
}
d1 = new Date(d1.getFullYear(), d1.getMonth(), d1.getDate());
d2 = new Date(d2.getFullYear(), d2.getMonth(), d2.getDate());
equal(d1.toString(), d2.toString(), message);
d1 = new Date( d1.getFullYear(), d1.getMonth(), d1.getDate() );
d2 = new Date( d2.getFullYear(), d2.getMonth(), d2.getDate() );
equal( d1.toString(), d2.toString(), message );
},
init: function( id, options ) {
options = $.extend( { show: false }, options || {} );

View File

@ -57,6 +57,7 @@ $.widget( "ui.datepicker", {
open: null,
select: null
},
_create: function() {
this.options.dateFormat = this.options.dateFormat || { date: "short" };
this.date = $.date( null, this.options.dateFormat );
@ -172,6 +173,7 @@ $.widget( "ui.datepicker", {
newCell.children( "a" ).addClass( "ui-state-focus" );
}
},
_createPicker: function() {
this.picker = $( "<div>" )
.addClass( "ui-front" )
@ -205,10 +207,10 @@ $.widget( "ui.datepicker", {
case $.ui.keyCode.DOWN:
case $.ui.keyCode.UP:
clearTimeout( this.closeTimer );
this._delay(function() {
this._delay( function() {
this.open( event );
this.grid.focus();
}, 1);
}, 1 );
break;
case $.ui.keyCode.HOME:
if ( event.ctrlKey ) {
@ -257,7 +259,7 @@ $.widget( "ui.datepicker", {
}
this._delay( function() {
suppressExpandOnFocus = false;
}, 100);
}, 100 );
},
blur: function() {
suppressExpandOnFocus = false;
@ -271,7 +273,7 @@ $.widget( "ui.datepicker", {
// also allows tabbing inside the calendar without it closing
this.closeTimer = this._delay( function() {
this.close( event );
}, 150);
}, 150 );
},
focusin: function() {
clearTimeout( this.closeTimer );
@ -296,6 +298,7 @@ $.widget( "ui.datepicker", {
}
});
},
_appendTo: function() {
var element = this.options.appendTo;
@ -310,7 +313,7 @@ $.widget( "ui.datepicker", {
}
if ( !element.length ) {
element = this.document[0].body;
element = this.document[ 0 ].body;
}
return element;
@ -363,10 +366,10 @@ $.widget( "ui.datepicker", {
html += "<div class='ui-datepicker-group'>" +
"<div class='ui-datepicker-header ui-widget-header ui-helper-clearfix " + headerClass + "'>";
if ( months[i].first ) {
if ( months[ i ].first ) {
html += this._buildPreviousLink();
}
if ( months[i].last ) {
if ( months[ i ].last ) {
html += this._buildNextLink();
}
@ -380,8 +383,10 @@ $.widget( "ui.datepicker", {
html += this._buildButtons();
this.date = currentDate;
return html;
},
_buildHeader: function() {
return "<div class='ui-datepicker-header ui-widget-header ui-helper-clearfix ui-corner-all'>" +
this._buildPreviousLink() +
@ -389,8 +394,10 @@ $.widget( "ui.datepicker", {
this._buildTitlebar() +
"</div>";
},
_buildPreviousLink: function() {
var labels = Globalize.translate( "datepicker" );
return "<button class='ui-datepicker-prev ui-corner-all' " +
"title='" + labels.prevText + "'>" +
"<span class='ui-icon ui-icon-circle-triangle-w'>" +
@ -398,8 +405,10 @@ $.widget( "ui.datepicker", {
"</span>" +
"</button>";
},
_buildNextLink: function() {
var labels = Globalize.translate( "datepicker" );
return "<button class='ui-datepicker-next ui-corner-all' " +
"title='" + labels.nextText + "'>" +
"<span class='ui-icon ui-icon-circle-triangle-e'>" +
@ -407,8 +416,10 @@ $.widget( "ui.datepicker", {
"</span>" +
"</button>";
},
_buildTitlebar: function() {
var labels = Globalize.translate( "datepicker" );
return "<div role='header' id='" + this.id + "-title'>" +
"<div id='" + this.id + "-month-lbl' class='ui-datepicker-title'>" +
this._buildTitle() +
@ -416,6 +427,7 @@ $.widget( "ui.datepicker", {
"<span class='ui-helper-hidden-accessible'>, " + labels.datePickerRole + "</span>" +
"</div>";
},
_buildTitle: function() {
return "<span class='ui-datepicker-month'>" +
this.date.monthName() +
@ -424,6 +436,7 @@ $.widget( "ui.datepicker", {
this.date.year() +
"</span>";
},
_buildGrid: function() {
return "<table class='ui-datepicker-calendar' role='grid' aria-readonly='true' " +
"aria-labelledby='" + this.id + "-month-lbl' tabindex='0' aria-activedescendant='" + this.id + "-" + this.date.day() + "'>" +
@ -431,6 +444,7 @@ $.widget( "ui.datepicker", {
this._buildGridBody() +
"</table>";
},
_buildGridHeading: function() {
var cells = "",
i = 0,
@ -442,10 +456,12 @@ $.widget( "ui.datepicker", {
for ( i; i < this.date.weekdays().length; i++ ) {
cells += this._buildGridHeaderCell( this.date.weekdays()[i] );
}
return "<thead role='presentation'>" +
"<tr role='row'>" + cells + "</tr>" +
"</thead>";
},
_buildGridHeaderCell: function( day ) {
return "<th role='columnheader' abbr='" + day.fullname + "' aria-label='" + day.fullname + "'>" +
"<span title='" + day.fullname + "'>" +
@ -453,16 +469,20 @@ $.widget( "ui.datepicker", {
"</span>" +
"</th>";
},
_buildGridBody: function() {
// this.date.days() is not cached, and it has O(n^2) complexity. It is run O(n) times. So, it equals O(n^3). Not good at all. Caching.
var days = this.date.days(),
i = 0,
rows = "";
for ( i; i < days.length; i++ ) {
rows += this._buildWeekRow( days[i] );
rows += this._buildWeekRow( days[ i ] );
}
return "<tbody role='presentation'>" + rows + "</tbody>";
},
_buildWeekRow: function( week ) {
var cells = "",
i = 0;
@ -475,6 +495,7 @@ $.widget( "ui.datepicker", {
}
return "<tr role='row'>" + cells + "</tr>";
},
_buildDayCell: function( day ) {
var contents = "",
idAttribute = day.render ? ( "id=" + this.id + "-" + day.date ) : "",
@ -493,6 +514,7 @@ $.widget( "ui.datepicker", {
contents +
"</td>";
},
_buildDayLink: function( day ) {
var link,
classes = [ "ui-state-default" ],
@ -516,10 +538,13 @@ $.widget( "ui.datepicker", {
if ( day.today ) {
link += "<span class='ui-helper-hidden-accessible'>, " + labels.currentText + "</span>";
}
return link;
},
_buildDayDisplay: function( day ) {
var classes = [];
if ( day.current ) {
classes.push( "ui-state-active" );
}
@ -530,20 +555,23 @@ $.widget( "ui.datepicker", {
classes.push( day.extraClasses.split( " " ) );
}
return "<span class='" + classes.join( "" ) + "'>" +
day.date + "</span>";
return "<span class='" + classes.join( "" ) + "'>" + day.date + "</span>";
},
_buildButtons: function() {
var labels = Globalize.translate( "datepicker" );
return "<div class='ui-datepicker-buttonpane ui-widget-content'>" +
"<button class='ui-datepicker-current'>" + labels.currentText + "</button>" +
"<button class='ui-datepicker-close'>" + labels.closeText + "</button>" +
"</div>";
},
_focusTrigger: function() {
suppressExpandOnFocus = true;
this.element.focus();
},
// Refreshing the entire datepicker 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
@ -560,6 +588,7 @@ $.widget( "ui.datepicker", {
this._refreshMultiplePicker();
}
},
_refreshMultiplePicker: function() {
for ( var i = 0; i < this.options.numberOfMonths; i++ ) {
$( ".ui-datepicker-title", this.picker ).eq( i ).html( this._buildTitle() );
@ -573,6 +602,7 @@ $.widget( "ui.datepicker", {
// to maintain the currently focused grid and base queries like this off of it.
$( this.picker ).find( ".ui-state-focus" ).not( ":first" ).removeClass( "ui-state-focus" );
},
open: function( event ) {
if ( this.inline || this.isOpen ) {
return;
@ -603,6 +633,7 @@ $.widget( "ui.datepicker", {
this._trigger( "open", event );
},
close: function( event ) {
if ( this.inline ) {
return;
@ -616,16 +647,19 @@ $.widget( "ui.datepicker", {
this.isOpen = false;
this._trigger( "close", event );
},
_setHiddenPicker: function() {
this.picker
.attr( "aria-hidden", "true" )
.attr( "aria-expanded", "false" );
},
_buildPosition: function() {
return $.extend( {}, {
of: this.element
}, this.options.position );
},
select: function( event, time ) {
this.date.setTime( time ).select();
this.refresh();
@ -639,6 +673,7 @@ $.widget( "ui.datepicker", {
date: this.date.format()
});
},
_value: function( value ) {
this.date.setTime( value ).select();
if ( !this.inline ) {
@ -646,6 +681,7 @@ $.widget( "ui.datepicker", {
}
this.refresh();
},
value: function( value ) {
if ( arguments.length ) {
this._value( value );
@ -653,6 +689,7 @@ $.widget( "ui.datepicker", {
return this.isValid() ? this.date.format() : this.element.val();
}
},
valueAsDate: function( value ) {
if ( arguments.length ) {
this._value( value );
@ -660,12 +697,15 @@ $.widget( "ui.datepicker", {
return this.isValid() ? this.date.date() : null;
}
},
isValid: function() {
if ( this.inline ) {
return true;
}
return Globalize.parseDate( this.element.val(), this.options.dateFormat ) !== null;
},
_destroy: function() {
if ( this.inline ) {
this.picker.empty();
@ -676,9 +716,11 @@ $.widget( "ui.datepicker", {
.removeAttr( "aria-owns" );
}
},
widget: function() {
return this.picker;
},
_setOption: function( key, value ) {
this._super( key, value );