


<!--
/* ============= CORE ======================================================================= */
// global variables for browser sniffing (ie only)
var ie = (document.all && document.getElementById) ? true:false;
var ie6 = navigator.appVersion.indexOf("MSIE 6")!=-1 ? true:false;

// Adds events to elements of the DOM
var addEvent = function (obj,evt,fn) {
   if (obj.addEventListener)
      obj.addEventListener(evt,fn,false);
   else if (obj.attachEvent)
      obj.attachEvent('on'+evt,fn);
}
// Removes events from elements of the DOM
var removeEvent = function (obj,evt,fn) {
   if (obj.removeEventListener)
      obj.removeEventListener(evt,fn,false);
   else if (obj.detachEvent)
      obj.detachEvent('on'+evt,fn);
}

// Debugging and prevent from memory leaking:

// These variables are used for debugging - do not change
var debug = false; 
var allowAlert = true;

var eventCache = function(){
   try {
      var listEvents = [];
      
      /*  Implement array.push for browsers which don't support it natively. (used in EventCache)
      Please remove this if it's already in other code */
      if(Array.prototype.push == null){
         Array.prototype.push = function(){
            for(var i = 0; i < arguments.length; i++){
               this[this.length] = arguments[i];
               };
              return this.length;
         };
      };
        
       return {
         listEvents : listEvents,
        
         // Keeping track of all the attached events
         add :    function(node, sEventName, fHandler, bCapture){
                  listEvents.push(arguments); 
               },
        
         // Used to remove (detach) all cached events
         flush :  function(){
               var i, item;
               for(i = listEvents.length - 1; i >= 0; i = i - 1){
                  item = listEvents[i];
                     removeEvent(item[0], item[1], item[2])
                       
                  item[0][item[1]] = null;
               };
         }
         };
   } catch (ex){ errHandler(ex); }  
}();

// Displays alert with error message, if alert is allowed (not cancelled in confirm) and Lib.debug = true
var debugAlert = function (message) {
      if(allowAlert && debug) { allowAlert = confirm(message); }
   }

// Handles errors in javascript application
var errHandler = function (err) {
      var errorText = "";
      for (var i in err) { errorText += i + "=" + err[i] + "\n"; }
      debugAlert("An error has occured: \n\n" + errorText + "\nSee Firefox browser for correct linenumbers.");          
      return true;   
   }  
/* ========== END CORE ====================================================================== */
   
/* ========== GENERAL FUNCTIONS ============================================================= */
//===================== General Function: function to add a stylesheet:
var addStyleSheet = function (relPath) {
   if(document.getElementsByTagName("head"))
   {
      var head = document.getElementsByTagName("head")[0]; 
      var newStyle = document.createElement("link");
         newStyle.setAttribute("type", "text/css");
      newStyle.setAttribute("rel", "stylesheet"); 
      newStyle.setAttribute("href", relPath); 
      head.appendChild(newStyle);
   }
} 
//===================== General Function: function to search for elements with specific classnames - returns an array:
var getElementsByClassName = function (searchClass, tagName, containerElement) {
   tagName = tagName || "*";
   containerElement = containerElement || document;
   
   var allElements = containerElement.getElementsByTagName(tagName);
   if (!allElements.length &&  tagName == "*" &&  containerElement.all) allElements = containerElement.all;
   
   var elementsFound = new Array();
   var delim = searchClass.indexOf("|") != -1  ? '|' : " ";
   
   var arrClass = searchClass.split(delim);
   for (var i = 0, j = allElements.length; i < j; i++) {
      var arrObjClass = allElements[i].className.split(" ");
      if (delim == " " && arrClass.length > arrObjClass.length) { continue; }
      var c = 0;
      comparisonLoop:
         for (var k = 0, l = arrObjClass.length; k < l; k++) {
            for (var m = 0, n = arrClass.length; m < n; m++) {
               if (arrClass[m] == arrObjClass[k]) c++;
               if (( delim == "|" && c == 1) || (delim == " " && c == arrClass.length)) {
                  elementsFound.push(allElements[i]);
               break comparisonLoop;
            }
         }
      }
   }
   return elementsFound;
}
//===================== General Function: function to change a class:
var changeClass = function(obj,oldClass, newClass) {
   obj.className = obj.className.replace(oldClass,newClass);
}
//===================== General Function: find position of element relative to window:
var findElementPosition = function(obj){
   var curleft = curtop = 0;
      if (obj.offsetParent) {
         curleft = obj.offsetLeft
         curtop = obj.offsetTop
         while (obj = obj.offsetParent) {
            curleft += obj.offsetLeft
            curtop += obj.offsetTop
         }
      }
   return [curleft,curtop];
}
//===================== General Function: Gets next element in DOM tree; while ignoring text nodes
var getNextElement = function ( elem ) {
    do { elem = elem.nextSibling; } 
   while ( elem && elem.nodeType != 1 );
    return elem;
}
//===================== General Function: Gets previous element in DOM tree; while ignoring text nodes
var getPreviousElement = function ( elem ) {
   do { elem = elem.previousSibling; }
   while ( elem && elem.nodeType != 1 );
   return elem;
}
/* ========= END GENERAL FUNCTIONS ========================================================== */

