function absLeft(el) {
	return (el.offsetParent) ? el.offsetLeft + absLeft(el.offsetParent) : el.offsetLeft;
}

function absTop(el) {
	return (el.offsetParent) ? el.offsetTop+absTop(el.offsetParent) : el.offsetTop;
}

var x = 0;
var y = 0;

var target;

var monthNames = new Array
	(
		"Januar",
		"Februar",
		"März",
		"April",
		"Mai",
		"Juni",
		"Juli",
		"August",
		"September",
		"Oktober",
		"November",
		"Dezember"
	);
var weekdayNames = new Array
	(
		"Mo",
		"Di",
		"Mi",
		"Do",
		"Fr",
		"Sa",
		"So"
	);

/* set calender data - this function will called when a date in the calendar has been clicked */
function setCalDate(calDate) {

	target.value = calDate;
	hideCal();

}

/* this function shows the layer with the calender */
function showCal(month, year, this_target, el, span_past, span_future) {

	target = this_target;
	getCal(month, year, span_past, span_future);
	var cal = document.getElementById('cal');
	var overlay = document.getElementById('overlay');

	x=absLeft(el)+5;
	y=absTop(el)+5;
	cal.style.left = x + 'px';
	cal.style.top = y + 'px';
	cal.style.display = "block";

	/* this is an fix, because some browsers will not show layers above a dropwown */
	overlay.style.width = cal.offsetWidth;
	overlay.style.height = cal.offsetHeight;
	overlay.style.top = cal.style.top;
	overlay.style.left = cal.style.left;
	overlay.style.zIndex = cal.style.zIndex - 1;
	if(!window.netscape)
		overlay.style.display = "block";

}

/* this function hides the calendar */
function hideCal() {

	var cal = document.getElementById('cal');
	var overlay = document.getElementById('overlay');
	
	cal.style.display = "none";
	if(!window.netscape)
		overlay.style.display = "none";

}

/* this function build the calender with given date. when empty actual date will shown */
function getCal(month, year, span_past, span_future) {

	if (isNaN(span_past))
		span_past = -1;
	if (isNaN(span_future))
		span_future = -1;
	var day = 1;
	var html;
	var firstDay = new Date();

	// get actual date
	var actDay = firstDay.getDate();
	var actMonth = firstDay.getMonth();
	var actYear = firstDay.getYear();

	// get acual date if none date given
	if (isNaN(month) || month == 0)
		month = actMonth + 1;
	if (isNaN(year) || year == 0)
		year = actYear;

	if (year < 999)
		year += 1900;
	if (actYear < 999)
		actYear += 1900;

	if (month == 13) {
		month = 1;
		year++;
	} else if (month == 0) {
		month = 12;
		year--;
	}

	firstDay.setMonth(month-1);
	firstDay.setYear(year);
	firstDay.setDate(1);

	html = '<table border="0" cellpadding="0" cellspacing="0">\n';
	html += '	<tr>\n'
	html += '		<td align="center">\n';
	html += '			<a href="#" onCLick="getCal(' + month + ', ' + eval(firstDay.getYear()-1) + ',' + span_past + ',' + span_future + '); return false;" class="cal">&laquo;</a>\n';
	html += '		</td>\n';
	html +=	'		<td colspan="5" class="calYear">' + year + '</td>\n';
	html += '		<td align="center">';
	html += '			<a href="#" onCLick="getCal(' + month + ', ' + eval(firstDay.getYear()+1) + ',' + span_past + ',' + span_future + '); return false;" class="cal">&raquo;</a>\n';
	html += '		</td>\n';
	html += '	</tr>\n';
	html += '	<tr>\n';
	html += '		<td align="center">\n';
	html += '			<a href="#" onCLick="getCal(' + ((month-1==0) ? '12' : eval(month-1)) + ', ' + ((month-1==0) ? firstDay.getYear()-1 : firstDay.getYear()) + ',' + span_past + ',' + span_future + '); return false;" class="cal">&laquo;</a>\n';
	html += '		</td>\n';
	html += '		<td colspan="5" class="calMonth">' + monthNames[firstDay.getMonth()] + '</td>\n';
	html += '		<td align="center">\n';
	html += '			<a href="#" onCLick="getCal(' + eval(month+1) + ', ' + firstDay.getYear() + ',' + span_past + ',' + span_future + '); return false;" class="cal">&raquo;</a>\n';
	html += '</td>\n';
	html += '	</tr>\n';
	html += '	<tr>\n';
	html += '		<td colspan="7" style="border-bottom: 1px solid #999999;"><img src="blank.gif" width="1" height="5" border="0" alt=""><br></td>\n';
	html += '	</tr>\n';
	html += '	<tr>\n';
	/* with set manually for our friend ie */
	html += '		<td width="16" class="calDayWD">' + weekdayNames[0] + '</td><td width="16" class="calDayWD">' + weekdayNames[1] + '</td>\n';
	html += '		<td width="16" class="calDayWD">' + weekdayNames[2] + '</td><td width="16" class="calDayWD">' + weekdayNames[3] + '</td>\n';
	html += '		<td width="16" class="calDayWD">' + weekdayNames[4] + '</td><td width="16" class="calDayWE">' + weekdayNames[5] + '</td>\n';
	html += '		<td width="16" class="calDayWE">' + weekdayNames[6] + '</td>\n';
	html += '	</tr>\n';

	for (var i = 0; i < 6; i++) {

		html += '<tr>';
		for (var c = 1; c < 8; c++) {

			d = (c == 7) ? 0 : c;


			if ((day != 1 || firstDay.getDay() == d) && firstDay.getDate() == day) {

				var cssClass = (day == actDay && firstDay.getMonth() == actMonth && year == actYear) ? "calActDay" : "calDay";
				thisDay = (day < 10) ? '0' + day : day;
				thisMonth = (month < 10) ? '0' + month : month;
				thisDate = thisDay + "." + thisMonth + "." + year;
				
				actUTC = Date.UTC(actYear, actMonth, actDay, 0, 0, 0, 0)/1000;
				thisUTC = Date.UTC(year, month-1, day, 0, 0, 0, 0)/1000;
				if ((span_past == -1 || thisUTC >= (actUTC-span_past*3600*24)) && (span_future == -1 || thisUTC <= (actUTC+span_future*3600*24)) ) 
					html += '		<td align="center" class="' + cssClass + '" onMouseOver="this.className = \'calDayOn\';" onMouseOut="this.className = \'' + cssClass + '\';" onClick="setCalDate(\'' + thisDate + '\');"><a href="#" onClick="setCalDate(\'' + thisDate + '\'); return false;" class="' + cssClass + '">' + day + '</a></td>\n';
				else
					html += '		<td align="center" class="' + cssClass + '">' + day + '</td>\n';
				day++;
				firstDay.setDate(day);

			} else {

				html += '		<td class="calDayEmpty">&nbsp;</td>\n';

			}

		}

		html += '	</tr>\n';

	}
	html += '	<tr>\n';
	html += '		<td colspan="7" style="border-top: 1px solid #999999;"><img src="blank.gif" width="1" height="5" border="0" alt=""><br></td>\n';
	html +=	'	</tr>\n';
	html += '	<tr>\n';
	html += '		<td align="center" colspan="7">[ <a href="#" onClick="hideCal(); return false;" class="cal">schliessen</a> ]</td>\n';
	html += '	</tr>\n';
	html += '</table>\n';
	document.getElementById('cal').innerHTML = html;

}