Search and Top Navigation
Ticket #3647: jquery-ui-trunk-datepicker.patch
File jquery-ui-trunk-datepicker.patch, 28.5 KB (added by caphun, December 18, 2008 11:07AM UTC)
Index: ui.datepicker.js
===================================================================
--- ui.datepicker.js (revision 1171)
+++ ui.datepicker.js (working copy)
@@ -38,26 +38,25 @@
this._disableClass = 'ui-datepicker-disabled'; // The name of the disabled covering marker class
this._unselectableClass = 'ui-datepicker-unselectable'; // The name of the unselectable cell marker class
this._currentClass = 'ui-datepicker-current-day'; // The name of the current day marker class
- this._dayOverClass = 'ui-datepicker-days-cell-over'; // The name of the day hover marker class
+ this._dayOverClass = 'ui-state-hover'; // The name of the day hover marker class
this._weekOverClass = 'ui-datepicker-week-over'; // The name of the week hover marker class
this.regional = []; // Available regional settings, indexed by language code
this.regional[''] = { // Default regional settings
clearText: 'Clear', // Display text for clear link
clearStatus: 'Erase the current date', // Status text for clear link
- closeText: 'Close', // Display text for close link
+ closeText: 'Done', // Display text for close link
closeStatus: 'Close without change', // Status text for close link
- prevText: '<Prev', // Display text for previous month link
+ prevText: 'Prev', // Display text for previous month link
prevStatus: 'Show the previous month', // Status text for previous month link
prevBigText: '<<', // Display text for previous year link
prevBigStatus: 'Show the previous year', // Status text for previous year link
- nextText: 'Next>', // Display text for next month link
+ nextText: 'Next', // Display text for next month link
nextStatus: 'Show the next month', // Status text for next month link
nextBigText: '>>', // Display text for next year link
nextBigStatus: 'Show the next year', // Status text for next year link
currentText: 'Today', // Display text for current month link
currentStatus: 'Show the current month', // Status text for current month link
- monthNames: ['January','February','March','April','May','June',
- 'July','August','September','October','November','December'], // Names of months for drop-down and formatting
+ monthNames: ['January','February','March','April','May','June','July','August','September','October','November','December'], // Names of months for drop-down and formatting
monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], // For formatting
monthStatus: 'Show a different month', // Status text for selecting a month
yearStatus: 'Show a different year', // Status text for selecting a year
@@ -84,23 +83,18 @@
buttonText: '...', // Text for trigger button
buttonImage: '', // URL for trigger button image
buttonImageOnly: false, // True if the image appears alone, false if it appears on a button
- closeAtTop: true, // True to have the clear/close at the top,
- // false to have them at the bottom
- mandatory: false, // True to hide the Clear link, false to include it
hideIfNoPrevNext: false, // True to hide next/previous month links
// if not applicable, false to just disable them
navigationAsDateFormat: false, // True if date formatting applied to prev/today/next links
- showBigPrevNext: false, // True to show big prev/next links
gotoCurrent: false, // True if today link goes back to current selection instead
- changeMonth: true, // True if month can be selected directly, false if only prev/next
- changeYear: true, // True if year can be selected directly, false if only prev/next
+ changeMonth: false, // True if month can be selected directly, false if only prev/next
+ changeYear: false, // True if year can be selected directly, false if only prev/next
showMonthAfterYear: false, // True if the year select precedes month, false for month then year
yearRange: '-10:+10', // Range of years to display in drop-down,
// either relative to current year (-nn:+nn) or absolute (nnnn:nnnn)
changeFirstDay: true, // True to click on day name to change, false to remain as set
highlightWeek: false, // True to highlight the selected week
showOtherMonths: false, // True to show dates in other months, false to leave blank
- showWeeks: false, // True to show week of the year, false to omit
calculateWeek: this.iso8601Week, // How to calculate the week of the year,
// takes a Date and returns the number of the week for it
shortYearCutoff: '+10', // Short year values < this are in the current century,
@@ -123,15 +117,15 @@
numberOfMonths: 1, // Number of months to show at a time
showCurrentAtPos: 0, // The position in multipe months at which to show the current month (starting at 0)
stepMonths: 1, // Number of months to step back/forward
- stepBigMonths: 12, // Number of months to step back/forward for the big links
rangeSelect: false, // Allows for selecting a date range on one date picker
rangeSeparator: ' - ', // Text between two dates in a range
altField: '', // Selector for an alternate field to store selected dates into
altFormat: '', // The date format to use for the alternate field
- constrainInput: true // The input is constrained by the current date format
+ constrainInput: true, // The input is constrained by the current date format
+ showButtonPanel: false // True to show button panel, false to not show it
};
$.extend(this._defaults, this.regional['']);
- this.dpDiv = $('');
+ this.dpDiv = $('');
}
$.extend(Datepicker.prototype, {
@@ -190,7 +184,7 @@
drawMonth: 0, drawYear: 0, // month being drawn
inline: inline, // is datepicker inline or not
dpDiv: (!inline ? this.dpDiv : // presentation div
- $(''))};
+ $(''))};
},
/* Attach the date picker to an input field. */
@@ -485,26 +479,17 @@
break; // select the value on enter
case 27: $.datepicker._hideDatepicker(null, $.datepicker._get(inst, 'duration'));
break; // hide on escape
- case 33: $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- -$.datepicker._get(inst, 'stepBigMonths') :
- -$.datepicker._get(inst, 'stepMonths')), 'M');
+ case 33: $.datepicker._adjustDate(event.target, -$.datepicker._get(inst, 'stepMonths'), 'M');
break; // previous month/year on page up/+ ctrl
- case 34: $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- +$.datepicker._get(inst, 'stepBigMonths') :
- +$.datepicker._get(inst, 'stepMonths')), 'M');
+ case 34: $.datepicker._adjustDate(event.target, +$.datepicker._get(inst, 'stepMonths'), 'M');
break; // next month/year on page down/+ ctrl
- case 35: if (event.ctrlKey || event.metaKey) $.datepicker._clearDate(event.target);
- handled = event.ctrlKey || event.metaKey;
- break; // clear on ctrl or command +end
case 36: if (event.ctrlKey || event.metaKey) $.datepicker._gotoToday(event.target);
handled = event.ctrlKey || event.metaKey;
break; // current on ctrl or command +home
case 37: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, -1, 'D');
handled = event.ctrlKey || event.metaKey;
// -1 day on ctrl or command +left
- if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- -$.datepicker._get(inst, 'stepBigMonths') :
- -$.datepicker._get(inst, 'stepMonths')), 'M');
+ if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, -$.datepicker._get(inst, 'stepMonths'), 'M');
// next month/year on alt +left on Mac
break;
case 38: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, -7, 'D');
@@ -513,9 +498,7 @@
case 39: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, +1, 'D');
handled = event.ctrlKey || event.metaKey;
// +1 day on ctrl or command +right
- if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- +$.datepicker._get(inst, 'stepBigMonths') :
- +$.datepicker._get(inst, 'stepMonths')), 'M');
+ if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, +$.datepicker._get(inst, 'stepMonths'), 'M');
// next month/year on alt +right
break;
case 40: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, +7, 'D');
@@ -580,9 +563,6 @@
// determine sizing offscreen
inst.dpDiv.css({position: 'absolute', display: 'block', top: '-1000px'});
$.datepicker._updateDatepicker(inst);
- // fix width for dynamic number of date pickers
- inst.dpDiv.width($.datepicker._getNumberOfMonths(inst)[1] *
- $('.ui-datepicker', inst.dpDiv[0])[0].offsetWidth);
// and adjust position before showing
offset = $.datepicker._checkOffset(inst, offset, isFixed);
inst.dpDiv.css({position: ($.datepicker._inDialog && $.blockUI ?
@@ -615,7 +595,16 @@
height: inst.dpDiv.height() + 4};
inst.dpDiv.empty().append(this._generateHTML(inst)).
find('iframe.ui-datepicker-cover').
- css({width: dims.width, height: dims.height});
+ css({width: dims.width, height: dims.height})
+ .end()
+ .find('button, .ui-datepicker-prev, .ui-datepicker-next')
+ .bind('mouseover', function(){
+ $(this).addClass('ui-state-hover');
+ })
+ .bind('mouseout', function(){
+ $(this).removeClass('ui-state-hover');
+ })
+ .end();
var numMonths = this._getNumberOfMonths(inst);
inst.dpDiv[(numMonths[0] != 1 || numMonths[1] != 1 ? 'add' : 'remove') +
'Class']('ui-datepicker-multi');
@@ -707,7 +696,7 @@
/* Tidy up after a dialog display. */
_tidyDialog: function(inst) {
- inst.dpDiv.removeClass(this._dialogClass).unbind('.ui-datepicker');
+ inst.dpDiv.removeClass(this._dialogClass).unbind('.ui-datepicker-calendar');
$('.' + this._promptClass, inst.dpDiv).remove();
},
@@ -821,17 +810,6 @@
}
},
- /* Erase the input field and hide the date picker. */
- _clearDate: function(id) {
- var target = $(id);
- var inst = this._getInst(target[0]);
- if (this._get(inst, 'mandatory'))
- return;
- inst.stayOpen = false;
- inst.endDay = inst.endMonth = inst.endYear = inst.rangeStart = null;
- this._selectDate(target, '');
- },
-
/* Update the input field with the selected date. */
_selectDate: function(id, dateStr) {
var target = $(id);
@@ -1335,8 +1313,9 @@
return [inst.rangeStart || startDate,
(!inst.endYear ? inst.rangeStart || startDate :
this._daylightSavingAdjust(new Date(inst.endYear, inst.endMonth, inst.endDay)))];
- } else
- return startDate;
+ } else {
+ return startDate;
+ }
},
/* Generate the HTML for the current state of the date picker. */
@@ -1347,24 +1326,13 @@
var showStatus = this._get(inst, 'showStatus');
var initStatus = this._get(inst, 'initStatus') || ' ';
var isRTL = this._get(inst, 'isRTL');
- // build the date picker HTML
- var clear = (this._get(inst, 'mandatory') ? '' :
- '');
- var controls = '' + (isRTL ? '' : clear) +
- '' + (isRTL ? clear : '') + '';
+ var showButtonPanel = this._get(inst, 'showButtonPanel');
var prompt = this._get(inst, 'prompt');
- var closeAtTop = this._get(inst, 'closeAtTop');
var hideIfNoPrevNext = this._get(inst, 'hideIfNoPrevNext');
var navigationAsDateFormat = this._get(inst, 'navigationAsDateFormat');
- var showBigPrevNext = this._get(inst, 'showBigPrevNext');
var numMonths = this._getNumberOfMonths(inst);
var showCurrentAtPos = this._get(inst, 'showCurrentAtPos');
var stepMonths = this._get(inst, 'stepMonths');
- var stepBigMonths = this._get(inst, 'stepBigMonths');
var isMultiMonth = (numMonths[0] != 1 || numMonths[1] != 1);
var currentDate = this._daylightSavingAdjust((!inst.currentDay ? new Date(9999, 9, 9) :
new Date(inst.currentYear, inst.currentMonth, inst.currentDay)));
@@ -1393,43 +1361,33 @@
prevText = (!navigationAsDateFormat ? prevText : this.formatDate(prevText,
this._daylightSavingAdjust(new Date(drawYear, drawMonth - stepMonths, 1)),
this._getFormatConfig(inst)));
- var prevBigText = (showBigPrevNext ? this._get(inst, 'prevBigText') : '');
- prevBigText = (!navigationAsDateFormat ? prevBigText : this.formatDate(prevBigText,
- this._daylightSavingAdjust(new Date(drawYear, drawMonth - stepBigMonths, 1)),
- this._getFormatConfig(inst)));
- var prev = '' + (this._canAdjustMonth(inst, -1, drawYear, drawMonth) ?
- (showBigPrevNext ? '' + prevBigText + '' : '') +
- '' + prevText + '' :
- (hideIfNoPrevNext ? '' : (showBigPrevNext ? '' : '') +
- '')) + '';
+ var prev = (this._canAdjustMonth(inst, -1, drawYear, drawMonth) ?
+ '' + prevText + '' :
+ (hideIfNoPrevNext ? '' : ''));
var nextText = this._get(inst, 'nextText');
nextText = (!navigationAsDateFormat ? nextText : this.formatDate(nextText,
this._daylightSavingAdjust(new Date(drawYear, drawMonth + stepMonths, 1)),
this._getFormatConfig(inst)));
- var nextBigText = (showBigPrevNext ? this._get(inst, 'nextBigText') : '');
- nextBigText = (!navigationAsDateFormat ? nextBigText : this.formatDate(nextBigText,
- this._daylightSavingAdjust(new Date(drawYear, drawMonth + stepBigMonths, 1)),
- this._getFormatConfig(inst)));
- var next = '' + (this._canAdjustMonth(inst, +1, drawYear, drawMonth) ?
- '' + nextText + '' +
- (showBigPrevNext ? '' + nextBigText + '' : '') :
- (hideIfNoPrevNext ? '' : '' +
- (showBigPrevNext ? '' : ''))) + '';
+ var next = (this._canAdjustMonth(inst, +1, drawYear, drawMonth) ?
+ '' + nextText + '' :
+ (hideIfNoPrevNext ? '' : ''));
var currentText = this._get(inst, 'currentText');
var gotoDate = (this._get(inst, 'gotoCurrent') && inst.currentDay ? currentDate : today);
currentText = (!navigationAsDateFormat ? currentText :
this.formatDate(currentText, gotoDate, this._getFormatConfig(inst)));
- var html = (closeAtTop && !inst.inline ? controls : '') +
- '' + (isRTL ? next : prev) +
- (this._isInRange(inst, gotoDate) ? '' +
- (prompt ? '' + prompt + '' : '');
+ currentText + '' : '') + (isRTL ? '' : controls) + '' : '';
+
var firstDay = parseInt(this._get(inst, 'firstDay'));
firstDay = (isNaN(firstDay) ? 0 : firstDay);
var changeFirstDay = this._get(inst, 'changeFirstDay');
@@ -1440,7 +1398,6 @@
var beforeShowDay = this._get(inst, 'beforeShowDay');
var highlightWeek = this._get(inst, 'highlightWeek');
var showOtherMonths = this._get(inst, 'showOtherMonths');
- var showWeeks = this._get(inst, 'showWeeks');
var calculateWeek = this._get(inst, 'calculateWeek') || this.iso8601Week;
var weekStatus = this._get(inst, 'weekStatus');
var status = (showStatus ? this._get(inst, 'dayStatus') || initStatus : '');
@@ -1448,25 +1405,38 @@
var endDate = inst.endDay ? this._daylightSavingAdjust(
new Date(inst.endYear, inst.endMonth, inst.endDay)) : currentDate;
var defaultDate = this._getDefaultDate(inst);
- for (var row = 0; row < numMonths[0]; row++)
+
+ var html = '';
+ for (var row = 0; row < numMonths[0]; row++) {
for (var col = 0; col < numMonths[1]; col++) {
var selectedDate = this._daylightSavingAdjust(new Date(drawYear, drawMonth, inst.selectedDay));
- html += '' +
+ var cornerClass = ' ui-corner-all';
+ if (isMultiMonth) {
+ html += '';
+ }
+ html += '' +
+ (/all|left/.test(cornerClass) ? (isRTL ? next : prev) : '') +
+ (/all|right/.test(cornerClass) ? (isRTL ? prev : next) : '') +
+ (prompt ? '' + prompt + '' : '') +
this._generateMonthYearHeader(inst, drawMonth, drawYear, minDate, maxDate,
selectedDate, row > 0 || col > 0, showStatus, initStatus, monthNames) + // draw month headers
- '' +
- '' +
- (showWeeks ? '' +
- this._get(inst, 'weekHeader') + '' : '');
+ '' +
+ '';
for (var dow = 0; dow < 7; dow++) { // days of the week
var day = (dow + firstDay) % 7;
var dayStatus = (status.indexOf('DD') > -1 ? status.replace(/DD/, dayNames[day]) :
status.replace(/D/, dayNamesShort[day]));
- html += '= 5 ? ' class="ui-datepicker-week-end-cell"' : '') + '>' +
+ html += '= 5 ? ' class="ui-datepicker-week-end"' : '') + '>' +
(!changeFirstDay ? '' +
- dayNamesMin[day] + (changeFirstDay ? '' : '') + '';
+ dayNamesMin[day] + (changeFirstDay ? '' : '') + '';
}
html += ' ';
var daysInMonth = this._getDaysInMonth(drawYear, drawMonth);
@@ -1476,43 +1446,45 @@
var numRows = (isMultiMonth ? 6 : Math.ceil((leadDays + daysInMonth) / 7)); // calculate the number of rows to generate
var printDate = this._daylightSavingAdjust(new Date(drawYear, drawMonth, 1 - leadDays));
for (var dRow = 0; dRow < numRows; dRow++) { // create date picker rows
- html += '' +
- (showWeeks ? '' +
- calculateWeek(printDate) + ' ' : '');
+ html += ' ';
for (var dow = 0; dow < 7; dow++) { // create date picker days
var daySettings = (beforeShowDay ?
beforeShowDay.apply((inst.input ? inst.input[0] : null), [printDate]) : [true, '']);
var otherMonth = (printDate.getMonth() != drawMonth);
var unselectable = otherMonth || !daySettings[0] ||
(minDate && printDate < minDate) || (maxDate && printDate > maxDate);
- html += '= 5 ? ' ui-datepicker-week-end' : '') + // highlight weekends
(otherMonth ? ' ui-datepicker-other-month' : '') + // highlight days from other months
((printDate.getTime() == selectedDate.getTime() && drawMonth == inst.selectedMonth && inst._keyEvent) || // user pressed key
(defaultDate.getTime() == printDate.getTime() && defaultDate.getTime() == selectedDate.getTime()) ?
// or defaultDate is current printedDate and defaultDate is selectedDate
' ' + $.datepicker._dayOverClass : '') + // highlight selected day
- (unselectable ? ' ' + this._unselectableClass : '') + // highlight unselectable days
+ (unselectable ? ' ui-state-disabled ' + this._unselectableClass : '') + // highlight unselectable days
(otherMonth && !showOtherMonths ? '' : ' ' + daySettings[1] + // highlight custom dates
(printDate.getTime() >= currentDate.getTime() && printDate.getTime() <= endDate.getTime() ? // in current range
' ' + this._currentClass : '') + // highlight selected day
(printDate.getTime() == today.getTime() ? ' ui-datepicker-today' : '')) + '"' + // highlight today (if different)
((!otherMonth || showOtherMonths) && daySettings[2] ? ' title="' + daySettings[2] + '"' : '') + // cell title
- (unselectable ? (highlightWeek ? ' onmouseover="jQuery(this).parent().addClass(\'' + this._weekOverClass + '\');"' + // highlight selection week
- ' onmouseout="jQuery(this).parent().removeClass(\'' + this._weekOverClass + '\');"' : '') : // unhighlight selection week
+ (unselectable ? '' : '' + // actions
+ inst.id + '\',' + drawMonth + ',' + drawYear + ', jQuery(this).parent()[0]);"') + '>' + // actions
(otherMonth ? (showOtherMonths ? printDate.getDate() : ' ') : // display for other months
- (unselectable ? printDate.getDate() : '' + printDate.getDate() + '')) + ' '; // display for this month
+ (unselectable ? printDate.getDate() : printDate.getDate() + '')) + (unselectable ? '' : '') + ''; // display for this month
printDate.setDate(printDate.getDate() + 1);
printDate = this._daylightSavingAdjust(printDate);
}
@@ -1523,14 +1495,14 @@
drawMonth = 0;
drawYear++;
}
- html += '
';
+ html += '
' + (isMultiMonth ? '' : '');
}
- html += (showStatus ? '' + initStatus + '' : '') +
- (!closeAtTop && !inst.inline ? controls : '') +
- '' +
+ }
+ // HTML for button panel
+ html += (!inst.inline ? buttonPanel : '') +
($.browser.msie && parseInt($.browser.version,10) < 7 && !inst.inline ?
'' : '');
+
inst._keyEvent = false;
return html;
},
@@ -1542,15 +1514,15 @@
var changeMonth = this._get(inst, 'changeMonth');
var changeYear = this._get(inst, 'changeYear');
var showMonthAfterYear = this._get(inst, 'showMonthAfterYear');
- var html = '';
+ var html = '';
var monthHtml = '';
// month selection
if (secondary || !changeMonth)
- monthHtml += monthNames[drawMonth];
+ monthHtml += '' + monthNames[drawMonth] + ' ';
else {
var inMinYear = (minDate && minDate.getFullYear() == drawYear);
var inMaxYear = (maxDate && maxDate.getFullYear() == drawYear);
- monthHtml += '
Download in other formats:
Original Format
File jquery-ui-trunk-datepicker.patch, 28.5 KB (added by caphun, December 18, 2008 11:07AM UTC)
Index: ui.datepicker.js
===================================================================
--- ui.datepicker.js (revision 1171)
+++ ui.datepicker.js (working copy)
@@ -38,26 +38,25 @@
this._disableClass = 'ui-datepicker-disabled'; // The name of the disabled covering marker class
this._unselectableClass = 'ui-datepicker-unselectable'; // The name of the unselectable cell marker class
this._currentClass = 'ui-datepicker-current-day'; // The name of the current day marker class
- this._dayOverClass = 'ui-datepicker-days-cell-over'; // The name of the day hover marker class
+ this._dayOverClass = 'ui-state-hover'; // The name of the day hover marker class
this._weekOverClass = 'ui-datepicker-week-over'; // The name of the week hover marker class
this.regional = []; // Available regional settings, indexed by language code
this.regional[''] = { // Default regional settings
clearText: 'Clear', // Display text for clear link
clearStatus: 'Erase the current date', // Status text for clear link
- closeText: 'Close', // Display text for close link
+ closeText: 'Done', // Display text for close link
closeStatus: 'Close without change', // Status text for close link
- prevText: '<Prev', // Display text for previous month link
+ prevText: 'Prev', // Display text for previous month link
prevStatus: 'Show the previous month', // Status text for previous month link
prevBigText: '<<', // Display text for previous year link
prevBigStatus: 'Show the previous year', // Status text for previous year link
- nextText: 'Next>', // Display text for next month link
+ nextText: 'Next', // Display text for next month link
nextStatus: 'Show the next month', // Status text for next month link
nextBigText: '>>', // Display text for next year link
nextBigStatus: 'Show the next year', // Status text for next year link
currentText: 'Today', // Display text for current month link
currentStatus: 'Show the current month', // Status text for current month link
- monthNames: ['January','February','March','April','May','June',
- 'July','August','September','October','November','December'], // Names of months for drop-down and formatting
+ monthNames: ['January','February','March','April','May','June','July','August','September','October','November','December'], // Names of months for drop-down and formatting
monthNamesShort: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'], // For formatting
monthStatus: 'Show a different month', // Status text for selecting a month
yearStatus: 'Show a different year', // Status text for selecting a year
@@ -84,23 +83,18 @@
buttonText: '...', // Text for trigger button
buttonImage: '', // URL for trigger button image
buttonImageOnly: false, // True if the image appears alone, false if it appears on a button
- closeAtTop: true, // True to have the clear/close at the top,
- // false to have them at the bottom
- mandatory: false, // True to hide the Clear link, false to include it
hideIfNoPrevNext: false, // True to hide next/previous month links
// if not applicable, false to just disable them
navigationAsDateFormat: false, // True if date formatting applied to prev/today/next links
- showBigPrevNext: false, // True to show big prev/next links
gotoCurrent: false, // True if today link goes back to current selection instead
- changeMonth: true, // True if month can be selected directly, false if only prev/next
- changeYear: true, // True if year can be selected directly, false if only prev/next
+ changeMonth: false, // True if month can be selected directly, false if only prev/next
+ changeYear: false, // True if year can be selected directly, false if only prev/next
showMonthAfterYear: false, // True if the year select precedes month, false for month then year
yearRange: '-10:+10', // Range of years to display in drop-down,
// either relative to current year (-nn:+nn) or absolute (nnnn:nnnn)
changeFirstDay: true, // True to click on day name to change, false to remain as set
highlightWeek: false, // True to highlight the selected week
showOtherMonths: false, // True to show dates in other months, false to leave blank
- showWeeks: false, // True to show week of the year, false to omit
calculateWeek: this.iso8601Week, // How to calculate the week of the year,
// takes a Date and returns the number of the week for it
shortYearCutoff: '+10', // Short year values < this are in the current century,
@@ -123,15 +117,15 @@
numberOfMonths: 1, // Number of months to show at a time
showCurrentAtPos: 0, // The position in multipe months at which to show the current month (starting at 0)
stepMonths: 1, // Number of months to step back/forward
- stepBigMonths: 12, // Number of months to step back/forward for the big links
rangeSelect: false, // Allows for selecting a date range on one date picker
rangeSeparator: ' - ', // Text between two dates in a range
altField: '', // Selector for an alternate field to store selected dates into
altFormat: '', // The date format to use for the alternate field
- constrainInput: true // The input is constrained by the current date format
+ constrainInput: true, // The input is constrained by the current date format
+ showButtonPanel: false // True to show button panel, false to not show it
};
$.extend(this._defaults, this.regional['']);
- this.dpDiv = $('');
+ this.dpDiv = $('');
}
$.extend(Datepicker.prototype, {
@@ -190,7 +184,7 @@
drawMonth: 0, drawYear: 0, // month being drawn
inline: inline, // is datepicker inline or not
dpDiv: (!inline ? this.dpDiv : // presentation div
- $(''))};
+ $(''))};
},
/* Attach the date picker to an input field. */
@@ -485,26 +479,17 @@
break; // select the value on enter
case 27: $.datepicker._hideDatepicker(null, $.datepicker._get(inst, 'duration'));
break; // hide on escape
- case 33: $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- -$.datepicker._get(inst, 'stepBigMonths') :
- -$.datepicker._get(inst, 'stepMonths')), 'M');
+ case 33: $.datepicker._adjustDate(event.target, -$.datepicker._get(inst, 'stepMonths'), 'M');
break; // previous month/year on page up/+ ctrl
- case 34: $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- +$.datepicker._get(inst, 'stepBigMonths') :
- +$.datepicker._get(inst, 'stepMonths')), 'M');
+ case 34: $.datepicker._adjustDate(event.target, +$.datepicker._get(inst, 'stepMonths'), 'M');
break; // next month/year on page down/+ ctrl
- case 35: if (event.ctrlKey || event.metaKey) $.datepicker._clearDate(event.target);
- handled = event.ctrlKey || event.metaKey;
- break; // clear on ctrl or command +end
case 36: if (event.ctrlKey || event.metaKey) $.datepicker._gotoToday(event.target);
handled = event.ctrlKey || event.metaKey;
break; // current on ctrl or command +home
case 37: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, -1, 'D');
handled = event.ctrlKey || event.metaKey;
// -1 day on ctrl or command +left
- if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- -$.datepicker._get(inst, 'stepBigMonths') :
- -$.datepicker._get(inst, 'stepMonths')), 'M');
+ if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, -$.datepicker._get(inst, 'stepMonths'), 'M');
// next month/year on alt +left on Mac
break;
case 38: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, -7, 'D');
@@ -513,9 +498,7 @@
case 39: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, +1, 'D');
handled = event.ctrlKey || event.metaKey;
// +1 day on ctrl or command +right
- if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, (event.ctrlKey ?
- +$.datepicker._get(inst, 'stepBigMonths') :
- +$.datepicker._get(inst, 'stepMonths')), 'M');
+ if (event.originalEvent.altKey) $.datepicker._adjustDate(event.target, +$.datepicker._get(inst, 'stepMonths'), 'M');
// next month/year on alt +right
break;
case 40: if (event.ctrlKey || event.metaKey) $.datepicker._adjustDate(event.target, +7, 'D');
@@ -580,9 +563,6 @@
// determine sizing offscreen
inst.dpDiv.css({position: 'absolute', display: 'block', top: '-1000px'});
$.datepicker._updateDatepicker(inst);
- // fix width for dynamic number of date pickers
- inst.dpDiv.width($.datepicker._getNumberOfMonths(inst)[1] *
- $('.ui-datepicker', inst.dpDiv[0])[0].offsetWidth);
// and adjust position before showing
offset = $.datepicker._checkOffset(inst, offset, isFixed);
inst.dpDiv.css({position: ($.datepicker._inDialog && $.blockUI ?
@@ -615,7 +595,16 @@
height: inst.dpDiv.height() + 4};
inst.dpDiv.empty().append(this._generateHTML(inst)).
find('iframe.ui-datepicker-cover').
- css({width: dims.width, height: dims.height});
+ css({width: dims.width, height: dims.height})
+ .end()
+ .find('button, .ui-datepicker-prev, .ui-datepicker-next')
+ .bind('mouseover', function(){
+ $(this).addClass('ui-state-hover');
+ })
+ .bind('mouseout', function(){
+ $(this).removeClass('ui-state-hover');
+ })
+ .end();
var numMonths = this._getNumberOfMonths(inst);
inst.dpDiv[(numMonths[0] != 1 || numMonths[1] != 1 ? 'add' : 'remove') +
'Class']('ui-datepicker-multi');
@@ -707,7 +696,7 @@
/* Tidy up after a dialog display. */
_tidyDialog: function(inst) {
- inst.dpDiv.removeClass(this._dialogClass).unbind('.ui-datepicker');
+ inst.dpDiv.removeClass(this._dialogClass).unbind('.ui-datepicker-calendar');
$('.' + this._promptClass, inst.dpDiv).remove();
},
@@ -821,17 +810,6 @@
}
},
- /* Erase the input field and hide the date picker. */
- _clearDate: function(id) {
- var target = $(id);
- var inst = this._getInst(target[0]);
- if (this._get(inst, 'mandatory'))
- return;
- inst.stayOpen = false;
- inst.endDay = inst.endMonth = inst.endYear = inst.rangeStart = null;
- this._selectDate(target, '');
- },
-
/* Update the input field with the selected date. */
_selectDate: function(id, dateStr) {
var target = $(id);
@@ -1335,8 +1313,9 @@
return [inst.rangeStart || startDate,
(!inst.endYear ? inst.rangeStart || startDate :
this._daylightSavingAdjust(new Date(inst.endYear, inst.endMonth, inst.endDay)))];
- } else
- return startDate;
+ } else {
+ return startDate;
+ }
},
/* Generate the HTML for the current state of the date picker. */
@@ -1347,24 +1326,13 @@
var showStatus = this._get(inst, 'showStatus');
var initStatus = this._get(inst, 'initStatus') || ' ';
var isRTL = this._get(inst, 'isRTL');
- // build the date picker HTML
- var clear = (this._get(inst, 'mandatory') ? '' :
- '');
- var controls = '' + (isRTL ? '' : clear) +
- '' + (isRTL ? clear : '') + '';
+ var showButtonPanel = this._get(inst, 'showButtonPanel');
var prompt = this._get(inst, 'prompt');
- var closeAtTop = this._get(inst, 'closeAtTop');
var hideIfNoPrevNext = this._get(inst, 'hideIfNoPrevNext');
var navigationAsDateFormat = this._get(inst, 'navigationAsDateFormat');
- var showBigPrevNext = this._get(inst, 'showBigPrevNext');
var numMonths = this._getNumberOfMonths(inst);
var showCurrentAtPos = this._get(inst, 'showCurrentAtPos');
var stepMonths = this._get(inst, 'stepMonths');
- var stepBigMonths = this._get(inst, 'stepBigMonths');
var isMultiMonth = (numMonths[0] != 1 || numMonths[1] != 1);
var currentDate = this._daylightSavingAdjust((!inst.currentDay ? new Date(9999, 9, 9) :
new Date(inst.currentYear, inst.currentMonth, inst.currentDay)));
@@ -1393,43 +1361,33 @@
prevText = (!navigationAsDateFormat ? prevText : this.formatDate(prevText,
this._daylightSavingAdjust(new Date(drawYear, drawMonth - stepMonths, 1)),
this._getFormatConfig(inst)));
- var prevBigText = (showBigPrevNext ? this._get(inst, 'prevBigText') : '');
- prevBigText = (!navigationAsDateFormat ? prevBigText : this.formatDate(prevBigText,
- this._daylightSavingAdjust(new Date(drawYear, drawMonth - stepBigMonths, 1)),
- this._getFormatConfig(inst)));
- var prev = '' + (this._canAdjustMonth(inst, -1, drawYear, drawMonth) ?
- (showBigPrevNext ? '' + prevBigText + '' : '') +
- '' + prevText + '' :
- (hideIfNoPrevNext ? '' : (showBigPrevNext ? '' : '') +
- '')) + '';
+ var prev = (this._canAdjustMonth(inst, -1, drawYear, drawMonth) ?
+ '' + prevText + '' :
+ (hideIfNoPrevNext ? '' : ''));
var nextText = this._get(inst, 'nextText');
nextText = (!navigationAsDateFormat ? nextText : this.formatDate(nextText,
this._daylightSavingAdjust(new Date(drawYear, drawMonth + stepMonths, 1)),
this._getFormatConfig(inst)));
- var nextBigText = (showBigPrevNext ? this._get(inst, 'nextBigText') : '');
- nextBigText = (!navigationAsDateFormat ? nextBigText : this.formatDate(nextBigText,
- this._daylightSavingAdjust(new Date(drawYear, drawMonth + stepBigMonths, 1)),
- this._getFormatConfig(inst)));
- var next = '' + (this._canAdjustMonth(inst, +1, drawYear, drawMonth) ?
- '' + nextText + '' +
- (showBigPrevNext ? '' + nextBigText + '' : '') :
- (hideIfNoPrevNext ? '' : '' +
- (showBigPrevNext ? '' : ''))) + '';
+ var next = (this._canAdjustMonth(inst, +1, drawYear, drawMonth) ?
+ '' + nextText + '' :
+ (hideIfNoPrevNext ? '' : ''));
var currentText = this._get(inst, 'currentText');
var gotoDate = (this._get(inst, 'gotoCurrent') && inst.currentDay ? currentDate : today);
currentText = (!navigationAsDateFormat ? currentText :
this.formatDate(currentText, gotoDate, this._getFormatConfig(inst)));
- var html = (closeAtTop && !inst.inline ? controls : '') +
- '' + (isRTL ? next : prev) +
- (this._isInRange(inst, gotoDate) ? '' +
- (prompt ? '' + prompt + '' : '');
+ currentText + '' : '') + (isRTL ? '' : controls) + '' : '';
+
var firstDay = parseInt(this._get(inst, 'firstDay'));
firstDay = (isNaN(firstDay) ? 0 : firstDay);
var changeFirstDay = this._get(inst, 'changeFirstDay');
@@ -1440,7 +1398,6 @@
var beforeShowDay = this._get(inst, 'beforeShowDay');
var highlightWeek = this._get(inst, 'highlightWeek');
var showOtherMonths = this._get(inst, 'showOtherMonths');
- var showWeeks = this._get(inst, 'showWeeks');
var calculateWeek = this._get(inst, 'calculateWeek') || this.iso8601Week;
var weekStatus = this._get(inst, 'weekStatus');
var status = (showStatus ? this._get(inst, 'dayStatus') || initStatus : '');
@@ -1448,25 +1405,38 @@
var endDate = inst.endDay ? this._daylightSavingAdjust(
new Date(inst.endYear, inst.endMonth, inst.endDay)) : currentDate;
var defaultDate = this._getDefaultDate(inst);
- for (var row = 0; row < numMonths[0]; row++)
+
+ var html = '';
+ for (var row = 0; row < numMonths[0]; row++) {
for (var col = 0; col < numMonths[1]; col++) {
var selectedDate = this._daylightSavingAdjust(new Date(drawYear, drawMonth, inst.selectedDay));
- html += '' +
+ var cornerClass = ' ui-corner-all';
+ if (isMultiMonth) {
+ html += '';
+ }
+ html += '' +
+ (/all|left/.test(cornerClass) ? (isRTL ? next : prev) : '') +
+ (/all|right/.test(cornerClass) ? (isRTL ? prev : next) : '') +
+ (prompt ? '' + prompt + '' : '') +
this._generateMonthYearHeader(inst, drawMonth, drawYear, minDate, maxDate,
selectedDate, row > 0 || col > 0, showStatus, initStatus, monthNames) + // draw month headers
- '' +
- '' +
- (showWeeks ? '' +
- this._get(inst, 'weekHeader') + '' : '');
+ '' +
+ '';
for (var dow = 0; dow < 7; dow++) { // days of the week
var day = (dow + firstDay) % 7;
var dayStatus = (status.indexOf('DD') > -1 ? status.replace(/DD/, dayNames[day]) :
status.replace(/D/, dayNamesShort[day]));
- html += '= 5 ? ' class="ui-datepicker-week-end-cell"' : '') + '>' +
+ html += '= 5 ? ' class="ui-datepicker-week-end"' : '') + '>' +
(!changeFirstDay ? '' +
- dayNamesMin[day] + (changeFirstDay ? '' : '') + '';
+ dayNamesMin[day] + (changeFirstDay ? '' : '') + '';
}
html += ' ';
var daysInMonth = this._getDaysInMonth(drawYear, drawMonth);
@@ -1476,43 +1446,45 @@
var numRows = (isMultiMonth ? 6 : Math.ceil((leadDays + daysInMonth) / 7)); // calculate the number of rows to generate
var printDate = this._daylightSavingAdjust(new Date(drawYear, drawMonth, 1 - leadDays));
for (var dRow = 0; dRow < numRows; dRow++) { // create date picker rows
- html += '' +
- (showWeeks ? '' +
- calculateWeek(printDate) + ' ' : '');
+ html += ' ';
for (var dow = 0; dow < 7; dow++) { // create date picker days
var daySettings = (beforeShowDay ?
beforeShowDay.apply((inst.input ? inst.input[0] : null), [printDate]) : [true, '']);
var otherMonth = (printDate.getMonth() != drawMonth);
var unselectable = otherMonth || !daySettings[0] ||
(minDate && printDate < minDate) || (maxDate && printDate > maxDate);
- html += '= 5 ? ' ui-datepicker-week-end' : '') + // highlight weekends
(otherMonth ? ' ui-datepicker-other-month' : '') + // highlight days from other months
((printDate.getTime() == selectedDate.getTime() && drawMonth == inst.selectedMonth && inst._keyEvent) || // user pressed key
(defaultDate.getTime() == printDate.getTime() && defaultDate.getTime() == selectedDate.getTime()) ?
// or defaultDate is current printedDate and defaultDate is selectedDate
' ' + $.datepicker._dayOverClass : '') + // highlight selected day
- (unselectable ? ' ' + this._unselectableClass : '') + // highlight unselectable days
+ (unselectable ? ' ui-state-disabled ' + this._unselectableClass : '') + // highlight unselectable days
(otherMonth && !showOtherMonths ? '' : ' ' + daySettings[1] + // highlight custom dates
(printDate.getTime() >= currentDate.getTime() && printDate.getTime() <= endDate.getTime() ? // in current range
' ' + this._currentClass : '') + // highlight selected day
(printDate.getTime() == today.getTime() ? ' ui-datepicker-today' : '')) + '"' + // highlight today (if different)
((!otherMonth || showOtherMonths) && daySettings[2] ? ' title="' + daySettings[2] + '"' : '') + // cell title
- (unselectable ? (highlightWeek ? ' onmouseover="jQuery(this).parent().addClass(\'' + this._weekOverClass + '\');"' + // highlight selection week
- ' onmouseout="jQuery(this).parent().removeClass(\'' + this._weekOverClass + '\');"' : '') : // unhighlight selection week
+ (unselectable ? '' : '' + // actions
+ inst.id + '\',' + drawMonth + ',' + drawYear + ', jQuery(this).parent()[0]);"') + '>' + // actions
(otherMonth ? (showOtherMonths ? printDate.getDate() : ' ') : // display for other months
- (unselectable ? printDate.getDate() : '' + printDate.getDate() + '')) + ' '; // display for this month
+ (unselectable ? printDate.getDate() : printDate.getDate() + '')) + (unselectable ? '' : '') + ''; // display for this month
printDate.setDate(printDate.getDate() + 1);
printDate = this._daylightSavingAdjust(printDate);
}
@@ -1523,14 +1495,14 @@
drawMonth = 0;
drawYear++;
}
- html += '
';
+ html += '
' + (isMultiMonth ? '' : '');
}
- html += (showStatus ? '' + initStatus + '' : '') +
- (!closeAtTop && !inst.inline ? controls : '') +
- '' +
+ }
+ // HTML for button panel
+ html += (!inst.inline ? buttonPanel : '') +
($.browser.msie && parseInt($.browser.version,10) < 7 && !inst.inline ?
'' : '');
+
inst._keyEvent = false;
return html;
},
@@ -1542,15 +1514,15 @@
var changeMonth = this._get(inst, 'changeMonth');
var changeYear = this._get(inst, 'changeYear');
var showMonthAfterYear = this._get(inst, 'showMonthAfterYear');
- var html = '';
+ var html = '';
var monthHtml = '';
// month selection
if (secondary || !changeMonth)
- monthHtml += monthNames[drawMonth];
+ monthHtml += '' + monthNames[drawMonth] + ' ';
else {
var inMinYear = (minDate && minDate.getFullYear() == drawYear);
var inMaxYear = (maxDate && maxDate.getFullYear() == drawYear);
- monthHtml += '
Download in other formats:
Original Format