//<script type="text/javascript">
// object voor agenda view. 
// werkt op 2 layers - de selectieview objLayer en de resultaatview objAgendaResult
// zoomLevel: week, month, year

// uibreiding van het datum object prototype
Date.prototype.getWeek = function (dowOffset) { // datumfunctie, geeft weeknummer terug
	/*getWeek() was developed by Nick Baicoianu at MeanFreePath: http://www.meanfreepath.com */
	
	dowOffset = typeof(dowOffset) == 'int' ? dowOffset : 0; //default dowOffset to zero
	var newYear = new Date(this.getFullYear(),0,1);
	var day = newYear.getDay() - dowOffset; //the day of week the year begins on
	day = (day >= 0 ? day : day + 7);
	var daynum = Math.floor((this.getTime() - newYear.getTime() - (this.getTimezoneOffset()-newYear.getTimezoneOffset())*60000)/86400000) + 1;
	var weeknum;
	//if the year starts before the middle of a week
	if(day < 4) {
		weeknum = Math.floor((daynum+day-1)/7) + 1;
		if(weeknum > 52) {
			nYear = new Date(this.getFullYear() + 1,0,1);
			nday = nYear.getDay() - dowOffset;
			nday = nday >= 0 ? nday : nday + 7;
			/*if the next year starts before the middle of
			the week, it is week #1 of that year*/
			weeknum = nday < 4 ? 1 : 53;
		}
	}
	else {
		weeknum = Math.floor((daynum+day-1)/7);
	}
	return weeknum;
};
// extra functies in datum object 
Date.prototype.isInPeriod = function(from, to) {
	return from.getTime() <= this.getTime() && to.getTime() >= this.getTime();
};
Date.prototype.isInEvent = function(from, to) { // this in event from, to (op dag), this moet dag met beginuur 0:00 zijn. (86400000=milisecs p dag)
	return this.getTime() <= from.getTime() && (this.getTime() + 86400000) > from.getTime() ||
	from.getTime() <= this.getTime() && to.getTime() >= this.getTime();
};
Date.prototype.isSameDay = function(dd) {
	return this.getFullYear() == dd.getFullYear() && this.getMonth() == dd.getMonth() && this.getDate() == dd.getDate();
};
Date.prototype.daysInMonth = function() {
	var num = 1, dd = new Date(this.getFullYear(), this.getMonth(), 1);
	do
	{
		num++;
		dd = new Date(dd.getFullYear(), dd.getMonth(), dd.getDate()+1);
	}while(this.getMonth() == dd.getMonth());
	return num;
};
Date.prototype.addDays = function(num) {
	return new Date(Date.parse(this) + num*86400000);
};

/////////////////////////////////////////////////////////////////////////
// het MaakumAgenda object

var MaakumAgenda = Class.create();

