Skip to content

Commit 3522a23

Browse files
author
Ca-Phun Ung
committed
Datepicker #3647: added enable, disable, destroy buttons to visual test. Fixed failing localisation tests. Fixed RTL support and selected day highlighting for keyboard navigation.
1 parent bc5df74 commit 3522a23

File tree

3 files changed

+68
-12
lines changed

3 files changed

+68
-12
lines changed

‎tests/datepicker.js

Lines changed: 4 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -423,6 +423,7 @@ test('enableDisable', function() {
423423
inp.datepicker('destroy');
424424
// Inline
425425
var inl = init('#inl');
426+
var dp = $('.ui-datepicker-inline', inl);
426427
ok(!inl.datepicker('isDisabled'), 'Enable/disable inline - initially marked as enabled');
427428
ok($('.ui-datepicker-disabled', inl).length == 0, 'Enable/disable inline - cover initially absent');
428429
inl.datepicker('disable');
@@ -1185,24 +1186,21 @@ test('events', function() {
11851186

11861187
test('localisation', function() {
11871188
var inp = init('#inp', $.datepicker.regional['fr']);
1188-
inp.datepicker('option', {dateFormat: 'DD, d MM yy', showButtonPanel:true}).val('').datepicker('show');
1189+
inp.datepicker('option', {dateFormat: 'DD, d MM yy', showButtonPanel:true, changeMonth:true, changeYear:true}).val('').datepicker('show');
11891190
var dp = $('#ui-datepicker-div');
11901191
equals($('.ui-datepicker-close', dp).text(), 'Fermer', 'Localisation - close');
11911192
$('.ui-datepicker-close', dp).simulate('mouseover');
11921193
equals($('.ui-datepicker-prev', dp).text(), '<Préc', 'Localisation - previous');
11931194
equals($('.ui-datepicker-current', dp).text(), 'Courant', 'Localisation - current');
11941195
equals($('.ui-datepicker-next', dp).text(), 'Suiv>', 'Localisation - next');
1195-
equals($('.ui-datepicker-current', dp).text(), 'Courant', 'Localisation - current');
11961196
var month = 0;
1197-
$('.ui-datepicker-new-month option', dp).each(function() {
1197+
$('.ui-datepicker-month option', dp).each(function() {
11981198
equals($(this).text(), $.datepicker.regional['fr'].monthNames[month],
11991199
'Localisation - month ' + month);
12001200
month++;
12011201
});
1202-
equals($('.ui-datepicker-calendar th:first', dp).text(),
1203-
$.datepicker.regional['fr'].weekHeader, 'Localisation - week header');
12041202
var day = 1;
1205-
$('.ui-datepicker-calendar th a', dp).each(function() {
1203+
$('.ui-datepicker-calendar th', dp).each(function() {
12061204
equals($(this).text(), $.datepicker.regional['fr'].dayNamesMin[day],
12071205
'Localisation - day ' + day);
12081206
day = (day + 1) % 7;

‎tests/visual/datepicker.html

Lines changed: 53 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -9,28 +9,81 @@
99
<script type="text/javascript" src="../../ui/ui.datepicker.js"></script>
1010
<script type="text/javascript">
1111
$(function() {
12+
// simple datepicker
1213
$('#d1').datepicker();
14+
$('button.disable-d1').click(function(event){
15+
$('#d1').datepicker('disable');
16+
event.preventDefault();
17+
});
18+
$('button.enable-d1').click(function(event){
19+
$('#d1').datepicker('enable');
20+
event.preventDefault();
21+
});
22+
$('button.destroy-d1').click(function(event){
23+
$('#d1').datepicker('destroy');
24+
event.preventDefault();
25+
});
26+
27+
// multi datepicker
1328
$('#d2').datepicker({numberOfMonths: 3, showButtonPanel: true});
29+
$('button.disable-d2').click(function(event){
30+
$('#d2').datepicker('disable');
31+
event.preventDefault();
32+
});
33+
$('button.enable-d2').click(function(event){
34+
$('#d2').datepicker('enable');
35+
event.preventDefault();
36+
});
37+
$('button.destroy-d2').click(function(event){
38+
$('#d2').datepicker('destroy');
39+
event.preventDefault();
40+
});
41+
42+
// inline datepicker
1443
$('#inl').datepicker();
44+
$('button.disable-inl').click(function(event){
45+
$('#inl').datepicker('disable');
46+
event.preventDefault();
47+
});
48+
$('button.enable-inl').click(function(event){
49+
$('#inl').datepicker('enable');
50+
event.preventDefault();
51+
});
52+
$('button.destroy-inl').click(function(event){
53+
$('#inl').datepicker('destroy');
54+
event.preventDefault();
55+
});
1556
});
1657
</script>
1758
</head>
1859
<body>
1960

2061
<ul class="plugins">
2162
<li class="plugin">
63+
<button class="disable-d1">Disable</button>
64+
<button class="enable-d1">Enable</button>
65+
<button class="destroy-d1">Destroy</button>
66+
2267
Datepicker Simple
2368
<div>
2469
<input type="text" id="d1">
2570
</div>
2671
</li>
2772
<li class="plugin">
73+
<button class="disable-d2">Disable</button>
74+
<button class="enable-d2">Enable</button>
75+
<button class="destroy-d2">Destroy</button>
76+
2877
Datepicker Multi
2978
<div>
3079
<input type="text" id="d2">
3180
</div>
3281
</li>
3382
<li class="plugin">
83+
<button class="disable-inl">Disable</button>
84+
<button class="enable-inl">Enable</button>
85+
<button class="destroy-inl">Destroy</button>
86+
3487
Datepicker Inline
3588
<div id="inl"></div>
3689
</li>

‎ui/ui.datepicker.js

Lines changed: 11 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -337,6 +337,7 @@ $.extend(Datepicker.prototype, {
337337
});
338338
$target.prepend('<div class="' + this._disableClass + '" style="' +
339339
($.browser.msie ? 'background-color: transparent; ' : '') +
340+
'position: absolute;' +
340341
'width: ' + inline.width() + 'px; height: ' + inline.height() +
341342
'px; left: ' + (offset.left - relOffset.left) +
342343
'px; top: ' + (offset.top - relOffset.top) + 'px;"></div>');
@@ -443,6 +444,7 @@ $.extend(Datepicker.prototype, {
443444
_doKeyDown: function(event) {
444445
var inst = $.datepicker._getInst(event.target);
445446
var handled = true;
447+
var isRTL = inst.dpDiv.is('.ui-datepicker-rtl');
446448
inst._keyEvent = true;
447449
if ($.datepicker._datepickerShowing)
448450
switch (event.keyCode) {
@@ -472,7 +474,7 @@ $.extend(Datepicker.prototype, {
472474
case 36: if (event.ctrlKey || event.metaKey) $.datepicker._gotoToday(event.target);
473475
handled = event.ctrlKey || event.metaKey;
474476
break; // current on ctrl or command +home
475-
case 37: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, -1, 'D');
477+
case 37: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, (isRTL ? +1 : -1), 'D');
476478
handled = event.ctrlKey || event.metaKey;
477479
// -1 day on ctrl or command +left
478480
if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, (event.ctrlKey ?
@@ -483,7 +485,7 @@ $.extend(Datepicker.prototype, {
483485
case 38: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, -7, 'D');
484486
handled = event.ctrlKey || event.metaKey;
485487
break; // -1 week on ctrl or command +up
486-
case 39: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, +1, 'D');
488+
case 39: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, (isRTL ? -1 : +1), 'D');
487489
handled = event.ctrlKey || event.metaKey;
488490
// +1 day on ctrl or command +right
489491
if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, (event.ctrlKey ?
@@ -589,12 +591,16 @@ $.extend(Datepicker.prototype, {
589591
css({width: dims.width, height: dims.height})
590592
.end()
591593
.find('button, .ui-datepicker-prev, .ui-datepicker-next, .ui-datepicker-calendar td a')
592-
.bind('mouseover', function(){
593-
$(this).addClass('ui-state-hover');
594-
})
595594
.bind('mouseout', function(){
596595
$(this).removeClass('ui-state-hover');
597596
})
597+
.bind('mouseover', function(){
598+
$(this).parents('.ui-datepicker-calendar').find('a').removeClass('ui-state-hover');
599+
$(this).addClass('ui-state-hover');
600+
})
601+
.end()
602+
.find('.' + this._dayOverClass + ' a')
603+
.trigger('mouseover')
598604
.end();
599605
var numMonths = this._getNumberOfMonths(inst);
600606
inst.dpDiv[(numMonths[0] != 1 || numMonths[1] != 1 ? 'add' : 'remove') +
@@ -1279,7 +1285,6 @@ $.extend(Datepicker.prototype, {
12791285
}
12801286
}
12811287
}
1282-
// controls and links
12831288
var prevText = this._get(inst, 'prevText');
12841289
prevText = (!navigationAsDateFormat ? prevText : this.formatDate(prevText,
12851290
this._daylightSavingAdjust(new Date(drawYear, drawMonth - stepMonths, 1)),

0 commit comments

Comments
 (0)