/** * options: * value Date или объект {year,month,day}} -- дата, для которой показывать календарь * если в объекте указаны только {year,month}, то день не выбран */ function Calendar(options) { var self = this; var monthNames = 'Январь Февраль Март Апрель Май Июнь Июль Август Сентябрь Октябрь Ноябрь Декабрь'.split(' '); var elem; var year, month, day; var showYear, showMonth; parseValue(options.value); // ----------------------- this.getElement = function() { if (!elem) { render(); } return elem; }; this.getValue = function() { return day ? new Date(year, month, day) : null; }; function parseValue(value) { if (value instanceof Date) { year = value.getFullYear(); month = value.getMonth(); day = value.getDate(); } else { year = value.year; month = value.month; day = value.day; } } /** * Установить значение календаря * @param newValue {Date или объект {year,month[,day]} Новое значение * @param quiet Если true, то событие не генерируется */ this.setValue = function(newValue, quiet) { parseValue(newValue); if (elem) { clearSelected(); render(); } if (!quiet) { $(self).triggerHandler({ type: "select", value: new Date(year, month, day) }); } }; function render() { if (!elem) { elem = $('
') .on('click', '.date-cell', onDateCellClick); } if (showYear != year || showMonth != month) { elem.html(renderCalendarTable(year, month)); elem.find('caption').html(monthNames[month]+' '+year); showYear = year; showMonth = month; } if (day) { var num = getCellByDate(new Date(year, month, day)); elem.find('td').eq(num).addClass("selected"); } } function clearSelected() { elem.find('.selected').removeClass('selected'); } function onDateCellClick(e) { day = $(e.target).html(); self.setValue({year: year, month: month, day: day}); } /** * Возвращает по дате номер TD в таблице * Использование: * var td = table.getElementsByTagName('td')[getCellByDate(date)] */ function getCellByDate(date) { var dateDayOne = new Date(date.getFullYear(), date.getMonth(), 1); return getDay(dateDayOne) + date.getDate() - 1; } /** * получить номер дня недели для date, от 0(пн) до 6(вс) * @param date */ function getDay(date) { // var day = date.getDay(); if (day == 0) day = 7; return day - 1; } /** * Генерирует таблицу для календаря заданного месяца/года */ function renderCalendarTable(year, month) { var d = new Date(year, month); var table = ['пн | вт | ср | чт | пт | сб | вс |
---|---|---|---|---|---|---|
'+d.getDate()+' | '); if (getDay(d) % 7 == 6) { // вс, последний день - перевод строки table.push('||||||
'); } } table.push(' |