(function($) {
function firstOfMonth(d) {
return new Date(d.getFullYear(), d.getMonth(), 1);
}
function sameDate(d1, d2) {
return d1.getFullYear() == d2.getFullYear() &&
d1.getMonth() == d2.getMonth() &&
d1.getDate() == d2.getDate();
}
function renderCalendar(dateForMonth, selectedDate) {
function dayOfWeekHeaders() {
var dayLabels = ['S', 'M', 'T', 'W', 'T', 'F', 'S'];
output.push('<tr>');
for (var i = 0; i < 7; i++) {
output.push('<th>');
output.push(dayLabels[i]);
output.push('</th>');
}
output.push('</tr>');
}
function blankDaysBeforeFirst(dateForFirst) {
for (var i = 0; i < dateForFirst.getDay(); i++) {
output.push('<td></td>');
}
}
function blankDaysAfterLast(dayOfWeek) {
if (dayOfWeek != 6) {
for (var i = dayOfWeek; i < 6; i++) {
output.push('<td></td>');
}
output.push('</tr>');
}
}
function dayCell(date) {
if (sameDate(date, selectedDate)) {
output.push('<td class="selected">');
output.push(d.getDate());
output.push('</td>');
} else {
output.push('<td><a href=#>');
output.push(d.getDate());
output.push('</a></td>');
}
}
var output = [];
output.push('<table class="calendar">');
dayOfWeekHeaders();
output.push('<tr>');
blankDaysBeforeFirst(dateForMonth);
var currentMonth = dateForMonth.getMonth();
var d = firstOfMonth(dateForMonth);
while (d.getMonth() == currentMonth) {
var dayOfWeek = d.getDay();
if (dayOfWeek == 0 && d.getDate() != 1) {
output.push('<tr>');
}
dayCell(d);
if (dayOfWeek == 6) {
output.push('</tr>');
}
d.setDate(d.getDate() + 1);
}
d.setDate(d.getDate() - 1); // Go back to last day of month...
blankDaysAfterLast(d.getDay());
output.push('</table>');
return output.join('');
}
$.fn.calendar = function() {
return this.each(function() {
var $cal = $(this);
var selectedDate = new Date();
var displayedMonthDate = firstOfMonth(selectedDate);
var renderHtml = function() {
$cal.html(renderCalendar(displayedMonthDate, selectedDate));
$("a", $cal).click(function(ev) {
var dayOfMonth = parseInt($(this).text());
selectedDate = new Date(
displayedMonthDate.getFullYear(),
displayedMonthDate.getMonth(),
dayOfMonth
);
renderHtml();
$cal.trigger('selectedDateChanged', [selectedDate]);
});
};
$cal.bind('showPrevMonth', function() {
var month = displayedMonthDate.getMonth() - 1;
displayedMonthDate.setMonth(month);
renderHtml();
$cal.trigger('monthChanged', [displayedMonthDate]);
});
$cal.bind('showNextMonth', function() {
var month = displayedMonthDate.getMonth() + 1;
displayedMonthDate.setMonth(month);
renderHtml();
$cal.trigger('monthChanged', [displayedMonthDate]);
});
$cal.bind('setSelectedDate', function(ev, date) {
selectedDate = date;
renderHtml();
$cal.trigger('selectedDateChanged', [selectedDate]);
});
renderHtml();
});
};
})(jQuery);