// JavaScript Document
//<![CDATA[
//declare global variables
var xmlDoc=null;
var xmlObj=null;

var intTotalNumberOfMonths,intNumberOfEventsPerMonth;
var names,day,days,startday,arr_date,arr_image;
var intMaxNumberOfMonths=2;	//max number of calendars to display on each view
var intNumberOfDaysPerWeek=7;	//number of days in a week
var intCurrentNumberOfDays=0;	//current number of days when looping to display each calendar
var intDate=2;	//next date after start day
var arrMonthId=new Array();	//id of displayed calendar(s) for tracking purposes

var objDivCalendar,objDivEventHeader,objDivEventDetails,objDivNumbering;

var timeout_id;	//track the last setTimeout id to clear the timeout when clicked
var timeout_interval=5000;	//set the interval for each timeout

//var moz = (typeof document.implementation != 'undefined') && (typeof 
//document.implementation.createDocument != 'undefined');
//--declare global variables


//==========================================================================================================================
//	initialises this calendar.js
//	(main function for user to call)
//
//	input(s) - pxmlFile: path of xml doc
//			 - pdivCalendar: id of tag to display calendar
//			 - pdivEventHeader: id of tag to display event header
//			 - pdivEventDetails: id of tag to display event details
//==========================================================================================================================
function calendar_init(pxmlFile,pdivCalendar,pdivEventHeader,pdivEventDetails,pdivNumbering)
{
	//initialise required variables
	objDivCalendar=document.getElementById(pdivCalendar);
	objDivEventHeader=document.getElementById(pdivEventHeader);
	objDivEventDetails=document.getElementById(pdivEventDetails);
	objDivNumbering=document.getElementById(pdivNumbering);
	
	for (var t=0;t<intMaxNumberOfMonths;t++)
	{
		arrMonthId[t]=0;
	}
	//--initialise required variables
	
	loadXML(pxmlFile);
	
}

//==========================================================================================================================
//	loads xml doc and retrieve its data
//
//	0: Object is not initialized
// 	1: Loading object is loading data
// 	2: Loaded object has loaded data
// 	3: Data from object can be worked with
// 	4: Object completely initialized
//
//	input(s) - xmlFile: path of xml doc
//==========================================================================================================================
function loadXML(xmlFile)
{
	if (window.ActiveXObject)				//IE
	{
		xmlDoc=new ActiveXObject('Microsoft.XMLDOM');
		xmlDoc.async='false';
		xmlDoc.onreadystatechange=function()
		{
			if (xmlDoc.readyState!=4)
			{
				return false;
			}
		};
	} else if (document.implementation&&document.implementation.createDocument) {				//firefox
		xmlDoc=document.implementation.createDocument("","",null);
	} else {
		return false;
	}
	
	if (xmlDoc.load(xmlFile))
	{
		if (window.ActiveXObject)
		{
			xmlObj=xmlDoc.documentElement;
			//alert(xmlObj.xml);
			ffOnLoad();
		} else if (document.implementation&&document.implementation.createDocument) {
			xmlDoc.onload=ffOnLoad;
		}
		
	};
}

function ffOnLoad()
{
	objDivCalendar.innerHTML=displayCalendar();
}

//==========================================================================================================================
//	displays calendar(s) created horizontally,
//	displays <- (view previous month(s)) if any,
//	displays -> (view next month(s)) if any
//
//==========================================================================================================================
function displayCalendar()
{	
	var arr=createCalendar().split(',');
	var displayCal='<table border="0" width="300">'+
					'<tr>';
	
	//checks if first month id in arrMonthId is >1, if yes displays <-
	if (arrMonthId.length>0)
	{
		if (parseInt(arrMonthId[0])>1)
		{
			document.getElementById('imgLeft').style.visibility='visible';
		} else {
			document.getElementById('imgLeft').style.visibility='hidden';
		}
	}
	//--checks if first month id in arrMonthId is >1, if yes displays <-
	
	for (var g=0;g<arr.length;g++)
	{
		displayCal+='<td style="width:40%" valign="top" align="center">'+
					arr[g]+
					'</td>';
		
		if (g<arr.length-1)
		{
			displayCal+='<td valign="top" style="width:5%">'+
						'&nbsp;'+
						'</td>';
		}
	}
	
	//checks if second month id in arrMonthId is >2 and <intTotalNumberOfMonths, if yes displays ->
	if (arrMonthId.length>0)
	{
		if (parseInt(arrMonthId[1])>=2 && parseInt(arrMonthId[1])<intTotalNumberOfMonths)
		{
			document.getElementById('imgRight').style.visibility='visible';
		} else {
			document.getElementById('imgRight').style.visibility='hidden';
		}
	}
	//--checks if second month id in arrMonthId is >2 and <intTotalNumberOfMonths, if yes displays ->
	
	displayCal+='</tr>'+
				'</table>';
	
	return displayCal;
}

