in tapestry-framework/src/org/apache/tapestry/form/DatePicker.js [102:462]
Calendar.prototype.create = function() {
var div;
var table;
var tbody;
var tr;
var td;
var dp = this;
// Create the top-level div element
this._calDiv = document.createElement("div");
this._calDiv.className = "calendar";
this._calDiv.style.position = "absolute";
this._calDiv.style.display = "none";
this._calDiv.style.border = "1px solid WindowText";
this._calDiv.style.textAlign = "center";
this._calDiv.style.background = "Window";
this._calDiv.style.zIndex = "400";
// header div
div = document.createElement("div");
div.className = "calendarHeader";
div.style.background = "ActiveCaption";
div.style.padding = "3px";
div.style.borderBottom = "1px solid WindowText";
this._calDiv.appendChild(div);
table = document.createElement("table");
table.style.cellSpacing = 0;
div.appendChild(table);
tbody = document.createElement("tbody");
table.appendChild(tbody);
tr = document.createElement("tr");
tbody.appendChild(tr);
// Previous Month Button
td = document.createElement("td");
this._previousMonth = document.createElement("button");
this._previousMonth.className = "prevMonthButton"
this._previousMonth.appendChild(document.createTextNode("<<"));
//this._previousMonth.appendChild(document.createTextNode(String.fromCharCode(9668)));
td.appendChild(this._previousMonth);
tr.appendChild(td);
//
// Create the month drop down
//
td = document.createElement("td");
td.className = "labelContainer";
tr.appendChild(td);
this._monthSelect = document.createElement("select");
for (var i = 0 ; i < this._monthNames.length ; i++) {
var opt = document.createElement("option");
opt.innerHTML = this._monthNames[i];
opt.value = i;
if (i == this._currentDate.getMonth()) {
opt.selected = true;
}
this._monthSelect.appendChild(opt);
}
td.appendChild(this._monthSelect);
//
// Create the year drop down
//
td = document.createElement("td");
td.className = "labelContainer";
tr.appendChild(td);
this._yearSelect = document.createElement("select");
for(var i=1920; i < 2050; ++i) {
var opt = document.createElement("option");
opt.innerHTML = i;
opt.value = i;
if (i == this._currentDate.getFullYear()) {
opt.selected = false;
}
this._yearSelect.appendChild(opt);
}
td.appendChild(this._yearSelect);
td = document.createElement("td");
this._nextMonth = document.createElement("button");
this._nextMonth.appendChild(document.createTextNode(">>"));
//this._nextMonth.appendChild(document.createTextNode(String.fromCharCode(9654)));
this._nextMonth.className = "nextMonthButton";
td.appendChild(this._nextMonth);
tr.appendChild(td);
// Calendar body
div = document.createElement("div");
div.className = "calendarBody";
this._calDiv.appendChild(div);
this._table = div;
// Create the inside of calendar body
var text;
table = document.createElement("table");
//table.style.width="100%";
table.className = "grid";
table.style.font = "small-caption";
table.style.fontWeight = "normal";
table.style.textAalign = "center";
table.style.color = "WindowText";
table.style.cursor = "default";
table.cellPadding = "3";
table.cellSpacing = "0";
div.appendChild(table);
var thead = document.createElement("thead");
table.appendChild(thead);
tr = document.createElement("tr");
thead.appendChild(tr);
// weekdays header
if (this._includeWeek) {
td = document.createElement("th");
text = document.createTextNode("w");
td.appendChild(text);
td.className = "weekNumberHead";
td.style.textAlign = "left";
tr.appendChild(td);
}
for(i=0; i < 7; ++i) {
td = document.createElement("th");
text = document.createTextNode(this._shortWeekDayNames[(i+this._firstDayOfWeek)%7]);
td.appendChild(text);
td.className = "weekDayHead";
td.style.fontWeight = "bold";
td.style.borderBottom = "1px solid WindowText";
tr.appendChild(td);
}
// Date grid
tbody = document.createElement("tbody");
table.appendChild(tbody);
for(week=0; week<6; ++week) {
tr = document.createElement("tr");
tbody.appendChild(tr);
if (this._includeWeek) {
td = document.createElement("td");
td.className = "weekNumber";
td.style.fontWeight = "normal";
td.style.borderRight = "1px solid WindowText";
td.style.textAlign = "left";
text = document.createTextNode(String.fromCharCode(160));
td.appendChild(text);
//setCursor(td);
td.align="center";
tr.appendChild(td);
var tmp = new Object();
tmp.tag = "WEEK";
tmp.value = -1;
tmp.data = text;
this._weekSlot[week] = tmp;
}
for(day=0; day<7; ++day) {
td = document.createElement("td");
text = document.createTextNode(String.fromCharCode(160));
td.appendChild(text);
setCursor(td);
td.align="center";
td.style.fontWeight="normal";
tr.appendChild(td);
var tmp = new Object();
tmp.tag = "DATE";
tmp.value = -1;
tmp.data = text;
this._dateSlot[(week*7)+day] = tmp;
}
}
// Calendar Footer
div = document.createElement("div");
div.className = "calendarFooter";
this._calDiv.appendChild(div);
table = document.createElement("table");
//table.style.width="100%";
table.className = "footerTable";
table.cellSpacing = 0;
div.appendChild(table);
tbody = document.createElement("tbody");
table.appendChild(tbody);
tr = document.createElement("tr");
tbody.appendChild(tr);
//
// The TODAY button
//
td = document.createElement("td");
this._todayButton = document.createElement("button");
var today = new Date();
var buttonText = today.getDate() + " " + this._monthNames[today.getMonth()] + ", " + today.getFullYear();
this._todayButton.appendChild(document.createTextNode(buttonText));
td.appendChild(this._todayButton);
tr.appendChild(td);
//
// The CLEAR button
//
td = document.createElement("td");
this._clearButton = document.createElement("button");
var today = new Date();
buttonText = "Clear";
this._clearButton.appendChild(document.createTextNode(buttonText));
td.appendChild(this._clearButton);
tr.appendChild(td);
this._update();
this._updateHeader();
// IE55+ extension
this._previousMonth.hideFocus = true;
this._nextMonth.hideFocus = true;
this._todayButton.hideFocus = true;
// end IE55+ extension
// hook up events
// buttons
this._previousMonth.onclick = function () {
dp.prevMonth();
};
this._nextMonth.onclick = function () {
dp.nextMonth();
};
this._todayButton.onclick = function () {
dp.setSelectedDate(new Date());
dp.hide();
};
this._clearButton.onclick = function () {
dp.clearSelectedDate();
dp.hide();
};
this._calDiv.onselectstart = function () {
return false;
};
this._table.onclick = function (e) {
// find event
if (e == null) e = document.parentWindow.event;
// find td
var el = e.target != null ? e.target : e.srcElement;
while (el.nodeType != 1)
el = el.parentNode;
while (el != null && el.tagName && el.tagName.toLowerCase() != "td")
el = el.parentNode;
// if no td found, return
if (el == null || el.tagName == null || el.tagName.toLowerCase() != "td")
return;
var d = new Date(dp._currentDate);
var n = Number(el.firstChild.data);
if (isNaN(n) || n <= 0 || n == null)
return;
if (el.className == "weekNumber")
return;
d.setDate(n);
dp.setSelectedDate(d);
if (!dp._alwaysVisible && dp._hideOnSelect) {
dp.hide();
}
};
this._calDiv.onkeydown = function (e) {
if (e == null) e = document.parentWindow.event;
var kc = e.keyCode != null ? e.keyCode : e.charCode;
if(kc == 13) {
var d = new Date(dp._currentDate).valueOf();
dp.setSelectedDate(d);
if (!dp._alwaysVisible && dp._hideOnSelect) {
dp.hide();
}
return false;
}
if (kc < 37 || kc > 40) return true;
var d = new Date(dp._currentDate).valueOf();
if (kc == 37) // left
d -= 24 * 60 * 60 * 1000;
else if (kc == 39) // right
d += 24 * 60 * 60 * 1000;
else if (kc == 38) // up
d -= 7 * 24 * 60 * 60 * 1000;
else if (kc == 40) // down
d += 7 * 24 * 60 * 60 * 1000;
dp.setCurrentDate(new Date(d));
return false;
}
// ie6 extension
this._calDiv.onmousewheel = function (e) {
if (e == null) e = document.parentWindow.event;
var n = - e.wheelDelta / 120;
var d = new Date(dp._currentDate);
var m = d.getMonth() + n;
d.setMonth(m);
dp.setCurrentDate(d);
return false;
}
this._monthSelect.onchange = function(e) {
if (e == null) e = document.parentWindow.event;
e = getEventObject(e);
dp.setMonth(e.value);
}
this._monthSelect.onclick = function(e) {
if (e == null) e = document.parentWindow.event;
e = getEventObject(e);
e.cancelBubble = true;
}
this._yearSelect.onchange = function(e) {
if (e == null) e = document.parentWindow.event;
e = getEventObject(e);
dp.setYear(e.value);
}
document.body.appendChild(this._calDiv);
return this._calDiv;
}