var leftMargin = 84;
var topMargin = 40;
var menuWidth = 250;
var menuHeight = 100;
var menuHorizontalSpacing = 8;
var menuVerticalSpacing = 8;
var menuHorizontalDistance = 32;
var menuVerticalDistance = 32;
var menuSpeed = 1;
var menuId=0;
var paginaNummer = 0;
var menusOpening = false;

function clientHeight()
{
  var result=0;
  if (typeof(window.innerWidth) == typeof(0) )
    result=window.innerHeight-2;
  else if (document.documentElement && document.documentElement.clientWidth && document.documentElement.clientHeight)
    result=document.documentElement.clientHeight;
  else
    result=document.body.offsetHeight;
  return result;
}

function keyUp(e) {
  if (menuId==0) return;
  if (menuItems[menuId].aantalpaginas<2) return;
  var keyCode=0;
  var nr=0;

  if (e) keyCode=e.keyCode;
  else if (window.event) keyCode=window.event.keyCode;
  else if (this.parentWindow.event) keyCode=this.parentWindow.event.keyCode;

  if (((keyCode==39) || (keyCode==37)) && (document.getElementById('contenttitle').style.display=='block')) {
    nr=paginaNummer;
    if (keyCode==39) nr++;
    if (keyCode==37) nr--;
    if (nr>menuItems[menuId].aantalpaginas) nr=menuItems[menuId].aantalpaginas;
    if (nr<1) nr=1;
    openPagina(menuId, nr);
  }
}

function init() {
  if (document.addEventListener) document.addEventListener("keyup", keyUp, false);
  else document.onkeyup=keyUp;
  resize();
}

function initIframe(iframe) {
  if (iframe.contentWindow.document.addEventListener) iframe.contentWindow.document.addEventListener("keyup", keyUp, false);
  else iframe.contentWindow.document.onkeyup=keyUp;
}

function resize() {
  var contenttitle=document.getElementById('contenttitle');
  var content=document.getElementById('content');
  contenttitle.style.top=((topMargin+menuHeight)-30)+'px';
  contenttitle.style.left=leftMargin+menuWidth+menuHorizontalSpacing+'px';

  content.style.left=leftMargin+menuWidth+menuHorizontalSpacing+'px';
  content.style.height=clientHeight()-(topMargin+menuHeight+2*menuVerticalSpacing)+'px';
  content.style.top=topMargin+menuHeight+menuVerticalSpacing+'px';
}

function xPosFromCoord(xcoord) {
  return (xcoord - leftMargin) / (menuWidth  + menuHorizontalSpacing);
}

function yPosFromCoord(ycoord) {
  return (ycoord - topMargin) / (menuHeight + menuVerticalSpacing);
}

function xCoordFromPos(xPos) {
  return leftMargin + xPos * (menuWidth  + menuHorizontalSpacing);
}

function yCoordFromPos(yPos) {
  return topMargin  + (yPos) * (menuHeight + menuVerticalSpacing);
}

function resetMenuItem(el, xPos, yPos) {
  el.style.left=xCoordFromPos(xPos)+'px';
  el.style.top=yCoordFromPos(yPos)+'px';
  if (typeof(el.style.filter)==typeof('')) el.style.filter='';
  else if (typeof(el.style.MozOpacity)==typeof('')) el.style.MozOpacity='1';
  else if (typeof(el.style.opacity)==typeof('')) el.style.opacity='1';
}

function fadeOutElement(id, percentage) {
  document.getElementById(id).style.display='none';
  return;
}

function fadeInElement(id, percentage) {
  document.getElementById(id).style.display='block';
}

function openPagina(divid, nr) {
  menuId=divid;
  paginaNummer=nr;
  if (menuItems[divid].aantalpaginas<2) {
    document.getElementById('paginascroller').innerHTML='';
  }
  else {
    var s='Pagina:';
    for (var i=1; i<=menuItems[divid].aantalpaginas; i++) {
      s = s+'&nbsp;&nbsp;';
      if (i==paginaNummer) s = s+'<span class="currentpage" onclick="openPagina('+divid+','+i+')">'+i+'</span>';
      else s = s+'<span class="page" onclick="openPagina('+divid+','+i+')">'+i+'</span>';
    }
    document.getElementById('paginascroller').innerHTML=s;
  }

  if (menuItems[divid].id==0) {
    document.getElementById('iframe').src='oudesite/contact.php';
  }
  else {
    document.getElementById('iframe').src='oudesite/content.php?menuid='+menuItems[divid].id+'&volgnr='+nr;
  }
}

function showContent(divid) {
  openPagina(divid, paginaNummer);
  document.getElementById('content').style.display='block';
  document.getElementById('contenttitle').style.display='block';
  fadeInElement('content', 0);
  fadeInElement('contenttitle', 0);
}