//==========================================================================================================================
//	collates all the functions to create the required calendar(s)
//	
//
//
//==========================================================================================================================
function createCalendar()
{
	
	//get number of months
	if (window.ActiveXObject)
	{
		intTotalNumberOfMonths=xmlDoc.getElementsByTagName('SES')[0].childNodes.length;
	} else if (document.implementation&&document.implementation.createDocument) {
		intTotalNumberOfMonths=xmlDoc.getElementsByTagName("month").length;
	}
	//--get number of months
	var createCal='';
	var intCounter=1;
	var startnum=0;
	
	if (arrMonthId[0]-1>startnum)
	{
		startnum=arrMonthId[0]-1;
	}
	
	for (var i=startnum;i<intTotalNumberOfMonths;i++)
	{
		//reset required fields
		intDate=2;
		intCurrentNumberOfDays=0;
		//--reset required fields
		
		createCal+='<table border="0" style="width:100%" cellpadding="2" cellspacing="1">';
		
		//get number of events per month
		if (window.ActiveXObject)
		{
			intNumberOfEventsPerMonth=xmlObj.getElementsByTagName('month')[i].getElementsByTagName('event').length;
		} else if (document.implementation&&document.implementation.createDocument) {
			intNumberOfEventsPerMonth=xmlDoc.getElementsByTagName("month")[i].getElementsByTagName('event').length;
		}
		
		//set month&year, number of days, start day
		if (window.ActiveXObject)
		{
			names=xmlObj.childNodes(i).getAttribute('name');
			days=xmlObj.childNodes(i).getAttribute('days');
			startday=xmlObj.childNodes(i).getAttribute('startday');
		} else if (document.implementation&&document.implementation.createDocument) {
			names=xmlDoc.getElementsByTagName("month")[i].getAttribute('name');
			days=xmlDoc.getElementsByTagName("month")[i].getAttribute('days');
			startday=xmlDoc.getElementsByTagName("month")[i].getAttribute('startday');
		}
		
		//set event date, image1, image2
		arr_date=new Array();
		arr_image=new Array();
		for (var k=0;k<intNumberOfEventsPerMonth;k++)
		{
			if (window.ActiveXObject)
			{
				arr_date[k]=xmlObj.childNodes(i).childNodes(k).firstChild.text;
				arr_image[k]=xmlObj.childNodes(i).childNodes(k).childNodes(1).getAttribute('link')+'|'+
						xmlObj.childNodes(i).childNodes(k).childNodes(1).getAttribute('src')+'|'+
						xmlObj.childNodes(i).childNodes(k).childNodes(2).getAttribute('link')+'|'+
						xmlObj.childNodes(i).childNodes(k).childNodes(2).getAttribute('src');
			} else if (document.implementation&&document.implementation.createDocument) {
				arr_date[k]=xmlDoc.getElementsByTagName("month")[i].getElementsByTagName('event')[k].getElementsByTagName('date')[0].firstChild.nodeValue;
				arr_image[k]=xmlDoc.getElementsByTagName("month")[i].getElementsByTagName('event')[k].getElementsByTagName('image1')[0].getAttribute('link')+'|'+
						xmlDoc.getElementsByTagName("month")[i].getElementsByTagName('event')[k].getElementsByTagName('image1')[0].getAttribute('src')+'|'+
						xmlDoc.getElementsByTagName("month")[i].getElementsByTagName('event')[k].getElementsByTagName('image2')[0].getAttribute('link')+'|'+
						xmlDoc.getElementsByTagName("month")[i].getElementsByTagName('event')[k].getElementsByTagName('image2')[0].getAttribute('src');
			}
		}
		
		if (i%2==0)
		{
			displayDefaultImageOnInit();
		}
		
		createCal+=createCalendarHeader();
		createCal+=createFirstRow();
		//reset counter
		intCurrentNumberOfDays=0;
		//--reset counter
		createCal+=createNotFirstRow();
		//reset counter
		intCurrentNumberOfDays=0;
		//--reset counter
		createCal+='</table>';
		
		if (intCounter<(intMaxNumberOfMonths))
		{
			createCal+=',';
		}
		
		//set month id for tracking purposes
		for (var r=0;r<intTotalNumberOfMonths;r++)
		{
			if (window.ActiveXObject)
			{
				if (names==xmlObj.childNodes(r).getAttribute('name'))
				{
					arrMonthId[intCounter-1]=(r+1);
				}
			} else if (document.implementation&&document.implementation.createDocument) {
				if (names==xmlDoc.getElementsByTagName("month")[r].getAttribute('name'))
				{
					arrMonthId[intCounter-1]=(r+1);
				}
			}
		}
		
		//--set month id for tracking purposes
		
		//loop max intMaxNumberOfMonths times
		if (intCounter<intMaxNumberOfMonths)
		{
			intCounter++;
		} else {
			break;
		}
		//--loop max intMaxNumberOfMonths
	}
	
	return createCal;
}

