/**
/*	Class: 			Calendar
/*	Description:	Implements a popup calendar for selecting a date.
/*	Author:			P. Spreeuwers
/*	
**/
function findPos(obj) {
	var curleft = curtop = 0;
	if (obj.offsetParent) {
		curleft = obj.offsetLeft;
		curtop = obj.offsetTop;
		while (obj = obj.offsetParent) {
			curleft += obj.offsetLeft;
			curtop += obj.offsetTop;
		}
	}
	return {left:curleft, top:curtop};
}
/*========================================================================*/
function toggleCalendar(element, onselect) {
// utility function to bind a calendar to an element.
// displays or hides a calender right below the given element
// the calender executes the 'onselect' function if a date is selected.
// the 'onselect' function can use the this.date property to obtain the selected date.
// the 'body' onclick event is saved

    if(element.calendar == null) {
    	var pos = findPos(element);
		element.calendar = new Calendar(new Date(), pos.top + element.clientHeight + 4, pos.left, onselect);
		element.calendar.render();
	} else {
		element.calendar.toggle();
	}
	return false;
}
/*========================================================================*/
function Calendar(date, top, left, onselect) {
	// Constructor
	this.date = new Date(date.getFullYear(), date.getMonth(), date.getDate());
	this.year = date.getFullYear();
	this.month = date.getMonth();
	//this.date.setDate(1);
	this.top = top;
	this.left = left;
	this.onselect = onselect;
}
/*========================================================================*/
Calendar.prototype.render = function() { 
	var width = "200px";
	var height = "180px";
	
	this.div = document.createElement("div");
	this.div.style.left = this.left + "px";
	this.div.style.top =  this.top + "px";
	this.div.style.width = width;
	this.div.style.height =  height;
	this.div.style.position = "absolute";
	this.div.className = "calendar";

	// create an iframe to protect this div from z-index ignoring select boxes
	this.protectMe = document.createElement("iframe");
	this.protectMe.style.left = "0px";
	this.protectMe.style.top =  "0px";
	this.protectMe.style.width = width;
	this.protectMe.style.height =  height;
	this.protectMe.style.position = "absolute";
	this.protectMe.className = "calendar";
	
	// overlay iframe with div for calendar
	this.overlay = document.createElement("div");
	this.overlay.style.left = "0px";
	this.overlay.style.top =  "0px";
	this.overlay.style.width = width;
	this.overlay.style.height =  height;
	this.overlay.style.position = "absolute";
	this.overlay.className = "calendar";
	
	var table = document.createElement("table");
	table.className = "calendar";
	table.style.width = width;
	table.style.height = height;
	var tbody = document.createElement("tbody");
	tbody.className = "calendar";
	table.appendChild(tbody);
	
	//header showing 'selected' date and close button
	var headerRow = document.createElement("tr");
	headerRow.className = "header";
	var cell = document.createElement("td");
	cell.className = "header";
	cell.setAttribute("colSpan", "7");
	cell.innerHTML = this.date.getDate() + " " + getMonthName(this.date) + ", " + this.date.getFullYear();
	headerRow.appendChild(cell);
	tbody.appendChild(headerRow);
	
	// navigation buttons 
	var navigationRow = document.createElement("tr");
	navigationRow.className = "calendar";
	var cell = document.createElement("td");
	cell.className = "navigation";
	cell.setAttribute("colSpan", "7");
	cell.appendChild(this.createButton("prevYear", " << ", function() { this.owner.prevYear(); return false; }));
	cell.appendChild(this.createButton("prevMonth", " < ", function() { this.owner.prevMonth(); return false; }));
	var text = document.createElement("span");
	text.className = "monthLabel";
	text.innerHTML = getMonthName(new Date(this.year, this.month, 1)) + " " + this.year; 
	cell.appendChild(text);
	cell.appendChild(this.createButton("nextMonth", " > ", function() { this.owner.nextMonth(); return false; }));
	cell.appendChild(this.createButton("nextYear", " >> ", function() { this.owner.nextYear(); return false; }));
	navigationRow.appendChild(cell);

	tbody.appendChild(navigationRow);
	
	// calculate first day of calendar, this variable will be the loop variable
	var d = new Date(this.year, this.month, 1);	
	d.setDate(d.getDate() - d.getDay());	
	// determine first date of next month
	var firstDateNextMonth = new Date(this.year, this.month, 1);	
	firstDateNextMonth.setDate(1);
	firstDateNextMonth.setMonth(firstDateNextMonth.getMonth()+1);

	// make header with day-names
	var row = document.createElement("tr");
	for(var i = 0; i < 7; i++) {
		var cell = document.createElement("td");
		cell.className = "columnHeader";
		cell.innerHTML = d.toLocaleString().split(" ")[0].substring(0,2);
	    d.setDate(d.getDate() + 1);
	    row.appendChild(cell);
	}
	tbody.appendChild(row);
	
	// reset d
    d.setDate(d.getDate() - 7);
		
	for(;d < firstDateNextMonth;) {
		var row = document.createElement("tr");
		for(var day = 0; day < 7; day++) {
		    var cell = document.createElement("td");
		    var btn = document.createElement("a");
		    btn.owner = this;
		    btn.date = new Date(d);

		    btn.onclick = function() { this.owner.date = this.date; this.owner.onselect(); return false;};
		    
		    if(d.getMonth() == this.month) {
			    cell.className = "inMonth";
			}
		    if(d.getMonth()!= this.month) {
			    cell.className = "notInMonth";
			}
		    if(d.getFullYear() == this.date.getFullYear() & d.getMonth() == this.date.getMonth() & d.getDate() == this.date.getDate()) {
			    cell.className = "selected";
			}
			
		    btn.setAttribute("href", "");
		    btn.innerHTML =  d.getDate();
		    if(btn.innerHTML.length < 2) {
			   btn.innerHTML = "0" + btn.innerHTML;
		    }
		    cell.appendChild(btn);
		    row.appendChild(cell);

		    d.setDate(d.getDate() + 1);
		}
		tbody.appendChild(row);
	}
	
	this.overlay.appendChild(table);
	this.div.appendChild(this.protectMe);	
	this.div.appendChild(this.overlay);	

	document.body.appendChild(this.div);
}
/*========================================================================*/
function getMonthName(date) {
	// returns the right Monthname for the current browserlanguage 
	// technique: first construct localeStrings 1 february 2006 and 1 march 2006
	// (both a wednesday)
	// split both strings and find the part that differs, that must be the monthPart
	// return montPart for currentDate.
	var d1 = (new Date(2006,1,1)).toLocaleString().split(" ");
	var d2 = (new Date(2006,2,1)).toLocaleString().split(" ");
	var i = 0;
	for(i=0;i < d1.length & d1[i] == d2[i]; i++);
	var nameParts = date.toLocaleString().split(" ");
	return nameParts[i];
}