/* ========== SPECIFIC FUNCTIONS ========================================================== */
//====================== Functions that are triggered onload are collectyed in the init() function:
var init = function(){
   setPageIsStyled();
   addResizingLinks();
   addSubmitHover();
   if(document.getElementById("dropdownmenu")) addNavFunctionality();
   if(document.getElementById("navigation-blocks")) addHomeBlocksHover();
   if(getElementsByClassName("zelfbouwgallerij","div",document.getElementById("page-content")).length>0) addSelfBuildHovers();
   addBannerHover();
   addDefaultItemHover();
   
   addPrintLink();
   addPopupLinks();
}
//======================

//====================== Add rollover functionality to submit buttons:
var addSubmitHover = function(){
   var allInputs = document.getElementsByTagName("body")[0].getElementsByTagName("input");
   for(var i=0; i<allInputs.length; i++){
      if(!(allInputs[i].type == "submit")) continue;
      allInputs[i].className += " idle";
      allInputs[i].onmouseover = function(){
         this.className = this.className.replace("idle", "hover");
      }     
      eventCache.add(allInputs[i], "onmouseover", function() { this.className += " hover"; }, false);    
      allInputs[i].onmouseout = function(){
         this.className = this.className.replace("hover", "idle");
      }
      eventCache.add(allInputs[i], "onmouseout", function() { this.className = this.className.replace(" hover", ""); }, false);  
   }
}
//====================== Add rollover functionality to block on Homepage:
var addHomeBlocksHover = function(){
   var homeBlocks = getElementsByClassName("blocks","div",document.getElementById("navigation-blocks"));
   for(var i=0; i<homeBlocks.length; i++){
      homeBlocks[i].className += " idle";
      homeBlocks[i].onfocus = homeBlocks[i].onmouseover = function(){
         this.className = this.className.replace("idle","ro");
      }
      eventCache.add(homeBlocks[i], "onfocus", function() { this.className = this.className.replace("idle","ro"); }, false);  
      eventCache.add(homeBlocks[i], "onmouseover", function() { this.className = this.className.replace("idle","ro"); }, false);    
      
      homeBlocks[i].onblur = homeBlocks[i].onmouseout = function(){
         this.className = this.className.replace("ro","idle");
      }
      eventCache.add(homeBlocks[i], "onblur", function() { this.className = this.className.replace("ro","idle"); }, false);   
      eventCache.add(homeBlocks[i], "onmouseout", function() { this.className = this.className.replace("ro","idle"); }, false);  
   }
}
//====================== Add rollover functionality to default-items with read more link:
var addDefaultItemHover = function(){
   var defArr = new Array;
   var defaultItems = getElementsByClassName("default-item","div");
   for(var j=0; j<defaultItems.length; j++) {
      var readMoreLinks = getElementsByClassName("link-read-more","a",defaultItems[j]);
      if(readMoreLinks[0]) {
         this.link = readMoreLinks[0];
         defArr[defArr.length] = new Default(this, defaultItems[j], this.link);
      }
   }
}
function Default(addDefaultItemHover, item, link) {
   this.addDefaultItemHover = addDefaultItemHover;
   this.item = item;
   this.link = link;
   this.item.style.cursor = "pointer";
   this.item.Default = this;
   this.item.onclick = function() {
      this.Default.clickIt();
   }
   this.item.onmouseover = function() {
      this.Default.rollOver();
   }
   this.item.onmouseout = function() {
      this.Default.rollOut();
   }
}
Default.prototype.clickIt = function() {
      document.location = this.link.href;
      return false;
}
Default.prototype.rollOver = function() {
      this.link.className += " hover";
}
Default.prototype.rollOut = function() {
      this.link.className = this.link.className.replace(" hover","");
}

