window.onload = function() {
	document.getElementById('divDatum').style.display = "block";
}

DBLANGUAGE = "EN";
DBDELIMITER = "/";
SERVERLANGUAGE = "EN";
SERVERDELIMITER = "/";

var calName = '';

isIE = (document.all ? true : false);
isDOM = (document.getElementById ? true : false);

       
var months = new Array("Januari", "Februari", "Maart", "April", "Mei", "Juni", "Juli", "Augustus", "September", "Oktober", "November", "December");
var daysInMonth = new Array(31, 28, 31, 30, 31, 30, 31, 31, 30, 31, 30, 31);
var displayMonth = parseInt(new Date().getMonth());
var displayYear = new Date().getFullYear();
var displayDivName;
var realElement;
var imgPath = sRoot + "now/program/images/";
var cssPath = sRoot + "css/custom/";

document.write("<link rel='stylesheet' href='" + cssPath + "datepicker.css'>");

function fixPosition(divname) 
{
	return false;
	
	divstyle = getDivStyle(divname);
	positionerImgName = divname + 'Pos';
	isPlacedUnder = true;
	
	if (isPlacedUnder) 
	{
		setPosition(divstyle,positionerImgName,true);
	} 
	else 
	{
		setPosition(divstyle,positionerImgName);
	}
}

function setPosition(elt,positionername,isPlacedUnder) 
{
	var positioner;
	
	if (isIE) 
	{
  		positioner = document.all[positionername];
	} 
	else 
	{
 		if (isDOM) 
		{
			positioner = document.getElementById(positionername);
		} 
		else 
		{
    		positioner = document.images[positionername];
		}
	}
}

function CreateCalendar(eltName, dDate, zIndex)
{
	str = '<div id="div' + eltName + '" style="display: none; width: 200px; position:relative; z-index: '+zIndex+'">';
	str += '<table border=0 cellpadding=0 cellspacing=0><tr><td><div id="divInput' + eltName + '" style=""><input name="' + eltName + '" class="clsInput" readonly unselectable="on" style="color: #003DB2; padding: 0 8px; width: 148px;"></div>';
	
	str += '</td><td><a href="javascript:void(0);" onClick="toggleDatePicker(\'frmCalendar' + eltName + '\',\'daysOfMonth' + eltName + '\',document.frm.' + eltName + ', \'document.frm.' + eltName + '\');">';
	str += '<img id="daysOfMonthPos" name="daysOfMonthPos" src="' + imgPath + 'img_datepicker.gif" align="absmiddle" border="0" width="16" height="15" style="display:block;margin: 0px 0px 0px 5px" alt="Klik hier om een datum te kiezen"></a>';
	str += '<div id="daysOfMonth' + eltName + '" style="position:absolute; visibility: hidden; z-index: '+zIndex+1+'; left: 0px; top: 20px;"></div></td></tr></table></div>';

	document.write(str);
	
	if(dDate != "")
	{
		if (SERVERLANGUAGE == "NL")
		{

		arDate = dDate.split("-");
		
		nMonth = arDate[1];
		day =  arDate[0];
		displayYear =  arDate[2];

		}
		else
		{
		arDate = dDate.split("/");
		
		nMonth = arDate[0];
		day =  arDate[1];
		displayYear =  arDate[2];
		}
		
		n = "document.frm." + eltName;
		displayElement = eval(n);
		displayElement.value = day + " " + months[nMonth-1].toLowerCase() + " " + displayYear;
		
	}
}

function toggleDatePicker(calendarName,eltName,formElt, description) 
{
	
  realElement = formElt;
  
  n = description;
  displayElement = eval(n);
  
  calName = calendarName;
  newCalendar(eltName,formElt,0);
  toggleVisible(eltName);
  
}

function getDays(month, year) 
{
	if (1 == month)
    	return ((0 == year % 4) && (0 != (year % 100))) || (0 == year % 400) ? 29 : 28;
    else
       return daysInMonth[month];
}

function getToday() 
{
	this.now = new Date();
	this.year = this.now.getFullYear();
	this.month = this.now.getMonth();
	this.day = this.now.getDate();
}


today = new getToday();

