function enhanceCheckboxes() {

// finds every checkbox on the page
// and converts it to a graphical version
  
  // find all input controls:
  var els=document.getElementsByTagName("input");
  
  // for each input element...
  for(var i=0; i < els.length; i++) {
      

    if (els[i].type=='checkbox') { // its a checkbox
  
      // hide the original checkbox control:  
      els[i].style.display='none';
      
      // create the graphical alternative:
      var img = document.createElement("img");
      
      // initial state of graphical checkbox 
      // is the same as the original checkbox:
       
      if (els[i].checked) {
       
        //img.src="/CheckboxChecked.gif.gif";
        img.src="/images/site/checkbox_checked.gif";
        img.title="Checked";
      }
      else {
      
        //img.src="/CheckboxUnchecked.gif";
        img.src="/images/site/checkbox.gif";
        img.title="Unchecked";
      } 
      
      // assign our onclick event 
      img.onclick= toggleCheckbox;
      
      // insert the new, clickable image into the DOM
      // infront of the original checkbox:
      
      els[i].parentNode.insertBefore(img, els[i]);
      
    }  
  
  }
 

}


function toggleCheckbox() {

// graphical checkbox onclick event handler
  var value = 50;
  // toggle the checkbox state:
  
  if (this.title == "Checked") {

    // toggle the image and title:  
   
    //this.src="/CheckboxUnchecked.gif";
    this.src="/images/site/checkbox.gif";
    this.title="Unchecked";
    
    // update the hidden real checkbox to match the state of the graphical 
    // version:
    this.nextSibling.checked=false;
   	value= parseFloat(this.nextSibling.value);
  }
  else {
  
    // toggle the image and title:  
    
    //this.src="/CheckboxChecked.gif";
    this.src="/images/site/checkbox_checked.gif";
    this.title="Checked";

    // update the hidden real checkbox to match the state of the graphical 
    // version:
    this.nextSibling.checked=true;
    value= parseFloat(this.nextSibling.value);
  }
 
}

function EnhanceRadio() {

  // add popup links to all lookup fields

  var els=document.getElementsByTagName("input");

  for(var i=0; (el=els[i]); i++) {
  
    if (el.type == "radio") {
    
      el.style.display='none';

      var img=document.createElement("img");
      if (el.checked) {
       
        img= new Image(16,16);
        img.src="/images/site/checked.gif";
        img.title="Checked";
       // img.width="18";
        //img.height="18":
      }
      else {
      
       img= new Image(16,16);
        img.src="/images/site/unchecked.gif";
        img.title="Unchecked";
        //img.width="17";
        //img.height="17":
      } 
      //img.setAttribute("src", "/RadioboxUnchecked.gif");
     // img.setAttribute("src", "/images/radiobutton.gif");
     // img.setAttribute("alt", "Unchecked");
      img.onclick= toggleRadio;
      el.onchange=toggleRadio;
      
      el.parentNode.insertBefore(img, el);
          
    }

  }
    
}

function toggleRadio() {

// graphical checkbox onclick event handler
  
  // toggle the checkbox state:

  this.nextSibling.checked=true;
  
  els=this.parentNode.parentNode.getElementsByTagName("input");
  
  for(var i=0; (el=els[i]); i++) {
  
    if (el.type == "radio") {
    
      if(el.checked) {
      
        //el.previousSibling.setAttribute("src", "/RadioboxChecked.gif");
        el.previousSibling.setAttribute("src", "/images/site/checked.gif");
        
      }
      else {
        //el.previousSibling.setAttribute("src", "/RadioboxUnchecked.gif");
        el.previousSibling.setAttribute("src", "/images/site/unchecked.gif");
      }

    }

  }
  
}

window.onload = function() {

	
  enhanceCheckboxes();
  EnhanceRadio();
 
}


//---------------------------------------------------------------//
//  CONTACT PAGINA  =>  CHECK FIELDS            					  		 //
//---------------------------------------------------------------//