//====================== Navigation functionality:
var currentTimeOut; // global variable makes it possible to clearTimeout from any point;
var iframe; //

// add dropdown functionality to the main menu:
var addNavFunctionality = function(){
   var navElements = new Array(document.getElementById("navigation"),document.getElementById("dropdownmenu"));
   document.getElementById("dropdownmenu").className += " hide";
   for(var i=0; i<navElements.length; i++){
      if(navElements[i]){
         navElements[i].onmouseover = function(){
            clearTimeout(currentTimeOut);
            currentTimeOut = setTimeout('toggleNav(true);', 150);
         }
         eventCache.add(navElements[i], "onmouseover", function() { clearTimeout(currentTimeOut); currentTimeOut = setTimeout('toggleNav(true);', 200); }, false);   
         
         navElements[i].onmouseout = function(){
            clearTimeout(currentTimeOut);
            currentTimeOut = setTimeout('toggleNav(false);', 500);
         }
         eventCache.add(navElements[i], "onmouseout", function() { clearTimeout(currentTimeOut); currentTimeOut = setTimeout('toggleNav(false);', 500); }, false);            
      }
   }
   // for acces with keyboard:
   var mainMenuItems = document.getElementById("navigation").getElementsByTagName("a");
   for(var n=0; n<mainMenuItems.length; n++){
      mainMenuItems[n].onfocus = function(){
         toggleNav(true);
      }
      eventCache.add(mainMenuItems[n], "onfocus", function() { toggleNav(true); }, false);   
         
   }
   var subMenuItems = document.getElementById("dropdownmenu").getElementsByTagName("a");
   subMenuItems[subMenuItems.length-1].onblur = function(){
      toggleNav(false);
   }
   eventCache.add(subMenuItems[subMenuItems.length-1], "onblur", function() { toggleNav(false); }, false);
}

// Navigation dropdown functionality:
var toggleNav = function(status){
   var dropdownmenu = document.getElementById("dropdownmenu");
   if(status){
      changeClass(document.getElementById("dropdownmenu"),"hide","show");
      if(ie6) { adjustIFrame(dropdownmenu, "on"); }      
   } else {
      changeClass(document.getElementById("dropdownmenu"),"show","hide");
      if(ie6) { adjustIFrame(dropdownmenu, "off"); }  
   }  
}