MaakumAgenda.prototype = {
	myGlobalName : null, 	// ivm eval(agenda.functie)
	objLayer : null,		// de layer waar de selectieview in komt
	objAgendaResult : null, // de layer waar de opgehaalde events in worden gezet
	objLegenda : null,
	objWait : null, 	// tijdens het laden
	showMultiple : null, // blokjes of alleen achtergrondkleur
	arrEvents : null,	// array die de opgehaalde events opslaat
	arrLegendEvents : null, // array die legenda van events opslaat
	startDate : null,	// startdatum van de selectieview
	zoomLevel : '',    // zoom
	numViewCols : 3, 	// aantal kolommen van een view
	arrViews : Array(), // welke views zijn beschikbaar - standaard allemaal
	getEvents : true, // haal events op bij laden view?
	callBackOnSelect : null, // callback functie die wordt aangeroepen bij selecteren van een datum ipv standaard gedrag
	selDate : null,		// geselecteerde datum
	arrDays : ['zo', 'ma', 'di', 'wo', 'do', 'vr', 'za'], 
	arrFullDays : ['Zondag',  'Maandag', 'Dinsdag', 'Woensdag', 'Donderdag', 'Vrijdag', 'Zaterdag'], 
	arrMonths : ['januari', 'februari', 'maart', 'april', 'mei', 'juni', 'juli', 'augustus', 'september', 'oktober', 'november', 'december'],
	initialize : function(name, zLevel, layerName, startDate, getEvts) { 
		// initialiseer obj, zet zoomLevel, de layer waar de agenda view in komt, waar het resultaat in komt, de begindatum,
		// de url waar de events uit worden opgehaald, of events wel of niet moeten worden opgehaald
		// als de pagina nog niet geladen is
		if (!document.getElementsByTagName){ return; }
	
		this.myGlobalName = name;
		this.startDate = startDate;
		this.zoomLevel = zLevel;
		this.objLayer = document.getElementById(layerName);
		this.objAgendaResult = document.getElementById(layerName + "Events");
		this.objLegenda = document.getElementById(layerName + "Legend");
		this.getEvents = getEvts;
		this.selDate = new Date(); // bij laden standaard vandaag
		
		this.objWait = document.createElement('div');
		this.objWait.setAttribute('id', 'agendaMoment');
		this.objWait.innerHTML = 'Bezig met laden... een moment';
		
		this.arrViews[0]='month';this.arrViews[1]='halfyear';this.arrViews[2]='year';this.showMultiple = false;		
	},
	loadForStartDate : function(startDate){ // laad de agenda view met opgegeven datum
		this.startDate = startDate;
		this.loadTable();
	},
	setCallBack : function(callBack) { // geef de naam van de callback functie op
		this.callBackOnSelect = callBack;		
	},
	setSelectedDate : function(dd) { // zet de datum die geselecteerd moet zijn
		this.selDate = dd;
		this.startDate = dd; // wordt gecorrigeerd bij laden view
		
	},
	getContent : function() { // haal afspraken op via ajaxRequest, verwerk in objLayer
		this.removeChildsFromNode(this.objLayer); // vorige inhoud weg
		this.objLayer.appendChild(this.objWait); // toon wachttekst
		
		var me = this;
		// let weer op maandcorrectie+1 naar php
		var sUrl = "getEvents.php?zoom=" + this.zoomLevel + "&year=" + this.startDate.getFullYear() + "&month=" + ((this.startDate.getMonth()+1));
		
		// afhankelijk van zoom en het aantal views
		if(this.zoomLevel == "week" || this.zoomLevel == "day")
			sUrl = sUrl + "&day=" + this.startDate.getDate();
			
		new Ajax.Request(sUrl, {onSuccess : function(t){me.getContentReadySuccess(t)}, onFailure : function(t){me.getContentReadyFail(t)}}); 
	},
	getContentReadySuccess : function(resXML) { // de ajax callback die na een succesvol request wordt aangeroepen
		var k = 0, eventIndex = 0, legendIndex = 0;
		// de events inladen en event types voor legenda inladen
		//alert(resXML.responseText);
		var objXML = resXML.responseXML.childNodes[0]; //events node, bevat de events
		// hernieuw de events
		for(k = 0; k < objXML.childNodes.length; k++)
		{
			var n = objXML.childNodes[k];
			if(n.nodeType == 1 && n.nodeName == "event") // alleen de event nodes
			{
				this.arrEvents[eventIndex++] = new MaakumAgendaEvent(n);
			}
		}
		for(k = 0; k < this.arrEvents.length; k++)
		{
			var bAdd = true;
			for(var i = 0; i < this.arrLegendEvents.length; i++)
			{
			//alert(k + '#' + i + '$' + this.arrLegendEvents[i].eventType + '@' + this.arrEvents[k].eventType);
				if(this.arrLegendEvents[i].eventType == this.arrEvents[k].eventType)
				{
					bAdd = false;
					break;
				}
			}
			if(bAdd)
				this.arrLegendEvents[legendIndex++] = this.arrEvents[k];
		}
		if(this.objLegenda)
		{
			if(this.arrLegendEvents.length > 0)
			{
				/*var me = this;
				this.objLegenda.innerHTML = 'Legenda';
				this.objLegenda.onclick = function(){me.showLegend()};*/
				this.showLegend();
			}
			else
			{
				this.objLegenda.innerHTML = "";
				this.objLegenda.onclick = function(){return};
			}
		}
		this.createView();
	},
	showLegend : function() {
		var me = this;
		this.removeChildsFromNode(me.objLegenda);
		var objLL = this.addChildToNode(this.objLegenda, 'div', null, 'agendaLegendList', null);
		//objLL.onclick = function(){me.removeChildsFromNode(me.objLegenda);
		//me.objLegenda.innerHTML = 'Legenda';};
			
		var i;
		for(i = 0; i < this.arrLegendEvents.length; i++)
		{
			var objE = this.arrLegendEvents[i];
			var objL = this.addChildToNode(objLL, 'div', null, 'agendaLegendItem', null);
			var objB = this.addChildToNode(objLL, 'div', null, 'agendaLegendBlock', null);
			objB.style.backgroundColor = objE.eventColor;
			objB.style.color = objE.eventColorText;
			var s = objE.eventType;
			if(objE.eventTypeDesc.length > 0)
				s += ': ' + objE.eventTypeDesc;
			this.addChildToNode(objLL, 'div', null, 'agendaLegendItem', s);
		}
		//var objL = this.addChildToNode(objLL, 'div', null, null, 'Sluiten'); // todo $lang
		//objL.style.textAlign = 'right';
	},
	//////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	createViewHeader : function(objLayer, startDate) { // creeer de html voor de view selectie
		var objAgenda = this;
		// "header" - knoppen en tekst boven de view
		var objHeader = this.addChildToNode(objLayer, 'div',  null, 'agendaHeader', null); 
		// container voor eerste rij (dropbox + vandaaglink en icoontjes)
		var objViewContainerDiv = this.addChildToNode(objHeader, 'div', null, 'agendaViewContainer', null);
		var objSelectDiv = this.addChildToNode(objViewContainerDiv, 'div', null, 'agendaViewSelect', null);
		var year = startDate.getFullYear();
		
		// wisselmogelijkheden
		// view - zoom
		if(this.zoomLevel == 'month')
		{
			var objSelect = this.addChildToNode(objSelectDiv, 'select', null, 'agendaSelect', null);
			objSelect.onchange = function(){objAgenda.loadView(new Date(year,this.selectedIndex,1))};
			for(var m = 0; m < 12; m++)
			{
				var objOpt = this.addChildToNode(objSelect, 'option', null, null, this.arrMonths[m]);
				objOpt.value=m;
				if(m == startDate.getMonth())
					objOpt.selected = 'selected';
			}
		}
		else if(this.zoomLevel == 'week')
		{
			// het jaar kan afh van startDate net in het volgende jaar vallen in week 1
			var tmpDate = new Date(year, startDate.getMonth(), startDate.getDate() + 7);
			if(startDate.getWeek() == 1 && tmpDate.getFullYear() != year)
				year++;
			var objSelect = this.addChildToNode(objSelectDiv, 'select', null, 'agendaSelect', null);
			objSelect.onchange = function(){objAgenda.loadWeekViewByNum(year,this.selectedIndex+1)};
			for(var w = 1; w < 53; w++)
			{
				var objOpt = this.addChildToNode(objSelect, 'option', null, null, 'week ' + w);
				objOpt.value=w;
				if(w == startDate.getWeek())
					objOpt.selected = 'selected';
			}
		}
		else if(this.zoomLevel == 'day')
		{
			var dn = startDate.getDate(), mn = startDate.getMonth();
			
			var objSelect = this.addChildToNode(objSelectDiv, 'select', null, 'agendaSelect', null);
			objSelect.onchange = function(){objAgenda.loadView(new Date(year,mn,this.selectedIndex+1))};
			for(var d = 1; d < startDate.daysInMonth(); d++)
			{
				var objOpt = this.addChildToNode(objSelect, 'option', null, null, d);
				objOpt.value=d;
				if(d == startDate.getDate())
					objOpt.selected = 'selected';
			}
			
			objSelect = this.addChildToNode(objSelectDiv, 'select', null, 'agendaSelect', null);
			objSelect.onchange = function(){objAgenda.loadView(new Date(year,this.selectedIndex,dn))};
			for(var m = 0; m < 12; m++)
			{
				var objOpt = this.addChildToNode(objSelect, 'option', null, null, this.arrMonths[m]);
				objOpt.value=m;
				if(m == startDate.getMonth())
					objOpt.selected = 'selected';
			}
		}
		
		var objSelect = this.addChildToNode(objSelectDiv, 'select', null, 'agendaSelect', null);
		objSelect.onchange = function(){objAgenda.loadView(new Date(year-1+this.selectedIndex,startDate.getMonth(),1))};
		for(var j = year-1; j < year+3; j++)
		{
			var objOpt = this.addChildToNode(objSelect, 'option', null, null, j);
			objOpt.value=j;
			if(j == year)
				objOpt.selected = 'selected';
		}
		
		// hieraan de vandaaglink en icoontjes
		var objChangeDiv = this.addChildToNode(objViewContainerDiv, 'div', null, 'agendaViewChange', null);
		var objL = this.addChildToNode(objChangeDiv, 'a', null, 'agendaLink', "Vandaag"); 
		objL.onclick=function(){objAgenda.loadToday()};
		
		var objA;
		
		// welke view icoontjes moeten getoond worden
		if(this.arrViews.find("day") != -1 && this.showMultiple)
		{
			objA = this.addChildToNode(objChangeDiv, 'img', null, 'agendaIcon', null);
			objA.src='http://89.104.162.116/~maakum/images/buttons/agenda_dag.gif';
			objA.onclick=function(){objAgenda.loadDayView()};
		}
		if(this.arrViews.find("week") != -1)
		{		
			objA = this.addChildToNode(objChangeDiv, 'img', null, 'agendaIcon', null);
			objA.src='http://89.104.162.116/~maakum/images/buttons/agenda_week.gif';
			objA.onclick=function(){objAgenda.loadWeekView()};
		}
		if(this.arrViews.find("month") != -1)
		{
			objA = this.addChildToNode(objChangeDiv, 'img', null, 'agendaIcon', null);
			objA.src='http://89.104.162.116/~maakum/images/buttons/agenda_maand.gif';
			objA.onclick=function(){objAgenda.loadZoom('month')};
		}
		if(this.arrViews.find("halfyear") != -1)
		{
			objA = this.addChildToNode(objChangeDiv, 'img', null, 'agendaIcon', null);
			objA.src='http://89.104.162.116/~maakum/images/buttons/agenda_halfjaar.gif';
			objA.onclick=function(){objAgenda.loadZoom('halfyear')};
		}
		if(this.arrViews.find("year") != -1)
		{
			objA = this.addChildToNode(objChangeDiv, 'img', null, 'agendaIcon', null);
			objA.src='http://89.104.162.116/~maakum/images/buttons/agenda_jaar.gif';
			objA.onclick=function(){objAgenda.loadZoom('year')};
		}
		
		// de tweede rij met vorige en volgende view en de titel
		var objNavigContainer = this.addChildToNode(objHeader, 'div', null, 'agendaNavigContainer', null);
		
		// vorige view
		var objPrev = this.addChildToNode(objNavigContainer, 'div', null, 'agendaNavigPrev', '&laquo;');
		objPrev.onclick = function(){objAgenda.prevView()};
		
		var s = "";
		if(this.zoomLevel == "year" || this.zoomLevel == "halfyear")
		{
			s = startDate.getFullYear();
		}
		if(this.zoomLevel == "month")
		{
			s = this.arrMonths[startDate.getMonth()] + " " + startDate.getFullYear();
		}
		else if(this.zoomLevel == "week")
		{
			var dd = startDate.addDays(6);
			s = startDate.getDate();
			if(startDate.getMonth() != dd.getMonth())
				s += " " + this.arrMonths[startDate.getMonth()];
			s += " - " + dd.getDate() + " " +  this.arrMonths[dd.getMonth()] + " " + dd.getFullYear();
		}
		else if(this.zoomLevel == "day")
		{
			s = this.arrFullDays[startDate.getDay()] + " " + startDate.getDate() + " " + this.arrMonths[startDate.getMonth()] + " " + startDate.getFullYear();
		}
		var objTitle = this.addChildToNode(objNavigContainer, 'div', null, 'agendaNavigTitle', s);
		
		// volgende view
		var objNext = this.addChildToNode(objNavigContainer, 'div', null, 'agendaNavigNext', '&raquo;');
		objNext.onclick = function(){objAgenda.nextView()};

//alert(objLayer.innerHTML);
	},
	//////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	createMonthView : function(objLayer, startDate) { // creeer de maand view
		// begint altijd op de eerste dag van de maand
		startDate = new Date(startDate.getFullYear(), startDate.getMonth(), 1);
		
		this.createViewHeader(objLayer, startDate);
		
		// de maand view opbouwen
		var i = 0, j = 0, day = 1, cellClass, curDate = startDate, today = new Date(), evtText, baseClass = 'monthAgenda', arrCurEvents;
		var me = this;
		
		// tabel
		var objTable = this.addChildToNode(objLayer, 'table',  null, baseClass, null); 
		// tbody is nodig voor IE...
		var objTBody = this.addChildToNode(objTable, 'tbody',  null, baseClass, null); 
		
		// nieuwe rij met de namen van de dagen
		var objRow = this.addChildToNode(objTBody, 'tr',  null, null, null); 
		for(i = 0; i < 7; i++)
		{
			if(i == 0 || i == 6)
				cellClass = baseClass + 'WeekendCell';
			else
				cellClass = baseClass + 'DayCell';
			this.addChildToNode(objRow, 'td', null, cellClass, this.arrDays[i]);
		}
		
		var firstDay = startDate.getDay();

		i = 0;
		while(i < firstDay)
		{
			if(i == 0) // nieuwe rij met de dagen
				objRow = this.addChildToNode(objTBody, 'tr',  null, null, null); 
			this.addChildToNode(objRow, 'td', null, baseClass + 'EmptyDayCell', '&nbsp');
			i++;
		}
		
		// de dagen tabel
		do
		{
			arrCurEvents = this.getEventsForDay(curDate);

			if(i % 7 == 0) // nieuwe rij met de dagen
				objRow = this.addChildToNode(objTBody, 'tr',  null, baseClass, null); 

			cellClass = baseClass + "Cell";
			// vandaag?
			if(today.isSameDay(curDate))
			{
				cellClass += "Today";
			}
			
			// check of er een event is
			if(arrCurEvents.length > 0)
				cellClass += "Event";
				
			if(curDate.getDay() == 0 || curDate.getDay() == 6)
				cellClass += "Weekend";
			
			// geselecteerd?
			if(this.selDate != null)
			{
				if(this.selDate.isSameDay(curDate))
				{
					cellClass += "Sel";
					//eval(this.myGlobalName + ".viewEvents(new Date(" + curDate.getFullYear() + ", " + curDate.getMonth() + ", " + curDate.getDate() + "))");
				}
			}
			var objCell = this.addChildToNode(objRow, 'td', null, cellClass, null);
			
			objCell.onclick = new Function(me.myGlobalName + ".selectEventsCell(new Date(" + curDate.getFullYear() + ", " + curDate.getMonth() + ", " + curDate.getDate() + "))");
			
			
			var objCellDiv = this.addChildToNode(objCell, 'div', null, baseClass + 'CellContainer', null);
			this.addChildToNode(objCellDiv, 'div', null, baseClass + 'CellDate', curDate.getDate());
			if(arrCurEvents.length > 0)
			{
				if(false == this.showMultiple)
				{
					objCell.style.backgroundColor = arrCurEvents[0].eventColor;
					objCell.style.color = arrCurEvents[0].eventColorText;
				}
				else
				{
					for(var j = 0; j < arrCurEvents.length && j < 10; j++)
					{
						// todo waar afbreken?
						var objCellDate = this.addChildToNode(objCellDiv, 'div', null, baseClass + 'EventBlock', null);
						objCellDate.style.backgroundColor = arrCurEvents[j].eventColor;
					}
				}
			}
			
			i++;
			day++;
			curDate = new Date(startDate.getFullYear(), startDate.getMonth(), day);
		}while(curDate.getMonth() == startDate.getMonth());
		while(i % 7 != 0)
		{
			this.addChildToNode(objRow, 'td', null, baseClass + 'EmptyDayCell', '&nbsp;');
			i++;
		}	
		//alert(objLayer.innerHTML);
	},
	//////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	createWeekView : function(objLayer, startDate) { // creeer de week view
		// zoek nabijgelegen eerste dag van de week
		startDate = this.findFirstWeekDate(startDate);
		
		this.createViewHeader(objLayer, startDate);
		
		// de week view opbouwen
		var i = 0, cellClass, curDate = startDate, today = new Date(), evtText = '', arrCurEvents, me = this;

		// tabel
		var objTable = this.addChildToNode(objLayer, 'table',  null, 'weekAgenda', null); 
		// tbody is nodig voor IE...
		var objTBody = this.addChildToNode(objTable, 'tbody',  null, 'weekAgenda', null); 
		
		// rij met de maand
		var objRow = this.addChildToNode(objTBody, 'tr',  null, null, null); 
			
		// de dagen tabel
		do
		{
			// nieuwe rij met de dag
			objRow = this.addChildToNode(objTBody, 'tr',  null, null, null); 
			if(curDate.getDay() == 0 || curDate.getDay() == 6)
				cellClass = 'weekAgendaWeekendCell';
			else
				cellClass = 'weekAgendaDayCell';
			this.addChildToNode(objRow, 'td', null, cellClass, this.arrDays[curDate.getDay()]);
			this.addChildToNode(objRow, 'td', null, cellClass, curDate.getDate());
			
			arrCurEvents = this.getEventsForDay(curDate);
			
			cellClass = "weekAgendaCell";
			// vandaag?
			if(today.getFullYear() == curDate.getFullYear() && today.getMonth() == curDate.getMonth() && today.getDate() == curDate.getDate())
			{
				cellClass += "Today";
			}
			
			// check of er een event is
			if(arrCurEvents.length)
				cellClass += "Event";
				
			if(curDate.getDay() == 0 || curDate.getDay() == 6)
				cellClass += "Weekend";
			
			// geselecteerd?
			if(this.selDate != null)
			{
				if(this.selDate.isSameDay(curDate))
				{
					cellClass += "Sel";
					eval(me.myGlobalName + ".viewEvents(new Date(" + curDate.getFullYear() + ", " + curDate.getMonth() + ", " + curDate.getDate() + "))");
				}
			}
			var objCell = this.addChildToNode(objRow, 'td', null, cellClass, arrCurEvents.length > 0 ? null : "&nbsp;");
			objCell.colSpan = 2;
			
			objCell.onclick = new Function(me.myGlobalName + "selectEventsCell(new Date(" + curDate.getFullYear() + ", " + curDate.getMonth() + ", " + curDate.getDate() + "))");
			
			if(arrCurEvents.length > 0)
			{
				if(false == this.showMultiple)
				{
					objCell.style.backgroundColor = arrCurEvents[0].eventColor;
					objCell.style.color = arrCurEvents[0].eventColorText;
				}
				else
				{
					for(var j = 0; j < arrCurEvents.length; j++)
					{
						var objCellDiv = this.addChildToNode(objCell, 'div', null, 'weekAgendaCellContainer', null);
						// todo waar afbreken?
						var objCellDate = this.addChildToNode(objCellDiv, 'div', null, 'weekEventBlock', null);
						objCellDate.style.backgroundColor = arrCurEvents[j].eventColor;
						
						this.addChildToNode(objCellDiv, 'div', null, 'weekAgendaCellText', arrCurEvents[j].eventStart.getHours() + ':' + MaakumAgendaEvent.prototype.fMinutes(arrCurEvents[j].eventStart) + ' ' + arrCurEvents[j].eventText.substring(0, 100));
					}
				}
			}		
			i++;
			curDate = new Date(curDate.getFullYear(), curDate.getMonth(), curDate.getDate() + 1);
		}while(i < 7);
		
		//alert(objLayer.innerHTML);
	},
	createDayView : function(objLayer, startDate) { // creeer de dag view
		this.createViewHeader(objLayer, startDate);
		
		var arrCurEvents = this.getEventsForDay(startDate);

		var firstHour = 7, i, j, numOverlap, objEvent, objNextEvent, cellWidth = 456, cellHeight = 30, evtWidth, arrDivs, tmp;
		var curHour, objDiv, maxH, lastTime, cellTopHeight = 34;
		if(navigator.appVersion.indexOf('MSIE')>0)
			cellTopHeight -= 2;
		if(arrCurEvents.length > 0)
			firstHour = arrCurEvents[0].eventStart.getHours() < 7 ? arrCurEvents[0].eventStart.getHours() : 7;
		
		var objCont = this.addChildToNode(objLayer, 'div', null, 'dayAgendaDayContainer', null);
		// voor de uren
		var objHoursDiv = this.addChildToNode(objCont, 'div', null, 'dayAgendaHoursContainer', null);
		objHoursDiv.style.height = (24-firstHour)*cellTopHeight;
		// voor de events
		var objEventDiv = this.addChildToNode(objCont, 'div', null, 'dayAgendaEventsContainer', null);
		objEventDiv.style.height = (24-firstHour)*cellTopHeight;
		
		for(i = firstHour; i < 24; i++)
		{
			objDiv = this.addChildToNode(objHoursDiv, 'div', null, 'dayAgendaHourCell', i + ':00');
			objDiv.style.top = (i - firstHour) * cellTopHeight;
			
			objDiv = this.addChildToNode(objEventDiv, 'div', null, 'dayAgendaBackCell', '&nbsp;');
			objDiv.style.top = (i - firstHour) * cellTopHeight;
			objDiv.style.left = 0;
			objDiv.style.width = cellWidth;
			objDiv.style.height = cellHeight;
		}

		curHour = firstHour;
		if(arrCurEvents.length > 0)
		{
			arrDivs = new Array();
			arrDivsPop = new Array();
			for(i = 0; i < arrCurEvents.length; i++)
			{
				arrDivs[i] = document.createElement("div");
				arrDivsPop[i] = document.createElement("div");
			}
			i = 0; 
			
			while(i < arrCurEvents.length)
			{
				maxH = 0;
				objEvent = arrCurEvents[i];
				lastTime = objEvent.eventEnd;
				curHour = objEvent.eventStart.getHours();
				numOverlap = 1;
				j = i+1;
				while(j < arrCurEvents.length) // op zoek naar overlappende events
				{
					objNextEvent = arrCurEvents[j];
					j++;
					if(objNextEvent.eventStart.isInPeriod(objEvent.eventStart, lastTime)) // overlap met volgende event
					{
						numOverlap++;
						if(lastTime.getTime() < objNextEvent.eventEnd.getTime())
							lastTime = objNextEvent.eventEnd; 
					}
					else
						break;
				}
				
				// breedte bepalen adhv aantal overlappende events
				evtWidth = cellWidth / numOverlap;
				for(j = 0; j < numOverlap; j++) // voor alle events die bij elkaar horen
				{
					objEvent = arrCurEvents[i+j];
					tmp = 1;
					if(objEvent.eventStart.isSameDay(objEvent.eventEnd) && objEvent.eventStart.getHours() < objEvent.eventEnd.getHours())
						tmp += objEvent.eventEnd.getHours() - objEvent.eventStart.getHours();
					if(tmp > maxH)
						maxH = tmp;

					arrDivs[i+j].className = 'dayAgendaEventCell';
					arrDivs[i+j].style.top = (objEvent.eventStart.getHours() - firstHour) * cellTopHeight;
					arrDivs[i+j].style.left = j * evtWidth;
					arrDivs[i+j].style.width = evtWidth;
					if(navigator.appVersion.indexOf('MSIE')>0)
						arrDivs[i+j].style.height = cellTopHeight * tmp;
					arrDivs[i+j].style.minHeight = cellTopHeight * tmp;
					/*
					{
						arrDivs[i+j].style.backgroundColor = period.color;
						arrDivs[i+j].style.color = period.color_text;
					}*/
					arrDivs[i+j].onclick=new Function("document.getElementById('" + (i+j) + "').style.display='block';");
					
					// de popups, bijna gelijk aan arrDivs
					arrDivsPop[i+j].setAttribute('id', i+j);
					arrDivsPop[i+j].className = 'dayAgendaEventCellPop';
					arrDivsPop[i+j].style.top = (objEvent.eventStart.getHours() - firstHour) * cellTopHeight + 5;
					/*if(period != null)
					{
						arrDivsPop[i+j].style.backgroundColor = period.color;
						arrDivsPop[i+j].style.color = period.color_text;
					}*/
					arrDivsPop[i+j].onclick=new Function("this.style.display='none';");
					
					// todo in div, blockje + onClick naar verborgen div 
					tmp = "<div class='dayEventBlock' style='background-color:" + objEvent.eventColor + "'></div>";
					tmp += objEvent.eventStart.getHours() + ':' + MaakumAgendaEvent.prototype.fMinutes(objEvent.eventStart);
					if(objEvent.eventStart != objEvent.eventEnd)
						tmp += " - " + objEvent.eventEnd.getHours() + ':' + MaakumAgendaEvent.prototype.fMinutes(objEvent.eventEnd);
					tmp += " " + objEvent.eventText;
					arrDivs[i+j].innerHTML =  tmp;
					objEventDiv.appendChild(arrDivs[i+j]);
					
					// popup
					tmp = "<div class='dayEventHeader' style='background-color:" + objEvent.eventColor + ";color:" + objEvent.eventColorText + "'>";
					tmp += objEvent.eventStart.getHours() + ':' + MaakumAgendaEvent.prototype.fMinutes(objEvent.eventStart);
					if(objEvent.eventStart != objEvent.eventEnd)
						tmp += " - " + objEvent.eventEnd.getHours() + ':' + MaakumAgendaEvent.prototype.fMinutes(objEvent.eventEnd);
					tmp += " " + objEvent.eventText + "</div><div style='float:left;height:80px;width:0px;'></div>";
					arrDivsPop[i+j].innerHTML =  tmp + "<div style='float:left'>" + objEvent.eventDesc + "</div>";
					objEventDiv.appendChild(arrDivsPop[i+j]);
					//alert(objEventDiv.innerHTML);
				}
				i+=numOverlap;
			}
			
		}
		
		//alert(objLayer.outerHTML);
	},
	createHalfYearView : function(objLayer, startDate) {
		if(startDate.getMonth() >= 6)
			startDate = new Date(startDate.getFullYear(), 6, 1);
		else
			startDate = new Date(startDate.getFullYear(), 0, 1);
		this.createViewHeader(objLayer, startDate);
	
		var objTable = this.addChildToNode(objLayer, 'table', null, 'yearAgendaHolder', null);
		var objBody = this.addChildToNode(objTable, 'tbody', null, 'yearAgendaHolder', null);
		var objTr;
		for(var i = 0; i < 6; i++)
		{
			if(i%3 == 0)
				objTr = this.addChildToNode(objBody, 'tr', null, null, null);
			var objTd = this.addChildToNode(objTr, 'td', null, null, null);
			if(i%3 == 1)
				objTd.setAttribute('align', 'center');
			if(i%3 == 2)
				objTd.setAttribute('align', 'right');
			this.createMonthViewForYearView(objTd, new Date(startDate.getFullYear(), startDate.getMonth()+i, 1));
		}
	},
	createYearView : function(objLayer, startDate) {
		startDate = new Date(startDate.getFullYear(), 0, 1);
		this.createViewHeader(objLayer, startDate);
	
		var objTable = this.addChildToNode(objLayer, 'table', null, 'yearAgendaHolder', null);
		var objBody = this.addChildToNode(objTable, 'tbody', null, 'yearAgendaHolder', null);
		var objTr;
		for(var i = 0; i < 12; i++)
		{
			if(i%3 == 0)
				objTr = this.addChildToNode(objBody, 'tr', null, null, null);
			var objTd = this.addChildToNode(objTr, 'td', null, null, null);
			if(i%3 == 1)
				objTd.setAttribute('align', 'center');
			if(i%3 == 2)
				objTd.setAttribute('align', 'right');
			this.createMonthViewForYearView(objTd, new Date(startDate.getFullYear(), i, 1));
		}
	},
	createMonthViewForYearView : function(objLayer, startDate) {
	
	// de tweede rij met vorige en volgende view en de titel
		var s = "<div class='yearAgendaNavigContainer'><a href=\"javascript: " + this.myGlobalName + ".selDate = new Date(" + startDate.getFullYear() + ", " + startDate.getMonth() + ", 1); " + this.myGlobalName + ".loadMonthView();\">" + this.arrMonths[startDate.getMonth()] + "</a></div>";
		// de maand view opbouwen
		var i = 0, j = 0, day = 1, cellClass, curDate = startDate, today = new Date(), evtText, baseClass = 'yearAgenda', arrCurEvents;
		
		// tabel
		s += "<table class='yearAgenda'><tr>";
		// nieuwe rij met de namen van de dagen
		
		for(i = 0; i < 7; i++)
		{
			if(i == 0 || i == 6)
				cellClass = baseClass + 'WeekendCell';
			else
				cellClass = baseClass + 'DayCell';
			s += "<td class='" + cellClass + "'>" + this.arrDays[i] + "</td>";
		}
		s += "</tr>";
		
		var firstDay = startDate.getDay();

		i = 0;
		while(i < firstDay)
		{
			if(i == 0) // nieuwe rij met de dagen
				s += "<tr>"; 
			s += "<td class='" + baseClass + "EmptyDayCell'>&nbsp</td>";
			i++;
		}
		
		// de dagen tabel
		do
		{
			arrCurEvents = this.getEventsForDay(curDate);

			if(i % 7 == 0) // nieuwe rij met de dagen
				s += "<tr>";

			cellClass = baseClass + "Cell";
			// vandaag?
			if(today.isSameDay(curDate))
			{
				cellClass += "Today";
			}
			
			// check of er een event is
			if(arrCurEvents.length > 0)
				cellClass += "Event";
				
			if(curDate.getDay() == 0 || curDate.getDay() == 6)
				cellClass += "Weekend";
			
			// geselecteerd?
			if(this.selDate != null)
			{
				if(this.selDate.isSameDay(curDate))
				{
					cellClass += "Sel";
				}
			}
			
			s += "<td class='" + cellClass + "' "; // title='" + escape(arrCurEvents[0].eventDesc) + "'
			if(arrCurEvents.length > 0 && false == this.showMultiple)
				s += " style='background-color: " + arrCurEvents[0].eventColor + ";color:" + arrCurEvents[0].eventColorText + "'";
			s += "onclick=\"javascript: " + this.myGlobalName + ".selectEventsCell(new Date(" + curDate.getFullYear() + ", " + curDate.getMonth() + ", " + curDate.getDate() + "));\">";
			
			if(arrCurEvents.length > 0)
				s += "<strong>" + day + "</strong>";
			else
				s += day;

			s += "</td>";			
			if(i % 7 == 6)
				s += "</tr>";
			i++;
			day++;
			curDate = new Date(startDate.getFullYear(), startDate.getMonth(), day);
		}while(curDate.getMonth() == startDate.getMonth());
		while(i % 7 != 0)
		{
			s += "<td class='" + baseClass + "EmptyDayCell'>&nbsp;</td>";
			i++;
		}	
		s += "</tr></table>";
		objLayer.innerHTML = s;
		//alert(objLayer.innerHTML);
	},
	createSelView : function(objLayer, startDate) { // creeer datumselectie (maandview als in jaarview)
		// de tweede rij met vorige en volgende view en de titel
		var s = "";
		// de maand view opbouwen
		var i = 0, j = 0, day = 1, cellClass, curDate = startDate, today = new Date(), evtText, baseClass = 'selAgenda', arrCurEvents;
		
		// tabel
		s += "<div class='agendaSelNavigContainer'><div class='agendaSelNavigPrev' onclick=\"" + this.myGlobalName + ".prevView(0);\">&laquo;</div>";
		s += "<div class='agendaSelNavigTitle'>" + this.arrMonths[startDate.getMonth()] + ' ' + startDate.getFullYear() + "</div>";
		s += "<div class='agendaSelNavigNext' onclick=\"" + this.myGlobalName + ".nextView(0);\">&raquo;</div></div>";
		
		s += "<table class='selAgenda'><tr>";
		// nieuwe rij met de namen van de dagen
		for(i = 0; i < 7; i++)
		{
			if(i == 0 || i == 6)
				cellClass = baseClass + 'WeekendCell';
			else
				cellClass = baseClass + 'DayCell';
			s += "<td class='" + cellClass + "'>" + this.arrDays[i] + "</td>";
		}
		s += "</tr>";
		
		var firstDay = startDate.getDay();

		i = 0;
		while(i < firstDay)
		{
			if(i == 0) // nieuwe rij met de dagen
				s += "<tr>"; 
			s += "<td class='" + baseClass + "EmptyDayCell'>&nbsp</td>";
			i++;
		}
		
		// de dagen tabel
		do
		{
			arrCurEvents = this.getEventsForDay(curDate);

			if(i % 7 == 0) // nieuwe rij met de dagen
				s += "<tr>";

			cellClass = baseClass + "Cell";
			// vandaag?
			if(today.isSameDay(curDate))
			{
				cellClass += "Today";
			}
			
			// check of er een event is
			if(arrCurEvents.length > 0)
				cellClass += "Event";
				
			if(curDate.getDay() == 0 || curDate.getDay() == 6)
				cellClass += "Weekend";
			
			// geselecteerd?
			if(this.selDate != null)
			{
				if(this.selDate.isSameDay(curDate))
				{
					cellClass += "Sel";
				}
			}
			
			s += "<td class='" + cellClass + "' onClick=\"" + this.myGlobalName + ".selectEventsCell(new Date(" + curDate.getFullYear() + ", " + curDate.getMonth() + ", " + curDate.getDate() + "));\">" + day + "</td>";
			
			if(i % 7 == 6)
				s += "</tr>";
			i++;
			day++;
			curDate = new Date(startDate.getFullYear(), startDate.getMonth(), day);
		}while(curDate.getMonth() == startDate.getMonth());
		while(i % 7 != 0)
		{
			s += "<td class='" + baseClass + "EmptyDayCell'>&nbsp;</td>";
			i++;
		}	
		s += "</tr></table>";
		//alert(s);
		objLayer.innerHTML = s;
	},
	//////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	createView : function() { // creeer de view - afhankelijk van het aantal views dat is opgegeven.
	
		this.removeChildsFromNode(this.objLayer); // opschonen
		if(this.objAgendaResult != null)
			this.removeChildsFromNode(this.objAgendaResult);
			
		var objAgenda = this.addChildToNode(this.objLayer, 'div', null, 'agendaViewHolder', null);
		if(this.zoomLevel == 'month')
		{
			this.createMonthView(objAgenda, new Date(this.startDate.getFullYear(), this.startDate.getMonth(), 1));
		}
		else if(this.zoomLevel == 'week')
		{
			this.createWeekView(objAgenda, new Date(this.startDate.getFullYear(), this.startDate.getMonth(), this.startDate.getDate()));
		}
		else if(this.zoomLevel == 'day')
		{
			this.createDayView(objAgenda, new Date(this.startDate.getFullYear(), this.startDate.getMonth(), this.startDate.getDate()));
		}
		else if(this.zoomLevel == 'halfyear')
		{
			this.createHalfYearView(objAgenda, new Date(this.startDate.getFullYear(), this.startDate.getMonth(), 1));
		}
		else if(this.zoomLevel == 'year')
		{
			this.createYearView(objAgenda, new Date(this.startDate.getFullYear(), this.startDate.getMonth(), 1));
		}
		else if(this.zoomLevel == 'seldate')
		{
			this.createSelView(this.objLayer, new Date(this.startDate.getFullYear(), this.startDate.getMonth(), 1));
		}
		else
		{
			alert('Ongeldig ' + this.zoomLevel);
		}
		this.viewAllEvents();
		//alert(this.objLayer.innerHTML);
	},
	//////////////////////////////////////////////////////////////////////////////////////////////////////////////////
	getContentReadyFail : function(status) { // wanneer het request fout gaat (404 of iets dergelijks - in princiepe voor debug)
		alert('De agenda kon niet worden geladen. Fout '  + status); // TODO
	},
	loadZoom : function(zoom) { // laad de geselecteerde zoom in. vind bijbehorende startdatum
		this.zoomLevel = zoom;
		this.startDate = new Date();
		this.loadView(this.startDate);
	},
	findFirstWeekDate : function(dd) { // zoek begin van de week die bij datum dd hoort
		var wk = dd.getWeek();
		while(dd.getWeek() == wk)
		{
			dd = new Date(dd.getFullYear(), dd.getMonth(), dd.getDate()-1);	
		}
		dd = new Date(dd.getFullYear(), dd.getMonth(), dd.getDate()+1);
		
		return dd;
	},
	loadView : function(startDate) { // laad de opgegeven start datum in. roept de callback aan met 'update' - de view wordt ge-update
		
		this.startDate = startDate;
		this.selDate = startDate;
		if(this.callBackOnSelect != null)
		{
			eval(this.callBackOnSelect + "('update', '" + this.zoomLevel + "', new Date(" + this.startDate.getFullYear() + ", " + this.startDate.getMonth() + ", " + this.startDate.getDate() + "))");
		}
		this.loadTable();
	},
	loadWeekViewByNum : function(y, num) { // laad een weekview in op weeknummer num en jaar y
		this.zoomLevel = 'week';
		var startDate = new Date(y, 0, 1);
		while(startDate.getWeek() != num)
		{
			startDate = new Date(startDate.getFullYear(), startDate.getMonth(), startDate.getDate()+1);	
		}
		this.loadView(startDate);
	},
	loadWeekView : function() { // zet zoomlevel en laad geselecteerde dag
		this.zoomLevel = 'week';
		this.loadView(this.selDate);
	},
	loadMonthView : function() {
		this.zoomLevel = 'month';
		this.loadView(this.selDate);
	},
	loadDayView : function() {  // zet zoomlevel en laad geselecteerde dag
		this.zoomLevel = 'day';
		this.loadView(this.selDate);
	},
	prevView : function() { // verzet startDate naar startdatum van de vorige view
		
		if(this.zoomLevel == 'week')
		{
			this.loadView(new Date(this.startDate.getFullYear(), this.startDate.getMonth(), this.startDate.getDate()-7));
		}
		else if(this.zoomLevel == 'month' || this.zoomLevel == 'seldate')
		{
			if(this.startDate.getMonth() < 1)
				this.loadView(new Date(this.startDate.getFullYear()-1, 11, 1));
			else
				this.loadView(new Date(this.startDate.getFullYear(), this.startDate.getMonth() -1, 1));
		}
		else if(this.zoomLevel == 'day')
		{
			this.loadView(new Date(this.startDate.getFullYear(), this.startDate.getMonth(), this.startDate.getDate()-1));
		}
		else if(this.zoomLevel == 'halfyear')
		{
			if(this.startDate.getMonth() == 0)
				this.loadView(new Date(this.startDate.getFullYear()-1, 6, 1));
			else
				this.loadView(new Date(this.startDate.getFullYear(), 0, 1));
		}
		else if(this.zoomLevel == 'year')
		{
			this.loadView(new Date(this.startDate.getFullYear()-1, this.startDate.getMonth(), 1));
		}
	},
	nextView : function() { // verzet startDate naar startdatum van de opeenvolgende view
		if(this.zoomLevel == 'week')
			this.loadView(new Date(this.startDate.getFullYear(), this.startDate.getMonth(), this.startDate.getDate()+7));
		else if(this.zoomLevel == 'month' || this.zoomLevel == 'seldate')
			this.loadView(new Date(this.startDate.getFullYear(), this.startDate.getMonth() + 1, 1));
		else if(this.zoomLevel == 'day')
			this.loadView(new Date(this.startDate.getFullYear(), this.startDate.getMonth(), this.startDate.getDate()+1));
		else if(this.zoomLevel == 'halfyear')
		{
			if(this.startDate.getMonth() == 0)
				this.loadView(new Date(this.startDate.getFullYear(), 6, 1));
			else
				this.loadView(new Date(this.startDate.getFullYear()+1, 0, 1));
		}
		else if(this.zoomLevel == 'year')
			this.loadView(new Date(this.startDate.getFullYear()+1, this.startDate.getMonth(), 1));
			
	},
	loadToday : function() { // laad vandaag view in
		this.startDate = new Date();
		this.loadView(this.startDate);
	},
	selectEventsCell : function(dd) { // een cell is geselecteerd, zet de geselecteerde datum en creeer de view opnieuw (niet nog een keer laden)
		this.selDate = dd;
		if(this.callBackOnSelect != null)
		{
			eval(this.callBackOnSelect + "('select', '" + this.zoomLevel + "', new Date(" + dd.getFullYear() + ", " + dd.getMonth() + ", " + dd.getDate() + "))");
		}
		else
		{
			this.createView();
		}
	},
	viewAllEvents : function() { //  alle ingeladen events tonen
		var sHTML = "<table class='agendaEvents'>";
		for(var i = 0; i < this.arrEvents.length; i++)
		{
			var objEvent = this.arrEvents[i];
			if(objEvent.eventDesc)
				sHTML += objEvent.toHTML(true /*this.showMultiple*/);
		}
		sHTML += "</table>";
		if(this.objAgendaResult != null)
			this.objAgendaResult.innerHTML = sHTML;
	},
	viewEvents : function(dd) { // geeft HTML voor de events op dag dd
		this.selDate = dd;
		var sHTML = "<table class='agendaEvents'>";
		var arr = this.getEventsForDay(dd);
		for(var i = 0; i < arr.length; i++)
		{
			var objEvent = arr[i];
			sHTML += objEvent.toHTML(this.showMultiple);
		}
		sHTML += "</table>";
		if(this.objAgendaResult != null)
			this.objAgendaResult.innerHTML = sHTML;
		
	},
	viewEvent : function(i) { // bekijk het event op index i in de event arrays
		var objEvent = this.arrEvents[i];
		if(this.objAgendaResult != null)
			this.objAgendaResult.innerHTML = objEvent.toHTML(this.showMultiple);
	},
	getEventsForDay : function(dd) { // geef de events voor dag dd in array
		arrRet = new Array();
		var j = 0;
		for(var i = 0; i < this.arrEvents.length; i++)
		{
			var objEvent = this.arrEvents[i];
			if(dd.isInEvent(objEvent.eventStart, objEvent.eventEnd))
				arrRet[j++] = objEvent;
		}
		return arrRet;
	},
	getEvent : function(i) {		// haal event op adhv index
		return this.arrEvents[i];
	},
	loadTable : function() { 		// tabel met agenda en events inladen
		this.arrEvents = new Array(); // ook events resetten voor deze view
		this.arrLegendEvents = new Array();
		// haal de events op en laad de tabel
		if(this.getEvents)
			this.getContent();
		else
			this.createView();
		//alert((day-1) + ' dagen in ' + this.arrMonths[this.startDate.getMonth()] + '-' + this.startDate.getFullYear());
	},
	removeChildsFromNode : function(node) { // helpfunctie - verwijder alle childs van node
		while (node.hasChildNodes())
		{
		  node.removeChild(node.firstChild);
		}
	},
	addChildToNode : function(objNode, sTag, sId, sClass, sText) { // helpfunctie. maak html element aan als child van objNode met standaard atttr
		var objChild = document.createElement(sTag);
		if(sText != null)
			objChild.innerHTML = sText;
		if(sId != null)
			objChild.setAttribute('id', sId);
		if(sClass != null)
			objChild.className = sClass;
		
		objNode.appendChild(objChild);
		
		return objChild;
	}
};

