function registerCoulisseImg(imgId, src) {
  var img = new Image();

  img.onload  = function()  {
    var targetImg = document.getElementById( this.id );
    targetImg.width = this.width;
    targetImg.height  = this.height;
    targetImg.parentNode.style.width  = this.width  + "px";
    targetImg.parentNode.style.height = this.height + "px";
    targetImg.src = this.src;
  };
  img.id = imgId;
  if (src) img.src = src; else {
    var imgEl = document.getElementById( imgId );
    if (imgEl) img.src=imgEl.src;

  }

}


/*
Elmer, 2004-11-12:
deze moet in alle onload events van alle plaatjes in de
coulisse aangeroepen worden (bijv. in de homepage)
*/
function fixCoulisseImage(	img	)	{
  img.parentNode.style.width  = img.width  + "px";
  img.parentNode.style.height = img.height + "px";
	}


//////////////////////////////////////////////////

function getPageLeft( element ) {
  var pageLeft  = 0;
  if( element ) {
    pageLeft  = element.offsetLeft;
    pageLeft  +=  getPageLeft(  element.offsetParent  );
    }
  return pageLeft;
  }

function getPageTop(  element ) {
  var pageTop = 0;
  if( element ) {
    pageTop = element.offsetTop;
    pageTop +=  getPageTop( element.offsetParent  );
    }
  return pageTop;
  }