// (IE6 only) Iframe is et behind menu to avoid <select>'s from bleeding through:
var adjustIFrame = function (mainNavigationDiv, status) {
   if(status=="on") {
      if(!iframe) {
         iframe = document.createElement("iframe");
         iframe.id = "iFrameMainNav";
         mainNavigationDiv.parentNode.insertBefore(iframe, mainNavigationDiv);
      }
      iframe.style.height=(mainNavigationDiv.offsetHeight) + "px";   
      iframe.style.display="block";    
   }
   else {
      if(document.getElementById("iFrameMainNav") != undefined) { 
   		 document.getElementById("iFrameMainNav").style.display="none";
   	  }  
   }      
}
//====================== Popup/rollover functionality for "zelfbouw galerij":
var currentHover;
var addSelfBuildHovers = function(){
   var popups = getElementsByClassName("popup-info","div",document.getElementById("page-content"));
   
   if(!document.getElementById("selfBuildPopUpDiv")){
      var sfDiv = document.createElement("div");
      sfDiv.id = "selfBuildPopUpDiv";
      document.getElementsByTagName("body")[0].appendChild(sfDiv);
      var sfSubDiv = document.createElement("div");
      sfDiv.appendChild(sfSubDiv);
      var sfTextDiv = document.createTextNode("...");
      sfSubDiv.appendChild(sfTextDiv);
            
      var rollOverDiv = document.createElement("div");
      rollOverDiv.id = "popUpHoverDiv";
      document.getElementsByTagName("body")[0].appendChild(rollOverDiv);            
   }
   
   var returnPopUpLink = function(elem){
      var isPopUpLink = false;
      var currentLink;
      while (elem && !isPopUpLink) {
         elem = getPreviousElement(elem);
         if(elem.className.indexOf("popup-link")>=0){
            isPopUpLink = true;
            currentLink = elem;
         }
      }
       return currentLink;
   }
   
   var hoverAction = function(ref){
      document.getElementById("selfBuildPopUpDiv").childNodes[0].childNodes[0].nodeValue = ref.popUpDiv.childNodes[0].nodeValue;
      var positions = findElementPosition(ref);
      document.getElementById("selfBuildPopUpDiv").style.left = (positions[0]+(ref.offsetWidth/2)) + "px";
      document.getElementById("selfBuildPopUpDiv").style.top = (positions[1]-(ref.offsetHeight/2)) + "px";
      document.getElementById("popUpHoverDiv").style.left = (document.getElementById("selfBuildPopUpDiv").offsetLeft-4)+"px";
      document.getElementById("popUpHoverDiv").style.top = (document.getElementById("selfBuildPopUpDiv").offsetTop-4)+"px";
      document.getElementById("popUpHoverDiv").style.height = (document.getElementById("selfBuildPopUpDiv").offsetHeight+4)+"px";
      document.getElementById("popUpHoverDiv").style.width = (document.getElementById("selfBuildPopUpDiv").offsetWidth+4)+"px";
      ref.className = ref.className.replace("idle","hover");
      currentHover = ref;
   }
   var hideAction = function(ref){
      document.getElementById("selfBuildPopUpDiv").style.left = "-999em";
      document.getElementById("popUpHoverDiv").style.left = "-999em";
      ref.className = ref.className.replace("hover","idle");
   }
   
   for(var i=0; i<popups.length; i++){
      var popUpLink = returnPopUpLink(popups[i]);     
      popUpLink.popUpDiv = popups[i];
      popUpLink.className += " idle";
         
      popUpLink.onfocus = popUpLink.onmouseover = function(){
         hoverAction(this);
      }
      eventCache.add(popUpLink, "onfocus", function() { hoverAction(this); }, false);
      eventCache.add(popUpLink, "onmouseover", function() { hoverAction(this); }, false);
      
      popUpLink.onblur = popUpLink.onmouseout = function(){
         hideAction(this);
      }
      eventCache.add(popUpLink, "onblur", function() { hideAction(); }, false);
      eventCache.add(popUpLink, "onmouseout", function() { hideAction(); }, false);    
      
      document.getElementById("popUpHoverDiv").onmouseover = function(){
         hoverAction(currentHover);
      }
      eventCache.add(document.getElementById("popUpHoverDiv"), "onmouseover", function() { hoverAction(currentHover); }, false);
      
      document.getElementById("popUpHoverDiv").onmouseout = function(){
         hideAction(currentHover);
      }
      eventCache.add(document.getElementById("popUpHoverDiv"), "onmouseout", function() { hideAction(); }, false);
   }
}
//====================== Add rollover functionality to banners:
var addBannerHover = function(){
   var bannerLinks = getElementsByClassName("imagebanner","a",document.getElementById("page-content"));
   for(var i=0; i<bannerLinks.length; i++){
      bannerLinks[i].myImg = bannerLinks[i].getElementsByTagName("img")[0];
      bannerLinks[i].onfocus = bannerLinks[i].onmouseover = function(){
         this.myImg.src = this.myImg.src.replace(".gif","-ro.gif");
      }
      eventCache.add(bannerLinks[i], "onfocus", function() { this.myImg.src = this.myImg.src.replace(".gif","-ro.gif"); }, false);  
      eventCache.add(bannerLinks[i], "onmouseover", function() { this.myImg.src = this.myImg.src.replace(".gif","-ro.gif"); }, false);    
      
      bannerLinks[i].onblur = bannerLinks[i].onmouseout = function(){
         this.myImg.src = this.myImg.src.replace("-ro.gif",".gif");
      }
      eventCache.add(bannerLinks[i], "onblur", function() { this.myImg.src = this.myImg.src.replace("-ro.gif",".gif"); }, false);   
      eventCache.add(bannerLinks[i], "onmouseout", function() { this.myImg.src = this.myImg.src.replace("-ro.gif",".gif"); }, false);  
   }
}