/**************************************
| OVERRIDE NORMAL ALERT FUNCTION      |
***************************************/


		// constants to define the title of the alert and button text.
		var ALERT_TITLE = "";
		var ALERT_BUTTON_TEXT = "Ok";
		
		// over-ride the alert method only if this a newer browser.
		// Older browser will see standard alerts
		if(document.getElementById) {
			window.alert = function(txt) {
				createCustomAlert(txt);
			}
		}
		
		function createCustomAlert(txt) {
			// shortcut reference to the document object
			d = document;
		
			// if the modalContainer object already exists in the DOM, bail out.
			if(d.getElementById("modalContainer")) return;
			
			
			/*bo = d.getElementsByTagName("body");
			bo.style.backgroundcolor= "#000000";*/
			// create the modalContainer div as a child of the BODY element
			mObj = d.getElementsByTagName("body")[0].appendChild(d.createElement("div"));
			mObj.id = "modalContainer";
			 // make sure its as tall as it needs to be to overlay all the content on the page
			mObj.style.height = document.documentElement.scrollHeight + "px";
			
			
			// create the DIV that will be the alert 
			alertObj = mObj.appendChild(d.createElement("div"));
			alertObj.id = "alertBox";
			// MSIE doesnt treat position:fixed correctly, so this compensates for positioning the alert
			if(d.all && !window.opera) alertObj.style.top = document.documentElement.scrollTop + "px";
			// center the alert box
			
			alertObj.style.left = (d.documentElement.scrollWidth - alertObj.offsetWidth)/2 + "px";
		
			// create an H1 element as the title bar
			h1 = alertObj.appendChild(d.createElement("h1"));
			h1.appendChild(d.createTextNode(ALERT_TITLE));
		
			//tekst in pre tag gewrapped
			//msgInner = alertObj.appendChild(d.createElement("<p>"));
			msg = alertObj.appendChild(d.createElement("p"));
			msg.innerHTML = txt;
			//msgInner.appendChild(d.createTextNode(txt));
			
		
		
			// create an anchor element to use as the confirmation button.
			btn = alertObj.appendChild(d.createElement("a"));
			btn.id = "closeBtn";
			btn.appendChild(d.createTextNode(ALERT_BUTTON_TEXT));
			btn.href = "#";
			// set up the onclick event to remove the alert when the anchor is clicked
			btn.onclick = function() { removeCustomAlert();return false; }
		
			
		}
		
		// removes the custom alert from the DOM
		function removeCustomAlert() {
			document.getElementsByTagName("body")[0].removeChild(document.getElementById("modalContainer"));
		}


/**************************************
| VALDIATION OF FORM FIELDS            |
***************************************/

			
//formulier controle	
			function validateContactFormOnSubmit(theForm) {
			var reason = "";
		
		  reason += validateEmpty(theForm.naam ,  "Uw naam" , "#ffffff");
		  reason += emailCheck(theForm.email, "#ffffff");
		  reason += validateEmpty(theForm.message, "Het bericht", "#ffffff");
		 
		      
		  if (reason != "") {
		    alert("Sommige velden werden niet ingevuld:<br><br>" + reason);
		    return false;
		  }
		
		  return true;
		}
		