var MaakumAgendaEvent = Class.create();

// object voor het agenda event
MaakumAgendaEvent.prototype = {
	eventStart : null, // starttijd
	eventEnd : null, // eindtijd
	eventType : null, // type event
	eventText : null, 
	eventDesc : null,
	eventColor : null,
	eventColorText : null,
	initialize : function(n) {
	
		var j = 0; 
		var eventStartY, eventStartM, eventStartD, eventStartH, eventStartMN, eventEndY, eventEndM, eventEndD, eventEndH, eventEndMN;
			
		eventStartY = n.getAttribute("startY");
		eventStartM = n.getAttribute("startM");
		eventStartD = n.getAttribute("startD");
		eventStartH = n.getAttribute("startH");
		eventStartMN = n.getAttribute("startMN");
		
		eventEndY = n.getAttribute("endY");
		eventEndM = n.getAttribute("endM");
		eventEndD = n.getAttribute("endD");
		eventEndH = n.getAttribute("endH");
		eventEndMN = n.getAttribute("endMN");
		
		this.eventType = n.getAttribute("type");
		this.eventTypeDesc = n.getAttribute("type_desc");
		this.eventText = n.getAttribute("text");
		this.eventDesc = n.getAttribute("desc");
		this.eventColor = n.getAttribute("color");
		this.eventColorText = n.getAttribute("color_text");
			
		// maand op 0 index!
		this.eventStart = new Date(eventStartY, eventStartM-1, eventStartD, eventStartH, eventStartMN, 0);
		this.eventEnd = new Date(eventEndY, eventEndM-1, eventEndD, eventEndH, eventEndMN, 0);
	},
	isAfterDate : function(dd) { // is datum dd na het event?
		if(dd.getFullYear() > this.eventEnd.getFullYear())
			return true;
		if(dd.getMonth() > this.eventEnd.getMonth())
			return true;
		if(dd.getDate() > this.eventEnd.getDate())
			return true;
	},
	fMinutes : function(t) { // minder dan 10 - dan een 0 ervoor
		return (t.getMinutes() < 10 ? "0" + t.getMinutes() : t.getMinutes());
	},
	toHTML : function(showTime) { // geef HTML weergave van het event - todo afhankelijk van zoomLevel?
		var sRet;
		sRet = "<tr style='background-color:" + this.eventColor + ";color:" + this.eventColorText + "'><td class='date'>\n";
		if(showTime)
		{
			sRet += this.eventStart.getDate() + " " + 
				MaakumAgenda.prototype.arrMonths[this.eventStart.getMonth()];
				//this.eventStart.getHours() + ":" + this.fMinutes(this.eventStart);
				
			//  if(this.eventStart != this.eventEnd) werkt niet!
			if(this.eventStart.getTime() != this.eventEnd.getTime())
			{
				sRet += " - ";
				if(this.eventStart.getDate() != this.eventEnd.getDate())
					sRet += this.eventEnd.getDate() + " " + MaakumAgenda.prototype.arrMonths[this.eventEnd.getMonth()];
				//sRet += " " + this.eventEnd.getHours() + ":" + this.fMinutes(this.eventEnd);
			}
		}	
		//sRet += "<div class='agendaEvent'>" + this.eventType + "</div>\n</div>";
		//sRet += "<div class='agendaEventText'>" + this.eventText + "</div>\n";
		//if(this.eventDesc)
		sRet += "</td><td>" + this.eventDesc + "</td></tr>\n";
		//alert(sRet);
		return sRet;
	}
};