function hideContent() {
  if (document.getElementById('content').style.display=='block') {
    fadeOutElement('content', 100);
    fadeOutElement('contenttitle', 100);
  }
}

function menuItemById(id) {
  var result=null;
  for (var i=1;(i<=menuCount) && (result==null);i++) {
    if (menuItems[i].id==id) result=menuItems[i];
  }
  return result;
}

function hasSubItems(id) {
  var result=false;
  var menu=menuItemById(id);
  if (menu) {
    for (var i=1;(i<=menuCount) && !result;i++) {
      if (menu && (menuItems[i].parentid==menu.id)) result=true;
    }
  }
  return result;
}

function getParentItem(id) {
  var result=null;
  if (id<=0) return result;
  var menu=menuItemById(id);
  if (menu) {
    for (var i=1;(i<=menuCount) && (result==null); i++) {
      if (menuItems[i].id==menu.parentid) result=menuItems[i];
    }
  }
  return result;
}

function isSubItem(id, parentid) {
  var result=false;
  var menu=menuItemById(id);
  var parentmenu=menuItemById(parentid);
  if ((menu) && (parentmenu)) result=(menu.parentid==parentmenu.id);
  return result;
}

function valtOnder(id, parentid) {
  var result=false;
  var parentItem=getParentItem(id);
  if (parentItem) {
    result=((parentItem.id==parentid) || (valtOnder(parentItem.id, parentid)));
  }
  return result;
}

function menuLevel(id) {
  var result=(id==0?0:1);
  parentmenu=getParentItem(id);
  if (parentmenu) {
    result=menuLevel(parentmenu.id)+1;
  }
  return result;
}

function moveElement(elementid, xPos, yPos) {
  menuId=parseInt(elementid.substring(3,elementid.length));
  var el=document.getElementById(elementid);
  var left=el.offsetLeft;
  var top=el.offsetTop;
  var dx = xCoordFromPos(xPos)-left;
  var dy = yCoordFromPos(yPos)-top;
  if (dx>0) if (dx>menuHorizontalDistance) dx=menuHorizontalDistance;
  if (dx<0) if (dx<-1*menuHorizontalDistance) dx=-1*menuHorizontalDistance;
  if (dy>0) if (dy>menuVerticalDistance) dy=menuVerticalDistance;
  if (dy<0) if (dy<-1*menuVerticalDistance) dy=-1*menuVerticalDistance;

  if ((dx==0) && (dy==0)) {
    if (hasSubItems(menuItems[menuId].id)) {
      setTimeout('expandMenus(0, 0, '+menuItems[menuId].id+');', 0);
    }
    else {
      showContent(menuId);
    }

    menusOpening = false;
    attachClickEvent(document.getElementById('div-1'));
    attachClickEvent(el);
    for (i=1;i<=menuCount;i++) {
      if (valtOnder(menuItems[menuId].id, menuItems[i].id)) {
        attachClickEvent(document.getElementById('div'+i));
      }
    }
    return;
  }
  else {
    if (dy==0) left += dx;
    else top  += dy;
  }
  el.style.left=left+'px';
  el.style.top=top+'px';
  setTimeout('moveElement("'+el.id+'", '+xPos+', '+yPos+');', menuSpeed);
}

function movableMenuCount(xPos, yPos, parentid) {
  var result=0;
  for (var i=1;i<=menuCount;i++) {
    if ((menuItems[i].parentid==parentid) && (menuItems[i].xpositie==xPos) && (menuItems[i].ypositie==yPos)) result++;
  }
  return result;
}

function setCursor(el,cursor) {
  if (el.style.cursor!=cursor) el.style.cursor=cursor;
  for (var i=0; i<el.childNodes.length; i++) {
    if (el.childNodes[i].nodeType==1)
      setCursor(el.childNodes[i],cursor)
  }
}

function attachClickEvent(el) {
  if (el.id=='div-1') {
    el.onclick=function () { openMenu(this, -1); };
  }
  else {
    var id=parseInt(el.id.substring(3,el.id.length));
    el.onclick=function () {
      kiesMenu(el.id);
    };
    document.getElementById('omschrijving'+id).onmousemove=function () { mouseMove(this); };
    document.getElementById('omschrijving'+id).onmouseout=function () { mouseOut(this); };
  }
  setCursor(el,'pointer');
}

function detachClickEvent(el) {
  el.onclick=null;
  if (el.id!='div-1') {
    var id=parseInt(el.id.substring(3,el.id.length));
    document.getElementById('omschrijving'+id).onmousemove=null;
    document.getElementById('omschrijving'+id).onmouseout=null;
  }
  setCursor(el,'wait');
}