allCoulisseControls = new Array()
with( CoulisseControl = function()  {
  this.toString = new Function( "return 'allCoulisseControls["  + allCoulisseControls.length  + "]';" );
  allCoulisseControls[  allCoulisseControls.length  ] = this;

  this.elementId  = arguments[  0 ];
   this.element = null;
  this.itemElements = new Array();
  this.itemClassName  = "Item";
  this.innerClassName = "Inner";
  this.activeItemElement  = null;

  this.brake  = 10;
  this.inactiveItemWidth  = 40;
  this.inactiveItemHeight = null;
  this.totalWidth = null;

  this.mouseX = null;
   this.mouseY  = null;

  this.expandRight  = true;

  this.offset = 0;
  
  this.isMoving	=	false;
  } ) {

  prototype.setItemClassName  = function()  {this.itemClassName = arguments[  0 ];}
  prototype.getItemClassName  = function()  {return this.itemClassName;}

  prototype.setInnerClassName = function()  {this.innerClassName  = arguments[  0 ];}
  prototype.getInnerClassName = function()  {return this.innerClassName;}

  prototype.setActiveItemElement  = function()  {this.activeItemElement = arguments[  0 ];}
  prototype.getActiveItemElement  = function()  {return this.activeItemElement;}

  prototype.setBrake  = function()  {this.brake = arguments[  0 ];}
  prototype.getBrake  = function()  {return this.brake;}

  prototype.setInactiveItemWidth  = function()  {this.inactiveItemWidth = arguments[  0 ];}
  prototype.getInactiveItemWidth  = function()  {return this.inactiveItemWidth;}

  prototype.setTotalWidth = function()  {this.totalWidth  = arguments[  0 ];}
  prototype.getTotalWidth = function()  {return this.totalWidth;}

  prototype.setInactiveItemHeight = function()  {this.inactiveItemHeight  = arguments[  0 ];}
  prototype.getInactiveItemHeight = function()  {return this.inactiveItemHeight;}

  prototype.setExpandRight  = function()  {this.expandRight = arguments[  0 ];}
  prototype.getExpandRight  = function()  {return this.expandRight;}

  prototype.start = function()  {
    this.element  = document.getElementById(  this.elementId  );
    if( !this.element ) {
      return false;
      }
    var maxHeight = 0;
    with( this.element  ) {
      for(  var c = 0;  c < childNodes.length;  c ++  ) {
        var itemElement = childNodes[ c ];
        if( itemElement.className ==  this.itemClassName  ) {
          for(  var c1  = 0;  c1  < itemElement.childNodes.length;  c1  ++  ) {
            var innerElement  = itemElement.childNodes[ c1  ];
            if( innerElement.className  ==  this.innerClassName ) {
              if( !innerElement.style.left
                ||  !innerElement.style.top
                ||  !innerElement.style.width
                ||  !innerElement.style.height
                ) {
                //status="not fnd:"+outerHTML;

                innerElement.originalLeft = parseInt( innerElement.style.left );
                innerElement.originalTop  = parseInt( innerElement.style.top  );
                innerElement.originalWidth  = 1;
                innerElement.originalHeight = 1;

                itemElement.innerElement  = innerElement;
                //return false;
              } else {
                innerElement.originalLeft = parseInt( innerElement.style.left );
                innerElement.originalTop  = parseInt( innerElement.style.top  );
                innerElement.originalWidth  = parseInt( innerElement.style.width  );
                innerElement.originalHeight = parseInt( innerElement.style.height );

                itemElement.innerElement  = innerElement;

                maxHeight = Math.max( maxHeight,  innerElement.originalHeight );
                }
              }
            }

            if (itemElement) {
              itemElement.currentWidth  = this.inactiveItemWidth;

              this.itemElements[  this.itemElements.length  ] = itemElement;
            }
          }
        }

      if( this.totalWidth ) {
        style.overflow  = "hidden";
        style.width = this.totalWidth + "px";
        style.height  = maxHeight + "px";
        }
      this.update();
      style.visibility = "visible";
      style.display = "block";
      }
    return true;
    }




  prototype.step  = function()  {
    if( !this.element ) {
      this.start();
      return false;
      }

		var totalSizeSpeed	=	0;
    for(  var c = 0;  c < this.itemElements.length; c ++  ) {
      var itemElement = this.itemElements[  c ];
      var itemElementWidth  = this.inactiveItemWidth;

      if( itemElement ==  this.activeItemElement  ) {
        itemElementWidth  = itemElement.innerElement.originalWidth;
        }

      var sizeSpeed = ( itemElementWidth  - itemElement.currentWidth  ) / this.brake;
      sizeSpeed = ( sizeSpeed < 0 ) ? Math.floor( sizeSpeed ) : Math.ceil(  sizeSpeed );
      itemElement.currentWidth  = ( itemElement.currentWidth  + sizeSpeed );

			totalSizeSpeed	+=	Math.abs(	sizeSpeed	);
      }

    if( this.totalWidth ) {
      var currentTotalWidth = 0;
      var activeItemOffset  = 0;
      for(  var c = 0;  c < this.itemElements.length; c ++  ) {
        var itemElement = this.itemElements[  c ];
        if( itemElement ==  this.activeItemElement  ) {
          activeItemOffset  = currentTotalWidth - parseInt( ( this.totalWidth - this.activeItemElement.currentWidth ) / 2 );

          var offsetSpeed = ( activeItemOffset  - this.offset ) / this.brake;
          offsetSpeed = ( offsetSpeed < 0 ) ? Math.floor( offsetSpeed ) : Math.ceil(  offsetSpeed );
          this.offset = ( this.offset + offsetSpeed );

          }

        currentTotalWidth +=  itemElement.currentWidth;
        }


      d = this.totalWidth - currentTotalWidth;
      if( d > 0 ) {
        wd  = parseInt( d / this.itemElements.length  );
        wdm = d % this.itemElements.length;
        currentTotalWidth = 0;
        for(  var c = 0;  c < this.itemElements.length; c ++  ) {
          var itemElement = this.itemElements[  c ];
          itemElement.currentWidth  +=  wd;
          if( c < wdm ) {
            itemElement.currentWidth  ++;
            }
          currentTotalWidth +=  itemElement.currentWidth;
          }
        }

      this.offset = Math.min( Math.max( this.offset,  0 ),  currentTotalWidth - this.totalWidth );
      }
    else  {
      this.offset = 0;
      }

		if(	totalSizeSpeed	<	10	&&	this.isMoving	==	true	)	{
			this.isMoving	=	false;
			if(	this.onMoveStop	)this.onMoveStop();
    	}
		else if(	totalSizeSpeed	>=	10	&&	this.isMoving	==	false	)	{
			this.isMoving	=	true;
			if(	this.onMoveStart	)this.onMoveStart();
    	}

    this.update();

    return true;
    }


prototype.mouseout  = function()  {
    var out = true;
    if( arguments[  0 ] ) {
      this.mouseX = arguments[  0 ].pageX - getPageLeft(  this.element  );
      this.mouseY = arguments[  0 ].pageY - getPageTop( this.element  );
        }
    else if(  event ) {
      var element = event.toElement;

      while(  element ) {
        out &=  element !=  this.element;
        element = element.parentNode;
        }
        }

    if( out ) {
      this.mouseX = null;
      this.mouseY = null;
      this.setActiveItemElement();
      }
    }


  prototype.update  = function()  {
    var currentTotalWidth = 0;
    for(  var c = 0;  c < this.itemElements.length; c ++  ) {
      itemElement = this.itemElements[  c ];

      with( this.itemElements[  c ] ) {
        var p = currentTotalWidth;
        if( this.totalWidth ) {
          p -=  this.offset;
          }
        if( currentWidth  > 0 &&  ( !this.totalWidth  ||  p > 0 - itemElement.currentWidth  &&  p < this.totalWidth ) ) {
		      style.visibility = "visible";
          style.display = "block";
          if( this.expandRight  ) {
            style.left  = p + "px";
            }
          else  {
            style.right = p + "px";
            }
          style.width = currentWidth  + "px";

          var newLeft = parseInt( innerElement.originalLeft - innerElement.originalLeft * currentWidth  / innerElement.originalWidth  ) + "px";
          /*alert(newLeft);
          alert(innerElement.originalLeft);
          alert(innerElement.originalLeft);
          alert(currentWidth);
          alert(innerElement.originalWidth);
          */

          innerElement.style.left = newLeft;


          if( this.inactiveItemHeight ) {
            style.height  = this.inactiveItemHeight + parseInt( ( currentWidth  - this.inactiveItemWidth  ) * ( innerElement.originalHeight - this.inactiveItemHeight ) / ( innerElement.originalWidth  - this.inactiveItemWidth  ) ) + "px";
            }

          }
        else  {
          style.display = "none";
          }

        if( this.mouseX !== null  &&  this.mouseY !== null  &&  this.mouseX > itemElement.offsetLeft  &&  this.mouseX < itemElement.offsetLeft  + itemElement.offsetWidth ) {
          this.setActiveItemElement(  itemElement );
          }

        currentTotalWidth +=  currentWidth;
        }
      }

    }


  prototype.mousemove = function()  {
    this.mouseX = 0;
    this.mouseY = 0;
    if( arguments[  0 ] ) {
      this.mouseX = arguments[  0 ].pageX - getPageLeft(  this.element  );
      this.mouseY = arguments[  0 ].pageY - getPageTop( this.element  );
      }
    else if(  event ) {
      this.mouseX = getPageLeft(  event.srcElement  ) + event.offsetX - getPageLeft(  this.element  );
      this.mouseY = getPageTop( event.srcElement  ) + event.offsetY - getPageTop( this.element  );
      }

    }

  prototype.onMoveStart = function()  {
    }
  prototype.onMoveStop = function()  {
    }

  }
	
	//img fade
	function initImage(id) {
		imageId = id;
		image = document.getElementById(imageId);
			setOpacity(image, 10);
		image.style.display = "block";
			fadeIn(imageId,30);
	}
	function fadeIn(objId,opacity) {
	if (document.getElementById) {
		obj = document.getElementById(objId);
	if (opacity <= 100) {
		setOpacity(obj, opacity);
			opacity += 10;
			window.setTimeout("fadeIn('"+objId+"',"+opacity+")", 100);
			}
		}
	}
	function setOpacity(obj, opacity) {
		opacity = (opacity == 100)?99.999:opacity;
		// IE/Win
		obj.style.filter = "alpha(opacity:"+opacity+")";
		// Safari<1.2, Konqueror
		obj.style.KHTMLOpacity = opacity/100;
		// Older Mozilla and Firefox
		obj.style.MozOpacity = opacity/100;
		// Safari 1.2, newer Firefox and Mozilla, CSS3
		obj.style.opacity = opacity/100;
	}
	//window.onload = function() {initImage()}
	
  homeCoulisseControl = new CoulisseControl(  "homeCoulisse"  );
  homeCoulisseControl.setBrake( 10  );
  homeCoulisseControl.setInactiveItemWidth( 30  );
  homeCoulisseControl.setExpandRight( true );
  homeCoulisseControl.setTotalWidth(  900 );

	
