var menu, titles, submenus, arrows, topmenus, bypixels, opacity=0, FadeTimer, wait;
var SlideSpeed = 10
var heights    = new Array();

// Voor het menu
var FadeInSpeed=1
var See_through=85 // Maximale opacity

var n = navigator.userAgent;
bypixels = 1;
if     (/Opera/.test(n)  ) bypixels = 1; /*2;*/
else if(/Firefox/.test(n)) bypixels = 1; /*3;*/
else if(/MSIE/.test(n)   ) bypixels = 1; /*2;*/

function init(){
  var i
  menu     = getElementsByClassName("p4menu" , "div" , document)[0];
  titles   = getElementsByClassName("title"  , "span", menu);
  submenus = getElementsByClassName("submenu", "div" , menu);
  arrows   = getElementsByClassName("arrow"  , "img" , menu);
  topmenus = getElementsByClassName("l1"     , "a"   , menu);

  for(i=0; i<Math.max(titles.length, submenus.length); i++) {
      titles[i].onclick        = gomenu;
      arrows[i].onclick        = gomenu;
      heights[i]               = submenus[i].offsetHeight;
      submenus[i].style.height = submenus[i].offsetHeight+"px";
  }
//Add onclick event to l1 items:
  for(i=0; i<topmenus.length; i++) topmenus[i].onclick = hidemAll;

  contractall()
  wait=setTimeout("StartFade()", 10);
  RememberStuff()
  document.links[0].isSelected=true
  PaintButtons();
}
function StartFade(){
  FadeMenu()
}
function highlight(m){ m.className = 'title_hover' }
function lowlight (m){ m.className = m.isSelected ? 'title_sel' : 'title' }

function contractall(){
  var i
  if (typeof menu!="undefined"){
    for(i=0; i<Math.max(titles.length, submenus.length); i++){
//    titles[i].className="titlehidden"
      arrows[i].src = "collapsed.gif"
      submenus[i].style.display = "none"
      submenus[i].style.height  =  0
    }
  }
}

// Unselect all links
function ResetSelected(p_Level){
  var i
  for( i=0; i<document.links.length; i++ ){
    if(document.links[i].className.substr(1)==p_Level)  document.links[i].isSelected=false;
  }
  if( p_Level=="1" ){
    for(i in titles) titles[i].isSelected=false
  }
}

function hidemAll(){
  var i
  var level = this.className.substr(1)
  if (typeof menu!="undefined"){
    for(i in titles) hidemenu(i);
  }
  this.blur();
  ResetSelected(level);
  this.isSelected=true;
  PaintButtons();
}

  // Set background for all links
function PaintButtons(){
  var i
  var selBackColour,
      selForeColour;

  for( i=0; i<document.links.length; i++ ){
    switch (document.links[i].className){
        case "l1":
        case "h1":  selBackColour = "#8292B2"//"#FF0202"// l1_selected background-color
                    selForeColour = "#FFD700";// l1_selected color (was:document.links[i].style.color)
                    break;
        case "l2":
        case "h2":  selBackColour = "#8292B2"//"#687BA2"// l2_selected background-color
                    selForeColour = "#FEFF00";//"#FFF6BF"// l2_selected color (was:document.links[i].style.color)
                    break;
    }
    document.links[i].style.backgroundColor = document.links[i].isSelected ? selBackColour : document.links[i].oldBackgroundColor;
    document.links[i].style.color           = document.links[i].isSelected ? selForeColour : document.links[i].oldColor;
  }

  for( i=0; i<titles.length; i++ ){
    titles[i].className = titles[i].isSelected ? "title_sel" : "title"
  }
}

function RememberStuff(){
  var i
  for( i=0; i<document.links.length; i++ ){
    document.links[i].oldBackgroundColor = document.links[i].style.backgroundColor
    document.links[i].oldColor           = document.links[i].style.color
    if(document.links[i].className=="l2") document.links[i].onclick = SelectMe;
  }

  for( i=0; i<titles.length; i++ ){
    titles[i].oldBackgroundColor = "#3C4963"
    titles[i].oldColor           = "#FFD700"
  }
}

function gomenu(e) {
  var i
  if (!e) var e = window.event;
  var ce = (e.target) ? e.target : e.srcElement;
  var sm;
  var LogoPage

  LogoPage = ce.id=="" ? ce.parentElement.id : ce.id
  if(LogoPage!="") top.MidFrames.Midden.location=LogoPage

  for(i in titles) {
      if(titles[i] == ce || arrows[i] == ce)
        sm = i;
      else
        hidemenu(i);
  }
  if ((parseInt(submenus[sm].style.height) <= parseInt(heights[sm])-2)
   && (parseInt(submenus[sm].style.height) < 2)
     )
      showmenu(sm);

  ResetSelected("1");
  titles[sm].isSelected=true;

  PaintButtons();
}

function hidemenu(sm) {
  try{
    var nr = submenus[sm].getElementsByTagName("a").length*bypixels;

    arrows[sm].src = "collapsed.gif";
    submenus[sm].style.height = (parseInt(submenus[sm].style.height)-nr)+"px";
    var to = setTimeout("hidemenu("+sm+")", SlideSpeed);
    if(parseInt(submenus[sm].style.height) <= nr) {
        clearTimeout(to);
        submenus[sm].style.display = "none";
        submenus[sm].style.height = "0px";
//      titles[sm].className = "titlehidden";
    }
  }catch(e){}
}

function showmenu(sm) {
    var nr = submenus[sm].getElementsByTagName("a").length*bypixels;

    arrows[sm].src = "expanded.gif";
    submenus[sm].style.display = "";
    submenus[sm].style.height = (parseInt(submenus[sm].style.height)+nr)+"px";
    var to = setTimeout("showmenu("+sm+")", SlideSpeed);
    if(parseInt(submenus[sm].style.height) > (parseInt(heights[sm])-nr)) {
        clearTimeout(to);
        submenus[sm].style.height = heights[sm]+"px";
    }
}

function SelectMe(){
  this.blur();
  ResetSelected("2");
  this.isSelected=true;
  PaintButtons();
}

function getElementsByClassName(strClassName, strTagName, oElm){
  var i
  var arrElements = (strTagName == "*" && document.all)? document.all : oElm.getElementsByTagName(strTagName);
  var arrReturnElements = new Array();
  strClassName = strClassName.replace(/\-/g, "\\-");
  var oRegExp = new RegExp("(^|\\s)" + strClassName + "(\\s|$)");
  var oElement;
  for(i=0; i<arrElements.length; i++){
      oElement = arrElements[i];
      if(oRegExp.test(oElement.className)){
          arrReturnElements.push(oElement);
      }
  }
  return (arrReturnElements)
}

function FadeMenu(){
    opacity+=2
    if( opacity > See_through ) opacity = See_through;

    menu.style.opacity      = opacity/100
    menu.style.filter       = "alpha(opacity="+opacity+")"
    menu.style.MozOpacity   = opacity/100
    menu.style.KhtmlOpacity = opacity/100
    if( opacity < See_through ) FadeTimer = setTimeout("FadeMenu()", FadeInSpeed);
}
window.onload = init;