Calendar.prototype.getMonthName = function() {
	// returns the right Monthname for the current browserlanguage 
	
	// technique: first construct localeStrings 1 february 2006 and 1 march 2006
	// (both a wednesday)
	// split both strings and find the part that differs, that must be the monthPart
	// return montPart for currentDate.
	var d1 = (new Date(2006,2,1)).toLocaleString().split(" ");
	var d2 = (new Date(2006,3,1)).toLocaleString().split(" ");
	
	for(var i=0;i < d1.length & d1[i] == d2[i]; i++);
	var nameParts = this.date.toLocaleString().split(" ");
	return nameParts[i];
}
/*========================================================================*/
Calendar.prototype.nextMonth = function() {
	document.body.removeChild(this.div);
	var d = new Date(this.year, this.month,1);
	d.setMonth(d.getMonth() + 1);
	this.month = d.getMonth();
	this.year = d.getFullYear();
	this.render();
}
/*========================================================================*/
Calendar.prototype.prevMonth = function() {
	document.body.removeChild(this.div);
	var d = new Date(this.year, this.month,1);
	d.setMonth(d.getMonth() - 1);
	this.month = d.getMonth();
	this.year = d.getFullYear();
	this.render();
}
/*========================================================================*/
Calendar.prototype.today = function() {
	document.body.removeChild(this.div);
	var date = new Date();
	this.date = new Date(date.getFullYear(), date.getMonth(), date.getDate());
	this.month = this.date.getMonth();
	this.year = this.date.getFullYear();
	this.render();
}
/*========================================================================*/
Calendar.prototype.nextYear = function() {
	document.body.removeChild(this.div);
	var d = new Date(this.year, this.month,1);
	d.setFullYear(d.getFullYear() + 1);
	this.month = d.getMonth();
	this.year = d.getFullYear();
	this.render();
}
/*========================================================================*/
Calendar.prototype.prevYear = function() {
	document.body.removeChild(this.div);
	var d = new Date(this.year, this.month,1);
	d.setFullYear(d.getFullYear() - 1);
	this.month = d.getMonth();
	this.year = d.getFullYear();
	this.render();
}
/*========================================================================*/
Calendar.prototype.toggle = function() {
	if(this.div != null) {
		document.body.removeChild(this.div);
		this.div = null;
	} else {
		this.year = this.date.getFullYear();
		this.month = this.date.getMonth();
		this.render();
	}
}
/*========================================================================*/
Calendar.prototype.createButton = function(className, label, onclickHandler) {
	var btn = document.createElement("a");
	btn.className = className;
	btn.setAttribute("href", "");
	btn.innerHTML = label;
	btn.owner = this;
	btn.onclick = onclickHandler;
	return btn;
}
/*========================================================================*/
Calendar.prototype.hide = function() {
	if(this.div != null) {
		document.body.removeChild(this.div);
		this.div = null;
	}
}