/*
**************************************
Popup Calendar Object

NOTES:
------------

1. Must have cccccc.gif in /images folder
2. Options:

	showHistory = true / false - will show / hide the previous month selector for current month
	clickHistory = true / false - will allow historical dates to be clicked / shown as enabled
	excludeDays = array of day names to NOT allow / enable on calendar - this overrides any set in includeDays
	includeDays = array of day names to allow / enable on calendar
	
*/

function oCalendar(oRef)
	{
	// oRef holds name of object on form for reference
	this.objectName=oRef;
	
	// options:
	// allow calendar to go backwards - show back button with current month
	this.showHistory = true;
	
	// enable / disable past dates
	this.clickHistory = true;

	// array of days to exclude, will override includeDays
	this.excludeDays = "";

	// array of days to include
	this.includeDays = "";

	// default info
	// month array
	this.months = new Array("January","February","March","April","May","June","July","August","September","October","November","December");

	// array of week days (Sunday=0)
	this.weekDays = new Array('Sunday','Monday','Tuesday','Wednesday','Thursday','Friday','Saturday');
	
	// colours
	// main calendar
	this.calBorderCol = "#6C7789";
	this.calBGCol = "#E5E9EC";
	// cells
	this.cellBGCol = "#ffffff";
	this.cellBorderCol = "#fff";
	this.cellFontCol = "black";
	// hover / mouseover
	this.cellhoverBGCol = "#C1D2EE";
	// disabled / empty cells
	this.cellblankBGCol = "#E8E9ED";
	this.cellblankBorderCol = "#E8E9ED";
	this.cellblankFontCol = "#C1CEEC";
	
	// set internal status
	this.calStatus = this.objectName + " created";
	
	// build calendar grid
	this.buildGrid = function()
		{
		// don't if it exists!
		if (this.calendar){return;}
		
		// build date grid, give each cell an id and use this to set date value
		document.write("<div id='calPopup' style='background-image: url(images/cccccc.gif); position:absolute;left:0;top:0;display:none;width:100;height:100px; background-color:" + this.calBGCol + "; z-index:2000;'>");
		document.write("<input type='hidden' name='prevmonth' id='prevmonth'  value=''>");
		document.write("<input type='hidden' name='nextmonth' id='nextmonth'  value=''>");
		document.write("<input type='hidden' name='curmonth' id='curmonth'  value=''>");
		document.write("<table style='background-image: url(images/cccccc.gif);width:158px;font-family:arial;font-size:8pt;background-color:" + this.calBGCol + ";border: solid 1px " + this.calBorderCol + ";' cellspacing='1'>");
		document.write("<tr>");
		document.write("<td colspan='7' align='center'>");
		document.write("<table style='background-image: url(images/cccccc.gif);width:156px;font-family:arial;font-size:8pt;background-color:" + this.calBGCol + ";'>");
		document.write(" <tr>");
		document.write(" <td id='mPrev' align='left' width='15'><span id='stfocus' onclick=\"" + this.objectName + ".buildDates(document.getElementById('prevmonth').value)\"' style='cursor:pointer;'>&laquo;</span><input type='text' id='cmarker' name='cmarker' value='' style='background-image: url(images/cccccc.gif);background-color:" + this.calBGCol + ";border:0px;width:1px;'></td>");
		document.write(" <td id='cMonth' align='center' >month</td>");
		document.write(" <td id='mNext' align='right' width='15'><span onclick=\"" + this.objectName + ".buildDates(document.getElementById('nextmonth').value)\" style='cursor:pointer;'>&raquo;</span></td>");
		document.write("</tr>");
		document.write("</table>");
		document.write("</td>");
		document.write("</tr>");
		document.write("<tr>");
		document.write("<td align='center'>M</td>");
		document.write("<td align='center'>T</td>");
		document.write("<td align='center'>W</td>");
		document.write("<td align='center'>T</td>");
		document.write("<td align='center'>F</td>");
		document.write("<td align='center'>S</td>");
		document.write("<td align='center'>S</td>");
		document.write("</tr><tr>");
		for (i=0;i<42;i++)
			{
			// add new after every 7 cells
			  if ((i % 7)==0)
				{
				document.write("</tr><tr>");
				}
			document.write("<td id='cell" + i + "' style='width:20px;text-align:center;border:solid 1px " + this.cellblankBorderCol + ";font-size:8pt;background-color:" + this.cellblankBGCol + ";' >&nbsp;</td>");
			}
		document.write("</tr></table></div>");
		
		// get reference to this calendar
		this.calendar = document.getElementById('calPopup');
		
		}

	this.show = function(imgRef,inputName)
		{
		this.imgRef = imgRef; // image that has the onclick event firing this function
		this.dateBox =  document.getElementById(inputName); // text box holding selected date value
		//
		if (this.calendar)
			{
			if (this.calendar.style.display=='none')
				{
				// show
				this.calendar.style.display='';
				// get existing date or use today
				if (this.dateBox.value=="")
					{
					this.buildDates(Date());
					}
					else
					{
					this.buildDates(this.dateConvert(this.dateBox.value));
					}
				// set position
				this.getCoords();
				this.calendar.style.left=this.intX  + "px";
				this.calendar.style.top=(this.intY + this.dateBox.clientHeight + 4) + "px";
				// prevent element selection
				document.onselectstart = function() {return false;}
				}
				else
				{
				//hide
				this.hide();
				// enable element selection
				document.onselectstart = "";
				}
			}
		}
		
	this.hide = function()
		{
		this.calendar.style.display='none';
		}
		
	this.buildDates = function(sdate)
		{
		// clear all cells / reset grid
		for (i=0;i<42;i++)
			{
			var date_cell = document.getElementById("cell" + i);
			date_cell.innerHTML="&nbsp;";
			date_cell.style.color=this.cellblankFontCol;
			date_cell.style.borderColor=this.cellblankBorderCol;
			date_cell.style.backgroundColor=this.cellblankBGCol;
			date_cell.onclick = "";
			date_cell.onmouseover = "";
			date_cell.onmouseout = "";
			date_cell.style.cursor = 'default';
			}
		
		// show previous month selector
		document.getElementById('stfocus').style.display='';
		
		// get starting date: sdate and fill cells
		var d=new Date(sdate);
		var t = new Date();
		var stoday = t.getDate() + "/" + t.getMonth() + "/" + t.getFullYear();

		// set month and year info
		document.getElementById("cMonth").innerHTML=this.months[d.getMonth()] + "&nbsp;" + d.getFullYear();

		// get start day for this month
		var istart=d.getDay(d.setDate(1))-1;
		var imonth=d.getMonth(d.setDate(1));

		// set current month
		document.getElementById('curmonth').value= "/" + (d.getMonth()+1) + "/" + d.getFullYear();
		document.getElementById('prevmonth').value=d.getMonth() + "/" + d.getDate() + "/" + d.getFullYear();
		document.getElementById('nextmonth').value=(d.getMonth()+2) + "/" + d.getDate() + "/" + d.getFullYear();

		// allow for sunday start
		if (istart==-1)
			{
			istart=6;
			}

		var icell=istart;
		var idate=1;

		// show date details
		while(d.getMonth()==imonth)
			{
			// check dates:
			// if date is allowed, add event handler(s) and enable / disable
			//
			// attach onclick event to set date
			var date_cell = document.getElementById("cell" + icell);
			var cellallowclick = false;
			
				
			// check this is a date
			if (d)
				{
				// set default info
				cellallowclick = true;
				
				// set colors
				date_cell.style.backgroundColor=this.cellBGCol;
				date_cell.style.borderColor=this.cellBorderCol;
									
				// check if allowing historical dates
				if ((this.dateDiff(d,t)<0) && (this.clickHistory==false))
					{
					cellallowclick = false;
					}
					
				// check to include certain days 
				if (this.includeDays!="" && cellallowclick)
					{
					// set to false
					cellallowclick = false;
					if (this.inArray(this.weekDays[d.getDay()], this.includeDays))
						{
						cellallowclick = true;
						}
					}
					
				// check to exclude certain days 
				if (this.excludeDays!="" && cellallowclick)
					{
					if (this.inArray(this.weekDays[d.getDay()], this.excludeDays))
						{
						cellallowclick = false;
						}
					}
					
				}
				
			// add handler(s)
			if (cellallowclick)
				{
				date_cell.onclick = new Function(this.objectName + ".setDate(this.id)");
				date_cell.onmouseover = new Function("this.style.backgroundColor='" + this.cellhoverBGCol + "'");
				date_cell.onmouseout = new Function("this.style.backgroundColor='" + this.cellBGCol + "'");
				date_cell.style.cursor = 'pointer';
				date_cell.style.color = this.cellFontCol;
				}
				else
				{
				// disable
				date_cell.onclick = "";
				date_cell.onmouseover = "";
				date_cell.onmouseout = "";
				date_cell.style.cursor = 'default';
				date_cell.style.color = this.cellblankFontCol;
				}
				
				// highlight todays date
				if (d.getDate() + "/" + d.getMonth() + "/" + d.getFullYear()==stoday)
					{
					date_cell.style.color='#CC0000';
					date_cell.style.borderColor='#CC0000';
					cellallowclick = true;
					// this is current month / year, check to show previous month selector
					if (!this.showHistory)
						{
						document.getElementById('stfocus').style.display='none';
						}
					}

			date_cell.innerHTML=d.getDate();
			idate=idate+1;
			d.setDate(idate);
			icell=icell+1;
			if (icell>41)
				{
				icell=0;
				}
			}
		}

	this.setDate = function(cellID)
		{
		// set date value
		var cday = this.datePad(document.getElementById(cellID).innerHTML);
		if ((cday=="") || (cday=="&nbsp;")){return;}
		this.dateBox.value = this.fullPad(cday + document.getElementById('curmonth').value);
		this.hide();
		}
		
	this.datePad = function(cday)
		{
		// pad date to always have 2 digits
		var dpad = "00";
		cday = dpad.substr(0,(2-cday.length)) + cday ;
		return cday;
		}
		
	this.fullPad = function(sdate)
		{
		// pad date to always have 2 digits
		var nd = sdate.split("/");
		sdate = this.datePad(nd[0]) + "/" + this.datePad(nd[1]) + "/" + this.datePad(nd[2])
		return sdate;
		}

	this.getCoords = function()
		{
		var elm = this.dateBox;
		// get position of element by walking up the document tree
		this.intX = 0;
		this.intY = 0;
		while (elm)
			{
			this.intX += elm.offsetLeft;
			this.intY += elm.offsetTop;
			elm = elm.offsetParent;
			}
		}

	this.dateConvert = function(sdate)
		{
		// convert uk date to us date for processing
		var nd = sdate.split("/");
		sdate = this.datePad(nd[1]) + "/" + this.datePad(nd[0]) + "/" +this.datePad(nd[2])
		return sdate;
		}
		
	this.dateDiff = function(date1,date2)
		{
		// get the difference between 2 dates in days
		// convert date into hours first
		var one_day=1000*60*60*24;
		return Math.ceil((date1.getTime()-date2.getTime())/(one_day));
		}
		
	this.inArray = function (needle, haystack)
		// see if item is in array
		{
		for (key in haystack)
			{
            if (haystack[key] == needle)
				{
				return true;
				}
			}
		return false;
		}

	this.rebuildDates = function()
		{
		// rebuild dates externally without affecting display
		if (this.calendar)
			{
			if (!this.dateBox)
				{
				this.buildDates(Date());
				}
				else
				{
				if (this.dateBox.value=="")
					{
					this.buildDates(Date());
					}
					else
					{
					this.buildDates(this.dateConvert(this.dateBox.value));
					}
				}
			}
		}

	this.showStatus = function()
		{
		alert(this.calStatus);
		}

	
/*
***************************************************
*/

	// run initialise functions
	this.buildGrid();
	
	}