//==========================================================================================================================
//	displays the calendar header in the following format:
//		- MONTH YY
//		- M T W T F S S
//
//
//==========================================================================================================================
function createCalendarHeader()
{
	var calendarHeader='';
	
	calendarHeader="<tr valign='top'>"+
					"<td colspan='7' align='center'"+
					" style='border-top-color: #cccccc; border-top-width: 1px; border-top-style: solid;"+
					" border-bottom-color: #cccccc; border-bottom-width: 1px; border-bottom-style: solid;'>"+
					"<label class='bodytext_black2'><b>"+names+"</b></label>"+
					"</td>"+
					"</tr>"+
					"<tr valign='top' class='bodytext1'>"+
					"<td>"+
					'<label>M</label>'+
					"</td>"+
					"<td>"+
					'<label>T</label>'+
					"</td>"+
					"<td>"+
					'<label>W</label>'+
					"</td>"+
					"<td>"+
					'<label>T</label>'+
					"</td>"+
					"<td>"+
					'<label>F</label>'+
					"</td>"+
					"<td>"+
					'<label>S</label>'+
					"</td>"+
					"<td>"+
					'<label>S</label>'+
					"</td>"+
					"</tr>"
	
	return calendarHeader;
}

//==========================================================================================================================
//	converts start day to numeric
//	e.g.
//	Mon=1,
//	Tue=2,
//	Wed=3,
//	Thu=4,
//	Fri=5
//	Sat=6,
//	Sun=7
//==========================================================================================================================
function convertStartDayToNumeric()
{
	var intStartDay=0;
	
	switch (startday)
	{
		case 'Mon':
			intStartDay=1;
			break;
		case 'Tue':
			intStartDay=2;
			break;
		case 'Wed':
			intStartDay=3;
			break;
		case 'Thu':
			intStartDay=4;
			break;
		case 'Fri':
			intStartDay=5;
			break;
		case 'Sat':
			intStartDay=6;
			break;
		case 'Sun':
			intStartDay=7;
			break;
	}
	
	return intStartDay;
}

//==========================================================================================================================
//	creates the first row of a calendar
//	(check for start day, and determine empty spaces if any before start day, and
//	if there are available spaces after start day for consecutive dates)
//
//==========================================================================================================================
function createFirstRow()
{
	var firstRow='<tr valign="top" class="bodytext1">';
	var intStartDay=convertStartDayToNumeric(startday);
	
	for (var m=0;m<intStartDay;m++)
	{
		//if counter < start day, allocate empty space(s) until 1 day before start day
		if (m<intStartDay-1)
		{
			firstRow+="<td>"+
					"&nbsp;"+
					"</td>";
		} else {
			firstRow+=setEvent(1);
			firstRow+='<label>1</label>'+
					"</td>";
		}
		//--if counter < start day, allocate empty space(s) until 1 day before start day
		
		intCurrentNumberOfDays++;
		
		
		if (m>=intStartDay-1 && intCurrentNumberOfDays<intNumberOfDaysPerWeek)
		{
			var intDifference=intNumberOfDaysPerWeek-intCurrentNumberOfDays;
			
			for (var q=0;q<intDifference;q++)
			{
				firstRow+=setEvent(intDate);
				firstRow+='<label>'+intDate+'</label>'+
						"</td>";
				
				intCurrentNumberOfDays++;
				intDate++;
			}
		}
	}
	
	if (intCurrentNumberOfDays>=intNumberOfDaysPerWeek)
	{
		firstRow+="</tr>"
	}
	
	return firstRow;
}