//Nieuwsbrief inschrijving controle

		function validateNewsletterOnSubmit(theForm) {
			var reason = "";
		
		  reason += validateEmpty(theForm.naam ,  "Uw naam" , "#ffffff");
		  reason += emailCheck(theForm.email, "#ffffff");
		  reason += validateDag(theForm.dagdag, "Geboortedag", "#ffffff");
		  reason += validateMaand(theForm.maanddag, "Geboortemaand", "#ffffff");
		 
		      
		  if (reason != "") {
		    alert("Sommige velden werden niet ingevuld:<br><br>" + reason);
		    return false;
		  }
		
		  return true;
		}
		
		function validateEmpty(fld, fieldname, color) {
		    var error = "";
		 
		    if (fld.value.length == 0) {
		        fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is niet ingevuld.<br>"
		    } else {
		        fld.style.background = color;
		    }
		    return error;  
		} 
		
		function validateEmptyMore(fld, defaultname, fieldname, color) {
		    var error = "";
		 		if (fld.value.length == 0 || fld.value == defaultname) {
		        fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is niet ingevuld.<br>"
		    }
		    else if (fld.value.length < 3) {
		        fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is niet correct ingevuld.<br>"
		    } else {
		        fld.style.background = color;
		    }
		    return error;  
		}
		
		function validateDag(fld, fieldname, color) {
		 var error = "";
					if (fld.value.length == 0) { 
						fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is niet ingevuld.<br>"
		    	}
		    	else if(isNaN(fld.value)){
		    		fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is geen getal.<br>"
					
					}
					else if(fld.value > 31 ){
		    		fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is geen geldige dag.<br>"
					
					}
					else {
		        fld.style.background = color;
		    }
		    return error;  
		}
		
		function validateMaand(fld, fieldname, color) {
		 var error = "";
					if (fld.value.length == 0) { 
						fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is niet ingevuld.<br>"
		    	}
		    	else if(isNaN(fld.value)){
		    		fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is geen getal.<br>"
					
					}
				else if(fld.value > 12 ){
		    		fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is geen geldige maand.<br>"
					
					}
					else {
		        fld.style.background = color;
		    }
		    return error;  
		}
		
		function validatePhone(fld, defaultname, fieldname, color) { 
			 var error = "";
			 
			 var reg = /([^a-zA-Z])$/;
		   var phone = fld.value;
		   if(reg.test(phone) == false) {
		     error="- Uw telefoon nummer is ongeldig.<br>";
		     fld.style.background = '#e8ecb1'; 
		   }
		 		if (fld.value.length == 0 || fld.value == defaultname) {
		        fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is niet ingevuld.<br>"
		    }
		    else if (fld.value.length < 9) {
		        fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is niet correct ingevuld.<br>"
		    } 
		     else if (fld.value.length < 3) {
		        fld.style.background = '#e8ecb1'; 
		        error = fieldname+ " is niet correct ingevuld.<br>"
		    } 
		    else {
		        fld.style.background = color;
		    }
		    return error;  
		}
		
		function closeWarning(i){
			document.getElementById('warning'+i).style.display ='none';
		}
		
		function emailCheck(email, color) {
			
			var error = "";
		   var reg = /^([A-Za-z0-9_\-\.])+\@([A-Za-z0-9_\-\.])+\.([A-Za-z]{2,4})$/;
		   var address = email.value;
		   if(reg.test(address) == false) {
		     error="Uw e-mail is ongeldig.<br>";
		     email.style.background = '#e8ecb1'; 
		   }
		   else{
		   	 email.style.background = color;
		   }
		   return error
		}
		

/*************************
* POPUP JAVASCRIPT IMAGE
**************************/
function showImage(photo,width,height) {
var wrapWidth = width + 56;
var wrapHeight= height + 90;

var scroll_array= getScrollXY();
var size_array=alertSize();

myleft=(screen.width)?(size_array[0]-wrapWidth)/2:100;
myleft+=scroll_array[0];

myTop =(screen.height)?(size_array[1]-wrapHeight)/2:100;
myTop+=scroll_array[1];

var i = document.getElementById('imageBlock');
i.style.left=myleft+"px";
i.style.top= myTop+"px";
//var loader = document.getElementById('loader');
//loader.style.display='inline';
i.innerHTML = "<div id=\"PopUpwrapper\" style=\"width:" + wrapWidth + "px;height:" + wrapHeight + "px; \"><div id=\"closeWrap\" ><a id=\"loader\" href=\"javascript:loaderClose();\">Sluiten</a></div><div class=\"largeImage\"><a href=\"javascript:loaderClose();\" class=\"imageClose\"><img src=\"http://secundo.909.be/images/uploaded/large/" + photo + "\" width=\"" + width +"\" height=\"" + height +"\" alt=\""+ photo + "\" id=\"largeImage\" /></a></div></div><div class=\"clearer\"></div>";
i.style.display='block';
i.style.zIndex=1000;
i.style.position ="absolute";



} 