/* Sets a cookie */
setCookie = function (name, value) {
   var argv = setCookie.arguments;  
   var argc = setCookie.arguments.length;
   var expires = (argc > 2) ? argv[2] : null;  
   var path = (argc > 3) ? argv[3] : null;  
   var domain = (argc > 4) ? argv[4] : null;  
   var secure = (argc > 5) ? argv[5] : false;  
   document.cookie = name + "=" + escape (value) + 
   ((expires == null) ? "" : ("; expires=" + expires.toGMTString())) + 
   "; path=/" +  
   ((domain == null) ? "" : ("; domain=" + domain)) +    
   ((secure == true) ? "; secure" : "");
}

/* Gets the value of a cookie */
getCookie = function (name) {
   var start = document.cookie.indexOf(name+"="); 
   var len = start+name.length+1; 
   if ((!start) && (name != document.cookie.substring(0,name.length))) { return  null; }
   if (start == -1){ return null; }
   
   var end = document.cookie.indexOf(";",len); 
   
   if (end == -1) { end = document.cookie.length; } 
   return unescape(document.cookie.substring(len,end)); 
}

   
/* Sets variable pageIsStyled to true when the form inside HTML element 'utilities' is more than 100 px from the left.
  If the page is not styled, the stylesheet jsenabled.css is removed */
setPageIsStyled = function () {
   if(elementsExists("utilities")) {
   var utilElems = document.getElementById("utilities").getElementsByTagName("form");
      if(parseInt(utilElems[0].offsetLeft) >100) { pageIsStyled = true; }
   }  
   if(!pageIsStyled) { removeStyleSheet ("jsenabled.css"); }
}

/* Checks if all the elements with the id specified in the arguments of this function exist;
   returns true if they do exist;
   false if one or more do not exist */
elementsExists = function () {
   var result = true;
   for(var i=0; i< arguments.length; i++) {
      if(!document.getElementById(arguments[i])) result=false;
   }
   return result;
}

/* Adds stylesheet to the document */
addStyleSheet = function (relPath) {
   if(document.getElementsByTagName("head"))
   {
      var head = document.getElementsByTagName("head")[0]; 
      var newStyle = document.createElement("link");
         newStyle.setAttribute("type", "text/css");
      newStyle.setAttribute("rel", "stylesheet"); 
      newStyle.setAttribute("href", relPath); 
      head.appendChild(newStyle);
   }
} 

/* Removes (or disables) stylesheet in document  */
removeStyleSheet = function (stylesheetFileName) {
   if(document.getElementsByTagName("head"))
   {
      var head = document.getElementsByTagName("head")[0]; 
      var linkElements = head.getElementsByTagName("link");
      
      for(var i=0; i<linkElements.length; i++) {
         
         var href = linkElements[i].getAttribute("href");
         if( href.indexOf(stylesheetFileName) != -1) {  
            linkElements[i].disabled=true; 
            head.removeChild(linkElements[i]); 
         }        
      }     
   }  
} 

