/* slidemenus */

var slidemenus = [];
var aniLen     = 250;
var hideDelay  = 1000;

function showmenu(mnu, func_dim) {
  for(var i=0; i<slidemenus.length; i++) {
    if(slidemenus[i] != mnu) 
      hidenow(i);
  }
  mnu.func_dim = func_dim;
 	if (mnu.hideTimer) window.clearTimeout(mnu.hideTimer)
  mnu.hideTimer = 0
  if (!mnu.open) startSlide(mnu, true);
}

function hidemenu(mnu) {
  if (mnu.hideTimer) window.clearTimeout(mnu.hideTimer)
	mnu.hideTimer = window.setTimeout("hidenow('" + mnu.menuId + "')", hideDelay);
}

function hidenow(i) {
  var mnu = slidemenus[i];
  hide(mnu);
}

function hide(mnu) {
  if (mnu.over) {
    if (mnu.hideTimer) window.clearTimeout(mnu.hideTimer)
    mnu.hideTimer = window.setTimeout("hidenow('" + mnu.menuId + "')", hideDelay);
    return;
  }
  hideTimer = mnu.hideTimer = 0;
  if (mnu.open && !mnu.aniTimer) startSlide(mnu, false);
}

function startSlide(mnu, open) {
	mnu.open = open
	mnu.style.visibility = "visible";
  mnu.parentNode.style.visibility = "visible";
	mnu.startTime = (new Date()).getTime();
	mnu.aniTimer = window.setInterval("slide("+mnu.menuId+")", 10)
}

function slide(i) {
  var mnu = slidemenus[i];
	var elapsed = (new Date()).getTime() - mnu.startTime;
	if (elapsed > aniLen) 
    endSlide(mnu);
	else {
    var d = Math.round(Math.pow(aniLen - elapsed, 2) * mnu.accelConst)
    if (mnu.open) {
      if (mnu.btn == "gezond") {
        mnu.style.left = - d + "px";
        mnu.bg.style.left = -d + "px";
      } else if (mnu.btn == "lekker") {
    		mnu.style.left = d + "px";
        mnu.bg.style.left = d + "px";
      } else if (mnu.btn == "leuk") {
      		mnu.style.top = d + "px";
          mnu.bg.style.top = d + "px";
      }
    }	else {
      if (mnu.btn == "gezond") {
      	mnu.style.left = d + mnu.bg.offsetWidth + "px";
        mnu.bg.style.left = d + mnu.bg.offsetWidth + "px";
      } else if (mnu.btn == "lekker") {
    		mnu.style.left = - d - mnu.bg.offsetWidth + "px";
        mnu.bg.style.left = - d - mnu.bg.offsetWidth + "px";
      } else if (mnu.btn == "leuk") {
      	mnu.style.top = - d - mnu.bg.offsetHeight + "px";
        mnu.bg.style.top = - d - mnu.bg.offsetHeight + "px";
      }
    }
	}
}

function endSlide(menu) {
	menu.aniTimer = window.clearTimeout(menu.aniTimer)
	//menu.moveTo(menu.open ? menu.outPos : menu.homePos)
	if (!menu.open) {
    menu.style.visibility = "hidden";
    menu.parentNode.style.visibility = "hidden";
    if (menu.func_dim && btn_closed(menu)) 
      menu.func_dim();
  }
}

function btn_closed(menu) {
  for(var i=0; i<slidemenus.length; i++) {
    if(slidemenus[i].btn == menu.btn && slidemenus[i].open) 
      return false;
  }
  return true;
}

function initmenu(mnuId, btn, mnu) {
  slidemenus[mnuId] = mnu;
  mnu.menuId = mnuId;
  
  var left = mnu.offsetLeft;
  var top = mnu.offsetTop;
  var width = mnu.offsetWidth;
  var height = mnu.offsetHeight;
  
  // create background image
  var bgclass = 'menubg_'+btn;
  if(mnuId == 5) {
    bgclass = bgclass + 6;
  }
	var img = document.createElement("IMG");
  if (document.all)
    img.setAttribute("src", "gfx/"+bgclass+".gif");
  else 
  	img.setAttribute("src", "gfx/"+bgclass+".png");
  img.setAttribute("width", width);
  img.setAttribute("height", height);
  img.className = "menubg";

  // create mnu container
  var div = document.createElement('div');
  div.className  = "container";
  div.style.left = left+"px";
  div.style.top  = top+"px";
  div.style.height = height+"px";
  div.style.width  = width+"px";
  div.style.visibility = "hidden";
  mnu.parentNode.replaceChild(div, mnu);
  div.appendChild(img);
  div.appendChild(mnu);

  mnu.bg  = img;
  mnu.btn = btn;
  mnu.onmouseover = function() { mnu.over = true;  }
  mnu.onmouseout  = function() { mnu.over = false; hidemenu(mnu); }
  img.onmouseover = function() { mnu.over = true;  }
  img.onmouseout  = function() { mnu.over = false; hidemenu(mnu); }

  if (btn == 'leuk')
    mnu.accelConst	= (0 - height) / aniLen / aniLen
  else
    mnu.accelConst	= (0 - width) / aniLen / aniLen
  
  mnu.style.left = 0 + "px";
  mnu.style.top = 0 + "px";
  
  if (btn == "gezond") {
    mnu.offset = mnu.offsetLeft;
    mnu.style.left = width + "px";
    img.style.left  = width + "px";
  } else if (btn == "lekker") {
    mnu.offset = left;
    mnu.style.left = - width + "px";
    img.style.left = -width + "px";
  } else if (btn == "leuk") {
    mnu.offset = mnu.offsetTop;
    mnu.style.top = - height + "px";
    img.style.top = -height + "px";
  }
}

// zoek binnen de div "menu" elementen li met daarin ul
function initmenus() {
  var menuId = 0;
  var menu = document.getElementById("mainmenu");
  for(var i=0; i < menu.childNodes.length; i++) {
    var mli = menu.childNodes[i];
    if(mli.nodeType == 1 && mli.tagName == 'LI') {
      for(var j=0; j < mli.childNodes.length; j++) {
        var mul = mli.childNodes[j];
        if(mul.nodeType == 1 && mul.tagName == 'UL') {
          for(var k=0; k < mul.childNodes.length; k++) {
            var li = mul.childNodes[k];
            if(li.nodeType == 1 && li.tagName == 'LI') {
              for(var l=0; l < li.childNodes.length; l++) {
                var ul = li.childNodes[l];
                if(ul.nodeType == 1 && ul.tagName == 'UL') {
                  initmenu(menuId++, mul.getAttribute('id'), ul);
                }
              }
            }
          }
        }
      }
    }
  }
  menu.style.visibility = "visible";
}