/***************************
* POPUP JAVASCRIPT IMG-KIDS
****************************/
function showImageK(photo,width,height) {
var wrapWidth = width + 56;
var wrapHeight= height + 90;

var scroll_array= getScrollXY();
var size_array=alertSize();

myleft=(screen.width)?(size_array[0]-wrapWidth)/2:100;
myleft+=scroll_array[0];

myTop =(screen.height)?(size_array[1]-wrapHeight)/2:100;
myTop+=scroll_array[1];

var i = document.getElementById('imageBlock');
i.style.left=myleft+"px";
i.style.top= myTop+"px";
//var loader = document.getElementById('loader');
//loader.style.display='inline';
i.innerHTML = "<div id=\"PopUpwrapper\" style=\"width:" + wrapWidth + "px;height:" + wrapHeight + "px; \"><div id=\"closeWrap\" ><a id=\"loader\" href=\"javascript:loaderClose();\">Sluiten</a></div><div class=\"largeImage\"><a href=\"javascript:loaderClose();\" class=\"imageClose\"><img src=\"http://laiterieke.909.be/images/site/" + photo + "\" width=\"" + width +"\" height=\"" + height +"\" alt=\""+ photo + "\" id=\"largeImage\" /></a></div></div><div class=\"clearer\"></div>";
i.style.display='block';
i.style.zIndex=1000;
i.style.position ="absolute";



}



/*************************
* POPUP JAVASCRIPT PAGINA
**************************/
function showPage(page,width,height) {
var wrapWidth = width ;
var wrapHeight= height;

var scroll_array= getScrollXY();
var size_array=alertSize();

myleft=(screen.width)?(size_array[0]-wrapWidth)/2:100;
myleft+=scroll_array[0];

myTop =(screen.height)?(size_array[1]-wrapHeight)/2:100;
myTop+=scroll_array[1];

var i = document.getElementById('imageBlock');
i.style.left=myleft+"px";
i.style.top= myTop+"px";
//var loader = document.getElementById('loader');
//loader.style.display='inline';
i.innerHTML = "<div id=\"PopUpwrapper\" style=\"width:" + wrapWidth + "px;height:" + wrapHeight + "px;padding:10px 0 0 5px; \"><div id=\"closePage\" ><a id=\"loader\" href=\"javascript:loaderClose();\">Sluiten</a></div><iframe frameborder=\"0\" border=\"0\" cellspacing=\"0\" scrolling=\"no\" marginwidth=\"0\" marginheight=\"0\" width=\"980\"  height=\"600\" src=\""+ page +"\"</div>";
i.style.display='block';
i.style.zIndex=1000;
i.style.position ="absolute";

} 




function loaderClose() {
//var loader = document.getElementById('loader');
//loader.innerHTML = "";
//loader.style.display='none';
var p = document.getElementById('imageBlock');
p.style.display='none';
var c = document.getElementById('caption-adv');
c.height='30px';

}
//new Rico.Effect.FadeTo(element, opacity, duration, steps, options)

/**************************************
***************************************
* universele functie to get positions
***************************************
***************************************/

function getScrollXY() {
  var scrOfX = 0, scrOfY = 0;
  if( typeof( window.pageYOffset ) == 'number' ) {
    //Netscape compliant
    scrOfY = window.pageYOffset;
    scrOfX = window.pageXOffset;
  } else if( document.body && ( document.body.scrollLeft || document.body.scrollTop ) ) {
    //DOM compliant
    scrOfY = document.body.scrollTop;
    scrOfX = document.body.scrollLeft;
  } else if( document.documentElement && ( document.documentElement.scrollLeft || document.documentElement.scrollTop ) ) {
    //IE6 standards compliant mode
    scrOfY = document.documentElement.scrollTop;
    scrOfX = document.documentElement.scrollLeft;
  }
  return [ scrOfX, scrOfY ];
}




/****************************************
*****************************************
* universele functie to get window size
*****************************************
*****************************************/

function alertSize() {
  var myWidth = 0, myHeight = 0;
  if( typeof( window.innerWidth ) == 'number' ) {
    //Non-IE
    myWidth = window.innerWidth;
    myHeight = window.innerHeight;
  } else if( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
    //IE 6+ in 'standards compliant mode'
    myWidth = document.documentElement.clientWidth;
    myHeight = document.documentElement.clientHeight;
  } else if( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
    //IE 4 compatible
    myWidth = document.body.clientWidth;
    myHeight = document.body.clientHeight;
  }
 return[ myWidth , myHeight];

}