/* Add increase/decrease font size links */
addResizingLinks = function() {
   if(!pageIsStyled) {  return;  } //stop if page is not styled
   
   try {
      var utilities = document.getElementById("utilities");
       
      //get form for insert
      var form = utilities.getElementsByTagName("form");
      
      //make new div with id font-size;
      var divFontSize = document.createElement("div");
      divFontSize.id = "font-size";
      
      //add text
      var strong = document.createElement("strong");
      strong.className = "text-only";  
      strong.appendChild(document.createTextNode("Tekstgrootte"));
      divFontSize.appendChild(strong);
      
      var ul = document.createElement("ul");
      
      var firstLi = document.createElement("li");
      firstLi.id = "larger-font";
      var largerLink = document.createElement("a");
      largerLink.href="#";
      largerLink.id="larger-link";
      largerLink.appendChild(document.createTextNode("Groter"));
      firstLi.appendChild(largerLink);
      ul.appendChild(firstLi);
         
      var secondeLi = document.createElement("li");
      secondeLi.id = "smaller-font";
      var smallerLink = document.createElement("a");
      smallerLink.href="#";
      smallerLink.id="smaller-link";
      smallerLink.appendChild(document.createTextNode("Kleiner"));
      secondeLi.appendChild(smallerLink);
      ul.appendChild(secondeLi);
      largerLink.onclick = function() { changeFontSize("larger"); return false; };
      eventCache.add(largerLink, "onclick", function() { changeFontSize("larger"); return false; }, false );
      
      smallerLink.onclick = function() { changeFontSize("smaller"); return false; };
      eventCache.add(smallerLink, "onclick", function() { changeFontSize("smaller"); return false; }, false );
      
      if(getCookie("fontsize")) {
         if(getCookie("fontsize") == "scalingLargest") { largerLink.className = "disabled";  }
         if(getCookie("fontsize") == "scalingNormal") { smallerLink.className = "disabled";  }
      }
      else { smallerLink.className = "disabled"; }
      
      divFontSize.appendChild(ul);
               
      utilities.appendChild(divFontSize);
      
      /* Set font-size and updates font size links (enabled/disabled) according to status */
      var changeFontSize = function (status) {
         //get cookie value
         var cookieValue = "";
         if(getCookie("fontsize")) {
            cookieValue = getCookie("fontsize");
         }
         
         //reset links
         var largerLink = document.getElementById("larger-link")
         largerLink.className = "";
         
         var smallerLink = document.getElementById("smaller-link")
         smallerLink.className = "";
         
         if(status=="larger") {     
            if(cookieValue.length == 0) { setFontSize("scalingLarge", true); }
            else if (cookieValue == "scalingNormal") { setFontSize("scalingLarge", true); }
            else if (cookieValue == "scalingLarge") {  largerLink.className = "disabled"; setFontSize("scalingLargest", true); }
            else if (cookieValue == "scalingLargest") { largerLink.className = "disabled"; }
         }
         else if(status=="smaller") {
            if (cookieValue == "scalingLargest") {  setFontSize("scalingLarge", true); }
            else if (cookieValue == "scalingLarge") {  smallerLink.className = "disabled"; setFontSize("scalingNormal", true); }
            else if (cookieValue == "scalingNormal") { smallerLink.className = "disabled"; }
         }
      };
      
   } catch (ex){ errHandler(ex); }  
}  

/* Set font size by adding and removing stylesheets */
setFontSize = function (status, removeStyleSheets) {
   if(removeStyleSheets) {
      //reset
      removeStyleSheet ("normal-font.css");
      removeStyleSheet ("large-font.css");
      removeStyleSheet ("largest-font.css");
   }
   
   if(status=="scalingNormal") { addStyleSheet("/css/normal-font.css");  }
   else if(status=="scalingLarge") { addStyleSheet("/css/large-font.css"); }
   else if(status=="scalingLargest") { addStyleSheet("/css/largest-font.css"); }
   
   setCookie("fontsize", status)
}

/* ===== END SPECIFIC FUNCTIONS ============================================================= */

/* ========= FUNCTION CALLS ================================================================= */

/* Set font size at initailisation of page */
if(getCookie("fontsize")) { setFontSize(getCookie("fontsize"), false);};

//====================== Load stylesheet when javascript is enabled:
addStyleSheet("/css/jsenabled.css");  

//====================== Call functions at Onload-event:
addEvent(window, "load", init);

// ====================== Calling addEvent: Add Lib.eventCache.flush as eventhandler on window onunload: Detach all attached events (solves memory leak in ie):
addEvent(window, "unload", eventCache.flush);

/* ====== END FUNCTION CALLS ================================================================ */


function addPrintLink() {
	if(document.getElementById("printlink") != undefined) {
		document.getElementById("printlink").onclick = function() {
			window.print(); 
			return false;
		}
	}
}

function getElementsByStyleClass (className) {
  var all = document.all ? document.all :
    document.getElementsByTagName('*');
  var elements = new Array();
  for (var e = 0; e < all.length; e++)
    if (all[e].className == className)
      elements[elements.length] = all[e];
  return elements;
}


function addPopupLinks() {
	var elements = getElementsByStyleClass("popuplink");
	for(var count = 0; count < elements.length; count++) {
		elements[count].onclick = function() {
			window.open(this.href);
			return false;
		}
	}
}
//-->