function newCalendar(eltName,attachedElement,nType) 
{
	
   	var sIFrame = "<iframe id='" + calName + "' width='170' height='170' scrolling='no' frameborder='0' border='0'></iframe>";
 
	if (attachedElement) 
	{
       if (displayDivName && displayDivName != eltName) hideElement(displayDivName);
    }

	displayDivName = eltName;
    today = new getToday();

   	var parseYear = parseInt(displayYear + '');
   	var newCal = new Date(parseYear,displayMonth,1);
   	var day = -1;
   	var startDayOfWeek = newCal.getDay();

    if ((today.year == newCal.getFullYear()) && (today.month == newCal.getMonth()))
    {
           day = today.day;
    }
    
    var intDaysInMonth = getDays(newCal.getMonth(), newCal.getFullYear());
    var daysGrid = makeDaysGrid(startDayOfWeek,day,intDaysInMonth,newCal,eltName)
    displayMonth = newCal.getMonth();
    if (isIE) 
    {
		var elt = document.all[eltName];

     		elt.innerHTML = sIFrame;
     		
     		eval(calName).document.write("<html><head><link rel='stylesheet' href='" + cssPath + "datepicker.css' /></head><body style='margin:0px;'><div id='"+eltName+"'></div></body></html>");
       		eval(calName).document.all(eltName).innerHTML = daysGrid;
    } 
    else if (isDOM) 
    {
       var elt = document.getElementById(eltName);
       elt.innerHTML = daysGrid;
    } 
    else 
    {
       var elt = document.layers[eltName].document;
       elt.open();
       elt.close();
    }
}

function incMonth(delta,eltName) 
{
   displayMonth += delta;

   if (displayMonth >= 12) 
   {
     displayMonth = 0;
     incYear(1,eltName);
   } 
   else if (displayMonth <= -1) 
   {
     displayMonth = 11;
     incYear(-1,eltName);
   } 
   else 
   {
     newCalendar(eltName,1);
   }
   
}

function incYear(delta,eltName) 
{
   displayYear = parseInt(displayYear + '') + delta;
   newCalendar(eltName,1);
}

function makeDaysGrid(startDay,day,intDaysInMonth,newCal,eltName) 
{
	//parent.hideElement(\'' + eltName + '\')
    var daysGrid;
    var month = newCal.getMonth();
    var year = newCal.getFullYear();
    var isThisYear = (year == new Date().getFullYear());
    var isThisMonth = (day > -1)
    daysGrid = '<div class="clsCalendar";">';
    daysGrid += '<table border=0 cellspacing=0 cellpadding=0 width="100%">';
    daysGrid += '<tr>';
    daysGrid += '<td colspan=7 height=15 class="clsDPHeader">';
    daysGrid += '<table border=0 cellspacing="0" cellpadding="0" width="100%">';
    daysGrid += '<tr><td width="10">';
    daysGrid += '<a href="javascript:parent.incMonth(-1,\'' + eltName + '\')"><img src="' + imgPath + 'arrow_left.gif" width="5" height="9" border="0" hspace="4"></a>';
	daysGrid += '</td><td width="200" align="center">';

    if (isThisMonth) { daysGrid += months[month]; }
    else { daysGrid += months[month]; }

    daysGrid += '</td><td width="10">';
    daysGrid += '<a href="javascript:parent.incMonth(1,\'' + eltName + '\')"><img src="' + imgPath + 'arrow_right.gif" width="5" height="9" border="0" hspace="4"></a>';
    daysGrid += '</td><td width="10">&nbsp;</td><td width="10">';
    daysGrid += '<a href="javascript:parent.incYear(-1,\'' + eltName + '\')"><img src="' + imgPath + 'arrow_left.gif" width="5" height="9" border="0" hspace="4"></a>';

	daysGrid += '</td><td width="100" align="center">';

    if (isThisYear) { daysGrid += year; }
    else { daysGrid += ''+year; }

	daysGrid += '</td><td width="10">';
    daysGrid += '<a href="javascript:parent.incYear(1,\'' + eltName + '\')"><img src="' + imgPath + 'arrow_right.gif" width="5" height="9" border="0" hspace="4"></a></td>';
    daysGrid += '</tr></table></td></tr><tr height=14>';
    daysGrid += '<td align=center>zo</td><td align=center>ma</td><td align=center>di</td><td align=center>wo</td><td align=center>do</td><td align=center>vr</td><td align=center>za</td></tr>';
	daysGrid += '<tr><td colspan=7><div class="clsDPSeparator">-</div></td></tr>';
    
    var dayOfMonthOfFirstSunday = (7 - startDay + 1);
    for (var intWeek = 0; intWeek < 6; intWeek++) 
    {
    	
    	daysGrid += "<tr height=15>";
    	
    	var dayOfMonth;
    	
    	for (var intDay = 0; intDay < 7; intDay++) 
    	{
        	dayOfMonth = (intWeek * 7) + intDay + dayOfMonthOfFirstSunday - 7;
	 		if (dayOfMonth <= 0) 
	 		{
           		daysGrid += '<td></td>';
	 		} 
	 		else if (dayOfMonth <= intDaysInMonth) 
	 		{
	   			var color = "black";
	   			
	   			if (day > 0 && day == dayOfMonth) color="red";
	   
	   			if (color == "red")
	   			{
	   				daysGrid += '<td align="center" class="clsActive">';
	   			}
	   			else
	   			{
	   				daysGrid += '<td align="center">';
	   			}
	   			daysGrid += '<a href="javascript:parent.setDay(';
	   			daysGrid += dayOfMonth + ',\'' + eltName + '\')" '
	   			daysGrid += '>';
	   
	   			var dayString = dayOfMonth + "</a> ";
	   
	   			if (dayString.length == 6) dayString = '0' + dayString;
	   			daysGrid += dayString + "</td>";
	 		}
        }
		if (dayOfMonth < intDaysInMonth) daysGrid += "";
		
		daysGrid += "</tr>"
	}
	
	daysGrid += '<tr><td colspan=7><div class="clsDPSeparator">-</div></td></tr>';	
	daysGrid += '<tr><td style="text-align: right;" align="right" colspan="7" height="20">';
	daysGrid += '<input onclick="parent.doToday(\'' + eltName + '\');" class="clsBttn" type="button" value="Vandaag"> <input type="button" value="Geen" onclick="parent.EmptyDate(\'' + eltName + '\');" class="clsBttn"></td></tr>';
    return daysGrid + "</table></div>";
}