//==========================================================================================================================
//	creates all the other rows (not first row) of a calendar
//	
//
//
//==========================================================================================================================
function createNotFirstRow()
{
	var notFirstRow='';
	
	//for remaining days after subtracting first row
	var intRemainingDays=(days-intDate)+1;
	
	for (var d=0;d<intRemainingDays;d++)
	{
		if (intCurrentNumberOfDays%intNumberOfDaysPerWeek==0)
		{
			notFirstRow+="<tr valign='top' class='bodytext1'"
			
			if (d>=(intRemainingDays-1))
			{
				notFirstRow+=" style='border-bottom-color: #cccccc; border-bottom-width: 1px; border-bottom-style: solid;'";
			}
			
			notFirstRow+=">";
		}
		
		notFirstRow+=setEvent(intDate);
		
		notFirstRow+='<label>'+intDate+'</label>'+
					"</td>";
		
		intDate++;
		intCurrentNumberOfDays++;
		
		if (intCurrentNumberOfDays%intNumberOfDaysPerWeek==0)
		{
			notFirstRow+="</tr>";
		}
	}
	
	return notFirstRow;
}

//==========================================================================================================================
//	if event(s) detected when creating first row or other rows,
//	change the appearance of the day containing event(s)
//
//	input(s) - intCurrentDay: day of date
//			   (e.g. 7/11/2007=7)
//==========================================================================================================================
function setEvent(intCurrentDay)
{
	var setevent='<td';
	var arr_matched_date=new Array();
	var arr_matched_image=new Array();
	var i=0;
	
	//extract arr_date element(s) & arr_image element(s) that are = to intCurrentDay
	for (var a=0;a<arr_date.length;a++)
	{
		if (arr_date[a]==intCurrentDay)
		{
			arr_matched_date[i]=arr_date[a];
			arr_matched_image[i]=arr_image[a];
			
			i++;
		}
		
		//if loop surpasses intCurrentDay, stop looping because it's redundant
		if (a>intCurrentDay)
		{
			break;
		}
		//--if loop surpasses intCurrentDay, stop looping because it's redundant
	}
	//--extract arr_date element(s) that are = to intCurrentDay
	
	//process all the events are that = intCurrentDay
	if (arr_matched_date.length>0 && arr_matched_image.length>0)
	{
		setevent+=' class="background_red"'+
				' onmouseover="this.style.cursor=\'pointer\'"'+
				' onclick="intSelectedImageId=0; loadShowImages(\''+arr_matched_image[0]+'\'); document.getElementById(\'lblView\').innerHTML=\''+intCurrentDay+' '+names+'\';';
		
		if (arr_matched_date.length>1)
		{	
			var arr_image_join=arr_matched_image.join('~');
			
			setevent+=' image_toggle_init(\''+arr_image_join+'\');';
		} else {
			//clear objDivNumbering
			setevent+=' objDivNumbering.innerHTML=\'&nbsp;\';';
		}
		
		setevent+='"';
		
		arr_matched_date=null;
		arr_matched_image=null;
	}
	//--process all the events are that = intCurrentDay
	
	setevent+='>';
	
	return setevent;
}

//==========================================================================================================================
//	displays the event images (header & details), and
//	set their link(s) when clicked upon
//
//
//==========================================================================================================================
function loadShowImages(imagePath)
{
	clearTimeout(timeout_id);
	
	var image=imagePath.split('|');
	var image1Link=image[0];
	var image1Src=image[1];
	var image2Link=image[2];
	var image2Src=image[3];
	
	objDivEventHeader.innerHTML='<table border="0" width="250" cellpadding="0" cellspacing="0">'+
								'<tr>'+
								'<td align="center" valign="middle">'+
								'<img id=\''+image1Src+'\''+
								' src=\''+image1Src+'\''+
								' onclick="window.open(\''+image1Link+'\')"'+
								' onmouseover="this.style.cursor=\'pointer\'");/>'+
								'</td>'+
								'</tr>'+
								'</table>';
	
	objDivEventDetails.innerHTML='<table border="0" width="250" cellpadding="0" cellspacing="0">'+
								'<tr>'+
								'<td align="center" valign="middle">'+
								'<img src=\''+image2Src+'\''+
								' onclick="window.open(\''+image2Link+'\')"'+
								' onmouseover="this.style.cursor=\'pointer\'";/>'+
								'</td>'+
								'</tr>'+
								'</table>';
}

