Для одно проекта делал date-picker, в js новичек. Сие чудо работает кросс-браузерно, но хотелось бы услышать, что можно улучшить, оптимизировать, где явные ошибки. Буду признателен
function calendar(holder,input) {
this.oDate = new Date();
this.year = ( this.year == null ) ? this.oDate.getFullYear() : this.year;
this.month = this.oDate.getMonth();
this.today = this.oDate.getDay()
this.daysTotal = new Date(this.year, this.month + 1,0).getDate();
this.firstDay = new Date(this.year, this.month, 1).getDay();
this.holder = holder;
this.months = ['Январь', 'Февраль', 'Март', 'Апрель', 'Май', 'Июнь', 'Июль', 'Август', 'Сентябрь', 'Октябрь', 'Ноябрь', 'Декабрь'];
this.days = ['Пн', 'Вт', 'Ср', 'Чт', 'Пт', 'Сб', 'Вс'];
this.countMonth = countMonth;
function countMonth() {
this.daysTotal = new Date(this.year, this.month + 1,0).getDate();
this.firstDay = new Date(this.year, this.month, 1).getDay();
}
this.render = function() {
function dc(a) {
return document.createElement(a);
}
function ct(a) {
return document.createTextNode(a);
}
var table = dc("table");
table.className = "js_cal";
var thead = dc("thead");
var tr = dc("tr");
var td = dc("td");
var th = dc("th");
//alert(this.year)
var span = dc("span");
var span_text = ct("<");
var cal_obj = this;
span.onclick = function() { if(cal_obj.month == 0) { cal_obj.year -= 1; cal_obj.month = 11; } else {cal_obj.month -=1;} cal_obj.countMonth(); cal_obj.render(); };
span.appendChild(span_text)
var th = dc("th");
th.appendChild(span);
tr.appendChild(th);
var month_caption = ct(this.months[this.month] + " " + cal_obj.year);
var th = dc("th");
th.setAttribute("colSpan", "5");
th.appendChild(month_caption);
tr.appendChild(th);
var span = dc("span");
var span_text = ct(">");
span.onclick = function() { if(cal_obj.month == 11) { cal_obj.year += 1; cal_obj.month = 0; } else {cal_obj.month +=1;} cal_obj.countMonth(); cal_obj.render(); }
span.appendChild(span_text)
var th = dc("th");
th.appendChild(span);
tr.appendChild(th);
thead.appendChild(tr);
table.appendChild(thead)
var tbody = dc("tbody");
var tr = dc("tr");
for (i = 0; i < 7; i++){
var day_caption = document.createTextNode(this.days[i]);
var td = dc("td");
td.appendChild(day_caption);
tr.appendChild(td);
tbody.appendChild(tr);
}
table.appendChild(tbody);
if (this.firstDay == 0) this.firstDay = 7;
var v = Math.ceil((this.daysTotal + this.firstDay - 1) / 7)
//alert("Days Total:" + this.daysTotal + "\n" + "First Day:" + this.firstDay + "\n" + "v:" + v)
var tbody = dc("tbody");
day = 1;
for(i = 0; i < v; i++){
var tr = dc("tr")
for(j = 0; j < 7; j++){
if(day <= this.daysTotal && (i > 0 || j >= this.firstDay-1)){
var day_n = document.createTextNode(day);
var td = dc("td");
td.setAttribute("Class","date");
td.appendChild(day_n);
td.onclick = selectDate;
tr.appendChild(td)
day++;
}
else{
var empty = document.createTextNode(" ");
var td = dc("td");
td.appendChild(empty);
tr.appendChild(td);
}
tbody.appendChild(tr)
}
table.appendChild(tbody);
}
var holder = document.getElementById(this.holder);
if (holder.lastChild) holder.removeChild(holder.lastChild);
holder.appendChild(table);
this.cells = document.getElementById(this.holder).getElementsByTagName("tbody")[1].getElementsByTagName('td');
function selectDate() {
for( i = 0; i < cal_obj.cells.length; i++ ){
if(cal_obj.cells[i].innerHTML!=" "){
cal_obj.cells[i].className = "date";
}
}
document.getElementById(input).value = this.innerHTML + "/" + ((cal_obj.month == 0)?1:cal_obj.month + 1) + "/" + cal_obj.year;
(this.className == "active") ? this.className = "date" : this.className = "active";
}
}
}
cal = new calendar("holder","from_date");
cal2 = new calendar("holder2","to_date");