function setDay(day,eltName) 
{
   var nMonth = displayMonth;

	if (DBLANGUAGE == "NL")
	{
   		realElement.value = (day) + "-" + (nMonth+1) + "-" + displayYear;
	}
	else
	{
		realElement.value = (nMonth+1) + "/" + (day) + "/" + displayYear;
	}
	
   displayElement.value = day + " " + months[nMonth].toLowerCase() + " " + displayYear;
  	
   hideElement(eltName);
}

function doToday(eltName)
{
	
    realElement.value = (today.month+1) + "/" + (today.day) + "/" + today.year;
   	displayElement.value = today.day + " " + months[today.month].toLowerCase() + " " + today.year;
		
	hideElement(eltName);
}

function EmptyDate(eltName)
{
		
	realElement.value = "";
	displayElement.value = "";
		
	hideElement(eltName);
}


isIE = (document.all ? true : false);
isDOM = (document.getElementById ? true : false);

function getAbsX(elt) { return (elt.x) ? elt.x : getAbsPos(elt,"Left"); }
function getAbsY(elt) { return (elt.y) ? elt.y : getAbsPos(elt,"Top"); }
function getAbsPos(elt,which) 
{
 iPos = 0;
 while (elt != null) {
  iPos += elt["offset" + which];
  elt = elt.offsetParent;
 }
 return iPos;
}

function getDivStyle(divname) 
{
 var style;
 if (isDOM) { style = document.getElementById(divname).style; }
 else { style = isIE ? document.all[divname].style
                     : document.layers[divname]; } 
 return style;
}

function hideElement(divname) 
{
 getDivStyle(divname).visibility = 'hidden';
}

function toggleVisible(divname) 
{
	divstyle = getDivStyle(divname);
	if (divstyle.visibility == 'visible' || divstyle.visibility == 'show') 
	{
		divstyle.visibility = 'hidden';
 	} 
 	else 
 	{
		divstyle.pixelLeft = 0;
		divstyle.pixelTop = 22;
		
		divstyle.visibility = 'visible';
	}
}