//==========================================================================================================================
//	redefines the next calendar(s) when next button is clicked
//	(the right calendar id is ignored because it is optional)
//
//
//==========================================================================================================================
function loadNextMonth()
{
	//reset month id
	arrMonthId[0]+=2;
	arrMonthId[1]=0;
	//--reset month id
	
	//reset selected image (for timeout)
	intSelectedImageId=0;
	//--reset selected image (for timeout)
	
	objDivCalendar.innerHTML=displayCalendar();
}

//==========================================================================================================================
//	redefines the previous calendar(s) when previous button is clicked
//	(the right calendar id is ignored because it is optional)
//
//
//==========================================================================================================================
function loadPreviousMonth()
{
	//reset month id
	arrMonthId[0]-=2;
	arrMonthId[1]=0;
	//--reset month id
	
	//reset selected image (for timeout)
	intSelectedImageId=0;
	//--reset selected image (for timeout)
	
	objDivCalendar.innerHTML=displayCalendar();
}

//==========================================================================================================================
//	displays the first event of the first month in the calendar
//	(when the calendar is first initialised)
//
//
//==========================================================================================================================
function displayDefaultImageOnInit()
{
	if (arr_date.length>0 && arr_image.length>0)
	{
		var arr_image0=new Array();
		arr_image0[0]=arr_image[0];
		
		for (var u=1;u<arr_date.length;u++)
		{
			if (arr_date[0]==arr_date[u])
			{
				arr_image0[u]=arr_image[u];
			}
		}
		
		loadShowImages(arr_image[0]);
		
		if (arr_image0.length>1)
		{	
			var arr_image_join=arr_image0.join('~');
			
			//setevent+=' image_toggle_init(\''+arr_image0+'\');';
			
			image_toggle_init(arr_image_join);
		} else {
			//clear objDivNumbering
			//setevent+=' objDivNumbering.innerHTML=\'&nbsp;\';';
			objDivNumbering.innerHTML='&nbsp;';
		}
		
		document.getElementById('lblView').innerHTML=arr_date[0]+' '+names;
	}
}


//==========================================================================================================================
//	
//
//
//==========================================================================================================================
var intSelectedImageId=0;
var arrImages_All;
var intNumberOfEventsPerDay=0;

function image_toggle_init(parrImages)
{
	arrImages_All=parrImages;
	
	objDivNumbering.innerHTML=displayImageToggle();
}

function displayImageToggle()
{
	var str='';
	
	loadImages();
	//str+=displayNumberSequence();
	str+='&nbsp;';
	
	return str;
}

function loadImages()
{
	var strHeader='';
	var strDetails='';
	var arr_images_all=arrImages_All.split('~');
	
	intNumberOfEventsPerDay=arr_images_all.length;
	
	for (var i=0;i<arr_images_all.length;i++)
	{
		var arr_image_current=arr_images_all[i].split('|');
		
		strHeader+='<img src=\''+arr_image_current[1]+'\''+
				' onclick=\'window.open("'+arr_image_current[0]+'");\''+
				' onmouseover=\'this.style.cursor="pointer"\'';
		strDetails+='<img src=\''+arr_image_current[3]+'\''+
				' onclick=\'window.open("'+arr_image_current[2]+'");\''+
				' onmouseover=\'this.style.cursor="pointer"\'';
		
		if (i!=intSelectedImageId)
		{
			strHeader+=' style=\'display:none\'';
			strDetails+=' style=\'display:none\'';
		}
		
		strHeader+='/>';
		strDetails+='/>';
	}
	
	objDivEventHeader.innerHTML=strHeader;
	objDivEventDetails.innerHTML=strDetails;
	
	timeout();
}

function timeout()
{
	if (intSelectedImageId>=intNumberOfEventsPerDay-1)
	{
		intSelectedImageId=0;
	} else {
		intSelectedImageId++;
	}
	
	clearTimeout(timeout_id);
	timeout_id=setTimeout('loadImages();',timeout_interval);
}

function displayNumberSequence()
{
	var str='';
	
	for (var i=0;i<intNumberOfEventsPerDay;i++)
	{
		str+='<label align="right" onmouseover="this.style.cursor=\'pointer\'" onclick="loadSelectedImage('+i+');">'+(i+1)+'</label>';
		
		if (i<intNumberOfEventsPerDay-1)
		{
			str+='&nbsp;&nbsp;';
		}
	}
	
	return str;
}

function loadSelectedImage(index,str)
{
	intSelectedImageId=index;
	objDivNumbering.innerHTML=displayImageToggle();
}
//]]>