var bWebDialog = false;
var bDialogVisible = false;
var bFading = false;
var mouseX=-1;
var mouseY=-1;
var thisX=-1;
var thisY=-1;
var iOpacity = 0;
var iTrigger = 10;	// Aantal pixels dat de muis moet bewegen of aantal seconden dat er moet gewacht worden om de dialoog te verbergen
var maxOpacity = 90;
var bTriggerMouse = false;

/*
In de properties van de page:

HTML Header:
	<link rel="stylesheet" href="http://gm.emsecure.net/images/messagent.css">
	<script language="javascript" type="text/javascript" src="http://gm.emsecure.net/webservices/messagent.js"></script>
	<style type="text/css">
		td.boxTitle {
			background-image: url(http://gm.emsecure.net/images/dots.gif);
			background-repeat:no-repeat;
			padding-left:15px;
			background-position:0 5px;
		}
		.error input, .error select, .error textarea {
			border:1px solid red;
		}
		.error select {
			background-color:#FF9999;
		}
		.error td {
			color:red;
			font-weight:bold;
		}
		ul {
			margin:0;
			margin-left:20px;
			padding-left:40px;
		}
	</style>	
	
BODY attributes:
	 onload="ParseErrors('~DATA_ERROR~')"
	 

MESSAGE source:

	Kader met foutmeldingen:
	
	<DIV id=MASECTION contentEditable=true MACONSTRAINT="DATA_ERROR<>''" MAPARAMETER="">
		<table width="600" border="0" cellspacing="0" cellpadding="0">
		  <tr>
			<td width="8" height="8"><img src="http://gm.emsecure.net/images/boxcorner_FF0000_white.gif" width="8" height="8"></td>
			<td style="border-top:1px solid #FF0000; border-right:1px solid #FF0000;"><img src="http://www.opel.be/images/spacer.gif" width="1" height="1"></td>
		  </tr>
		  <tr>
			<td style="border-left:1px solid #FF0000; border-bottom:1px solid #FF0000;"><img src="http://www.opel.be/images/spacer.gif" width="1" height="1"></td>
			<td style="border-right:1px solid #FF0000; border-bottom:1px solid #FF0000; padding-bottom:10px;"><table width="100%"  border="0" cellspacing="0" cellpadding="0">
			  <tr>
				<td style="color:#FF0000"><img src="http://gm.emsecure.net/optireport/images/warning.gif" alt="Fout" width="16" height="16" align="absmiddle" /> Er zijn fouten opgetreden. Gelieve de velden met de rode rand na te kijken.<br />
				<span id="customErrors"></span></td>
			  </tr>
			</table></td>
		  </tr>
		</table>
		<br>
	</DIV>

	Bij de validatie heeft ekle validatie als foutmelding de veldnaam.
	Indien er meer info gegeven moet worden bij een foutmelding die specifiek op 1 of meerdere veld slaat, dan is de foutmelding "VELDNAAM|beschrijvende tekst" of "VELDNAAM1|VELDNAAM2|VELDNAAM3|beschrijvende tekst".
	Heeft de foutmelding betrekking op meerdere velden tegelijkertijd, dan wordt er enkel een beschrijvende tekst gezet. Deze verschijnt dan bovenaan.
*/