// datum selectie
var MaakumAgendaDateSelector = Class.create();

MaakumAgendaDateSelector.prototype = {
	myGlobalName : null,// de globale naam vh object ivm eval(...
	formName : null, 	// naam van de form waar de datumselectie inputvelden zitten
	inputName : null, 	// naam van de datum
	agendaObj : null, 	// het maakumagenda object
	popupObj : null,
	initialize : function(name, fName, iName)
	{
		this.myGlobalName = name;
		this.formName = fName;
		this.inputName = iName;
		this.popupObj = new MaakumPopup();
	},
	getDateFromInput : function() 
	{
		var f = document.forms[this.formName], d, m, y;
		for(var i = 0; i < f.elements.length; i++)
		{
			if(f.elements[i].name == this.inputName + '_day')
				d = f.elements[i].value;
			else if(f.elements[i].name == this.inputName + '_month')
				m = f.elements[i].value -1;
			else if(f.elements[i].name == this.inputName + '_year')
				y = f.elements[i].value;
		}
		return new Date(y, m, d);
	},
	beginSelect : function(e) // maak de selectieview zichtbaar, zodat een datum kan worden geselecteerd
	{
		var div = document.getElementById(this.myGlobalName);
		if(div == null)
		{
			div = document.createElement('div');
			div.setAttribute('id', this.myGlobalName);
			document.body.appendChild(div);
			
			eval(this.myGlobalName + "Agenda = new MaakumAgenda(this.myGlobalName + 'Agenda', 'seldate', this.myGlobalName, this.getDateFromInput(), false);");
			eval('this.agendaObj = ' + this.myGlobalName + 'Agenda;');
			this.agendaObj.setCallBack(this.myGlobalName + ".endSelect"); // bij selecteren van een datum wordt deze callBack unctie aangeroepen
			
			this.agendaObj.setSelectedDate(this.getDateFromInput());
			this.agendaObj.loadTable();
			this.popupObj.show(e, this.agendaObj.objLayer);
		}
	},
	endSelect : function(type, dummyZoom, dd) // standaard callBack functie na het selecteren van een datum
	{
//	alert(type + dd);
		if(type == 'select')
		{
			var f = document.forms[this.formName];
			for(var i = 0; i < f.elements.length; i++)
			{
				if(f.elements[i].name == this.inputName + '_day')
					f.elements[i].value = dd.getDate();
				else if(f.elements[i].name == this.inputName + '_month')
					f.elements[i].value = dd.getMonth() + 1;
				else if(f.elements[i].name == this.inputName + '_year')
					f.elements[i].value = dd.getFullYear();
			}
			this.popupObj.hide();
			//this.agendaObj.objLayer.style.display = 'none';
		}
	}
};