window.onload = function ()
{
 // handle onclick event for element of ID="foo"
 Event.observe(	'search_nickname', 
 				'keypress' , 
 				function(event){ 
 					if(event.keyCode == Event.KEY_RETURN)
 					{
 						sendForm('zoekterm', 'htmResult', 'search.php')
 					}
 				}
 );
 				
 
}

function getPage(url) {
								
				showLoading();
	
				//here we wont use the inline functions for success and failuer, instead we point them to our own functions 
				//i believe this makes it easier for beginners
				new Ajax.Request(url,   {     
					method:'get',     
					
					onSuccess: getPageSuccess,     
					onFailure: getPageFailure
				}); 
}

function showLoading() {
				$('htmlResult').innerHTML = '<img src="images/ajax_icons/bigrotation2.gif">';
				//alert('loading...');
}
				


function getPageSuccess(originalRequest) {
				//originalRequest is the data sent back from the AJAX request
				//because we are not using XML, we need to get the responseText property
				//this will output whatever is retrieved from the AJAX call
				var response = originalRequest.responseText;
				//the $ is a built in shortcut for prototype that
				//we can use in place of document.getElementById()
				$('htmlResult').innerHTML = response;
}

function getPageFailure() {
				alert('woops, what happened?');
}

function clearNode(node) {
				$(node).innerHTML = "";
				$(node).innerHTML = "";
}



function sendForm(form, targetdiv, url){
    
	
	var params = Form.serialize($(form));
    //new Ajax.Updater(targetdiv, url, { method: 'post', parameters: params});
    //new Ajax.Updater(div, url, {asynchronous:true , evalScripts:true , parameters:params});

    showLoading();
       
    var myAjax = new Ajax.Request( 
                  url, 
                  {	method: 'post', 
                  	parameters: params, 
                  	onSuccess: getPageSuccess,     
					onFailure: getPageFailure
                  })
    
}

function checkAndSendForm(form, targetdiv, url){
    var params = Form.serialize($(form));
    //new Ajax.Updater(targetdiv, url, { method: 'post', parameters: params});
    //new Ajax.Updater(div, url, {asynchronous:true , evalScripts:true , parameters:params});
    
    if(checkBirthDate())
    {
    	var myAjax = new Ajax.Request( 
                  url, 
                  {	method: 'post', 
                  	parameters: params, 
                  	onSuccess: getPageSuccess,     
					onFailure: getPageFailure
                  })	
    }
    
    
}


function checkBirthDate()
{
	
	var arr = new Array();
	var errors = new Array();
	var errorstring = '';

	document.getElementById('birthdate_day').style.border='1px solid green';
	document.getElementById('birthdate_day').style.backgroundColor='#e3fbe8';
	
	document.getElementById('birthdate_month').style.border='1px solid green';
	document.getElementById('birthdate_month').style.backgroundColor='#e3fbe8';
	
	document.getElementById('birthdate_year').style.border='1px solid green';
	document.getElementById('birthdate_year').style.backgroundColor='#e3fbe8';
	
		
	errorstring = 
	
		isEmpty(document.getElementById('birthdate_day')) 
		+ isEmpty(document.getElementById('birthdate_month'))
		+ isEmpty(document.getElementById('birthdate_year'))
			
	errors = errorstring.split(',');
		
	
	for (i=0;i<errors.length-1;i++)
	{
		document.getElementById(errors[i]).style.border='1px solid red';
		document.getElementById(errors[i]).style.backgroundColor='#fbe3e3';
		
	}
	
	
	if(errors.length > 1)
	{
		if(confirm("Doorgaan zonder geldige geboortedatum?"))
		{
			return true;
		}
		
		return false;
	}
	
	return true;

}

function isEmpty(elem)
{
	if(elem.value.length == 0)
	{
		return elem.name+',';
	}
	return '';
	
}

function gotoPage(url)
{
	window.location = url;
}