// === Afhandeling van errors ============================ 
function findRow(elementName)
{
	var x = document.getElementById(elementName);
	if(!x)
		return;
	while((x.tagName.toUpperCase()!="TR") && x.tagName.toUpperCase()!="BODY")
		x = x.parentNode;
	return x;
}
function ParseErrors(strError)
{
	//alert(strError);
	var errStr = "";
	if(strError!="")
	{
		strError = strError.replace("'","&acute;");
		var names = strError.split("<BR>");
		for(i=0;i<names.length-1;i++)
		{
			if(names[i]!="")
			{
				var x = findRow(names[i]);
				if(x)
				{
					x.className="error";
					var el = document.getElementById(names[i]);
					if(el.type=="radio") el.style.borderWidth=0;
				}
				else
				{
					if(names[i].indexOf("|")>0)
					{
						var arr = names[i].split("|");
						for(j=0;j<arr.length-1;j++)
						{
							//alert(arr[j]);
							el = findRow(arr[j]);
							if(el)
							{
								//alert(arr[j]+": ShowToolTip('"+arr[arr.length-1]+"');");
/*								//--- Veld ----------------------------------------------
								var field = document.getElementById(arr[j]);
								//field.title = arr[arr.length-1];
								field.onmouseover = eval("function() { ShowToolTip('" + arr[arr.length-1] +"'); }");
								field.onmouseout = function() { HideToolTip(); };
								//--- TabelRij ------------------------------------------
								//el.title = arr[arr.length-1];
								el.onmouseover =eval("function() { ShowToolTip('" + arr[arr.length-1] +"'); }");
								el.onmouseout = function() { HideToolTip(); };
*/
								//--- Veld ----------------------------------------------
								var field = document.getElementById(arr[j]);
								field.err = arr[arr.length-1];
								if(field.type=="radio") field.style.borderWidth=0;
								field.onmouseover = function() { ShowToolTip(this.err); };
								field.onmouseout = function() { HideToolTip(); };
								//--- TabelRij ------------------------------------------
								el.err = arr[arr.length-1];
								el.onmouseover = function() { ShowToolTip(this.err); }
								el.onmouseout = function() { HideToolTip(); };

								el.className="error";
							}
						}
						errStr += "<li>"+arr[arr.length-1]+"</li>";
					}
					else
						errStr += "<li>"+names[i]+"</li>";
				}
			}
		}
		if(errStr!="" && (bWebDialog || document.getElementById("customErrors")))
			if(bWebDialog)
			{
				document.write(CreateDialog(errStr));
				if(bTriggerMouse) 
					AttachEvent();
				else
					setTimeout("hideDialog()", iTrigger*1000);
				bDialogVisible = true;
				showDialog();
			}
			else
				document.getElementById("customErrors").innerHTML = "<ul class='OptzUl'>"+errStr+"</ul>";
	}
}
function CreateDialog(errStr)
{
	var style = "style='position:absolute;top:100px;left:180px;background-color:#FF9900; margin:0 auto; width:600px;text-align:left; color:#FF0000; padding-top:10px; padding-bottom:10px; color:#000'"
	return "<div id='maDivDialog' "+style+"><ul class='OptzUl'>"+errStr+"</ul></div>"
}
function out(txt)
{
	document.write(txt);
}
function getMousePos (e) 
{
	if(bDialogVisible && !bFading)
	{
	
		var posx = 0;
		var posy = 0;
	
		if (document.layers) { //Netscape
			posx = e.pageX;
			posy = e.pageY;
		} else if (document.all) { //IE
			posx = window.event.x+document.body.scrollLeft;
			posy = window.event.y+document.body.scrollTop;
		} else if (document.getElementById) {
			// Netscape 6 behaves the same as Netscape 4 in this regard
			posx = e.pageX;
			posy = e.pageY;
		}
		
		if(parseInt(mouseX,10)<0 || parseInt(mouseY,10)<0)
		{
			mouseX = posx;
			mouseY = posy;
			thisX = posx;
			thisY = posy;
		}
		else
		{
			thisX = posx;
			thisY = posy;
		}
		
		checkPos();
	}
}
function checkPos ()
{
	if(!bFading && (Math.abs(mouseX-thisX)>iTrigger || Math.abs(mouseY-thisY)>iTrigger))
		hideDialog();
}
function hideDialog ()
{
	bFading = true;
	if(iOpacity==0)
	{
		bDialogVisible = false;
		bFading = false;
	}
	else
	{
		iOpacity -= 10;
		setOpacity(iOpacity);
		setTimeout("hideDialog()", 100);
	}
}
function showDialog()
{
	bFading = true;
	if(iOpacity<=maxOpacity)
	{
		iOpacity += 10;
		setOpacity(iOpacity);
		setTimeout("showDialog()", 100);
	}
	else
		bFading = false;
}
function setOpacity()
{
	var dDialog = document.getElementById("maDivDialog");
	if(!dDialog)
		return false;
    if (navigator.appName.indexOf("Netscape")!=-1&&parseInt(navigator.appVersion)>=5)
    	dDialog.style.MozOpacity=iOpacity/100;
	else
		dDialog.style.filter = 'alpha(opacity='+iOpacity+')';
}
function AttachEvent()
{
	if (document.layers) { // Netscape
		document.captureEvents(Event.MOUSEMOVE);
		document.onmousemove = getMousePos;
	} else if (document.all) { // Internet Explorer
		document.onmousemove = getMousePos;
	} else if (document.getElementById) { // Netcsape 6
		document.onmousemove = getMousePos;
	}
}
// =======================================================
function CreateDropdown(elementName, startVal, endVal, defaultValue, step, dummy) 
{
	if(typeof(elementName)=="undefined")
		return "- Error - no elementName defined -";
	if(typeof(startVal)=="undefined")
		startVal=1;
	if(typeof(endVal)=="undefined")
		endVal = 10;
	if(typeof(step)=="undefined")
		step=1;
	if(typeof(defaultValue)=="undefined")
		defaultValue = "";
	if(typeof(dummy)=="undefined")
		dummy = true;

	sReturn = "";
	sReturn += "<select id='"+elementName+"' name='"+elementName+"'>\n";
	if(dummy)
		sReturn += "	<option value='' selected='selected'>-</option>\n";
	if(startVal<=endVal)
	{
		for(i=startVal;i<=endVal;i+=step)
		{
			if(i<10)
				j="0"+i;
			else
				j=i;
			if(i==defaultValue)
				sReturn += "	<option selected='selected' value='"+j+"'>"+j+"</option>\n";
			else
				sReturn += "	<option value='"+j+"'>"+j+"</option>\n";
		}
	}
	else
	{
		for(i=startVal;i>=endVal;i-=step)
		{
			if(i<10)
				j="0"+i;
			else
				j=i;
			if(i==defaultValue)
				sReturn += "	<option selected='selected' value='"+j+"'>"+j+"</option>\n";
			else
				sReturn += "	<option value='"+j+"'>"+j+"</option>\n";
		}
	}
	sReturn += "</select>\n";
	out(sReturn);
}
function CreateArrayDropdown(elementName, elements, defaultValue, dummy) 
{
	if(typeof(elementName)=="undefined")
		return "- Error - no elementName defined -";
	if(typeof(elements)=="undefined")
		return "- Error - no elements defined -";
	if(typeof(defaultValue)=="undefined")
		defaultValue = "";
	if(typeof(dummy)=="undefined")
		dummy = true;
	
	var arrElements = elements.split(",");
	
	sReturn = "";
	sReturn += "<select id='"+elementName+"' name='"+elementName+"'>\n";
	if(dummy)
		sReturn += "	<option value='' selected='selected'>-</option>\n";
	for(i=0;i<=arrElements.length/2;i+=2)
		if(arrElements[i]==defaultValue)
			sReturn += "	<option selected='selected' value='"+arrElements[i+1]+"'>"+arrElements[i]+"</option>\n";
		else
			sReturn += "	<option value='"+arrElements[i+1]+"'>"+arrElements[i]+"</option>\n";
	sReturn += "</select>\n";
	out(sReturn);
}

function PreFillDate()
{
	// Dropdowns prefillen

	if('~@BIRTHDATE~'!='') {
		var datum      = '~@BIRTHDATE~';
		document.registreren.YEAR.value=datum.substring(0,4);
		document.registreren.MONTH.value=datum.substring(5,7);
		document.registreren.DAY.value=datum.substring(8,10);
	}else{
		if('~@YEAR~'!='')
			document.registreren.YEAR.value='~@YEAR~';
		if('~@MONTH~'!='')
			document.registreren.MONTH.value='~@MONTH~';
		if('~@DAY~'!='')
			document.registreren.DAY.value='~@DAY~';
	}
}

function goto(url)
{
	document.location.href = url;
}