function menusArived (xPos, yPos, parentid) {
  var result=true;
  var el=null;
  var left=0;
  var top=0;

  for (var i=1;(i<=menuCount) && result;i++) {
    el=document.getElementById('div'+i);
    left=el.offsetLeft;
    top=el.offsetTop;
    if ((menuItems[i].parentid==parentid) && ((menuItems[i].xpositie>=xPos) && (xPosFromCoord(left)<xPos) || (menuItems[i].ypositie>=yPos) && (yPosFromCoord(top)<yPos)))
      result=false;
  }
  return result;
}

function expandMenus(xPos, yPos, parentid) {
  var el=null;
  var left=0;
  var top=0;
  var menu=null;
  var dx=0;
  var dy=0;
  var i=0;

  detachClickEvent(document.getElementById('div-1'));
  for (i=1;i<=menuCount;i++) {
    detachClickEvent(document.getElementById('div'+i));
  }

  if (menusArived(xPos, yPos, parentid)) {
    if ((xPos==1) && (movableMenuCount(xPos+1, yPos, parentid)>0)) {
      xPos++;
    }
    else {
      if (xPos>0) yPos++;
      xPos=1;
    }
  }

  if (yPos>10) { // Alle menu's uitgeklapt
    menusOpening = false;
    attachClickEvent(document.getElementById('div-1'));
    for (i=1;i<=menuCount;i++) {
      attachClickEvent(document.getElementById('div'+i));
    }
  }
  else {
    for (i=1;i<=menuCount;i++) {
      menu=menuItems[i];
      if (menu.parentid==parentid) {
        el=document.getElementById('div'+i);
        el.style.display='block';

        left=el.offsetLeft;
        top=el.offsetTop;
        dx = xCoordFromPos(xPos)-left;
        dy = yCoordFromPos(yPos)-top;
        if (dx>0) if (dx>menuHorizontalDistance) dx=menuHorizontalDistance;
        if (dx<0) if (dx<-1*menuHorizontalDistance) dx=-1*menuHorizontalDistance;
        if (dy>0) if (dy>menuVerticalDistance) dy=menuVerticalDistance;
        if (dy<0) if (dy<-1*menuVerticalDistance) dy=-1*menuVerticalDistance;

        if ((menu.xpositie>=xPos) && (xPosFromCoord(left) < xPos)) left += dx;
        if ((menu.parentid==parentid) && (menu.ypositie>=yPos) && (yPosFromCoord(top)  < yPos)) top  += dy;

        el.style.left=left+'px';
        el.style.top=top+'px';
      }
    }

    setTimeout('expandMenus('+xPos+','+yPos+', '+parentid+');', menuSpeed);
  }
}

function openMenu(menudiv, parentid){
  if (menusOpening) return;
  menusOpening = true;
  if (!menudiv) {
    menudiv=document.getElementById('div-1');
    parentid=-1;
  }
  document.getElementById('content').style.display='none';
  document.getElementById('contenttitle').style.display='none';
  detachClickEvent(document.getElementById('div-1'));
  for (var i=1;i<=menuCount;i++) {
    resetMenuItem(document.getElementById('div'+i), 0, 0);
    detachClickEvent(document.getElementById('div'+i));
  }
  expandMenus(0, 0, parentid);
}

function kiesMenu(divid){
  menusOpening = true;
  document.getElementById('iframe').src='blank.htm';
  hideContent();
  var menu=null;
  menuId = parseInt(divid.substring(3,divid.length));
  document.getElementById('omschrijving'+menuId).className="omschrijving";
  paginaNummer=1;
  bewaarStatistieken(menuId);

  detachClickEvent(document.getElementById('div-1'));
  for (i=1;i<=menuCount;i++) {
    detachClickEvent(document.getElementById('div'+i));
    menu=menuItems[i];
    if (i==menuId) {
      setTimeout('moveElement("div'+i+'", 0, '+menuLevel(menu.id)+');', 0);
    }
    else {
      if (!valtOnder(menuItems[menuId].id, menu.id)) {
        if (isSubItem(menu.id, menuItems[menuId].id)) {
          resetMenuItem(document.getElementById('div'+i), 0, 0*(menuLevel(menuItems[i].id)-1));
        }
        else {
          fadeOutElement('div'+i, 100);
        }
      }
    }
  }
}

function bewaarStatistieken(divid) {
  document.getElementById('statistics').src='oudesite/statistics.php?menukeuze='+menuItems[divid].id;
}

function printPagina() {
  document.getElementById('iframe').contentWindow.focus();
  document.getElementById('iframe').contentWindow.print();
}

function mouseMove(el){
  el.className="omschrijvinghover";
}

function mouseOut(el){
  el.className="omschrijving";
}