homeCoulisseControl.onMoveStart	=	function()	{
	document.getElementById(	"img1_overlay"	).style.display	=	"none";
	document.getElementById(	"img2_overlay"	).style.display	=	"none";
	document.getElementById(	"img3_overlay"	).style.display	=	"none";
	document.getElementById(	"img4_overlay"	).style.display	=	"none";
	}
	
homeCoulisseControl.onMoveStop	=	function()	{
	switch (homeCoulisseControl.activeItemElement.id){
			case "home1": 
				//document.getElementById(	"img1_overlay"	).style.display	=	"none";
				setTimeout('initImage("img1_overlay")',1000); 
		break;
			case "home2": 
				//document.getElementById(	"img2_overlay"	).style.display	=	"none";
				setTimeout('initImage("img2_overlay")',1000); 
		break;
			case "home3": 
				//document.getElementById(	"img3_overlay"	).style.display	=	"none";
				setTimeout('initImage("img3_overlay")',1000); 
		break;
			case "home4": 
				//document.getElementById(	"img4_overlay"	).style.display	=	"none";
				setTimeout('initImage("img4_overlay")',1000); 
		break;
				//default : alert("I\'m sure it was great");
		}
	}

  menuCoulisseControl = new CoulisseControl(  "menuCoulisse"  );
  menuCoulisseControl.setBrake( 4 );
  menuCoulisseControl.setInactiveItemWidth( 30  );
  menuCoulisseControl.setExpandRight( false );

  rightCoulisseControl  = new CoulisseControl("rightCoulisse");
  rightCoulisseControl.setBrake(10);
  rightCoulisseControl.setInactiveItemWidth(30);
  rightCoulisseControl.setExpandRight(false);

  leftCoulisseControl = new CoulisseControl("leftCoulisse");
  leftCoulisseControl.setBrake(4);
  leftCoulisseControl.setInactiveItemWidth(80);
  leftCoulisseControl.setExpandRight(true);

  menuCoulisseAriaControl = new CoulisseControl("menuCoulisseAria");
  menuCoulisseAriaControl.setBrake(4);
  menuCoulisseAriaControl.setInactiveItemWidth(30);
  menuCoulisseAriaControl.setExpandRight(true);
  
  if (screen.width <= 800) {
    menuCoulisseCollectionControl = new CoulisseControl("menuCoulisseCollection");
    menuCoulisseCollectionControl.setBrake(4);
    menuCoulisseCollectionControl.setInactiveItemWidth(30);
    menuCoulisseCollectionControl.setExpandRight(true);
  }
  
  carousselCoulisseControl = new CoulisseControl("carousselCoulisse");
  carousselCoulisseControl.setBrake(10);
  carousselCoulisseControl.setInactiveItemWidth(40);
  carousselCoulisseControl.setInactiveItemHeight(60);
  carousselCoulisseControl.setTotalWidth(201);


function step() {
  homeCoulisseControl.step();
  menuCoulisseControl.step();
  rightCoulisseControl.step();
  leftCoulisseControl.step();
  menuCoulisseAriaControl.step();
  if (screen.width <= 800) menuCoulisseCollectionControl.step();
  carousselCoulisseControl.step();
}

function NavOut(){
	if (screen.width <= 800) menuCoulisseCollectionControl.setActiveItemElement();
}
function NavOver(id){
	if (screen.width <= 800) menuCoulisseCollectionControl.setActiveItemElement(id);
}