var m = [];
m[0] = [];
m[0][0] = "Home";
m[0][1] = "Welkom";
m[0][2] = "Schoolvisie";
m[0][3] = "Schoolgids";
m[0][4] = "Schoolplan";
m[0][5] = "Jaaroverzicht";
m[0][6] = "Team";
m[0][7] = "De Mare";
m[1] = [];
m[1][0] = "Nieuwsbrief";
m[1][1] = "Actueel";
m[1][2] = "Archief";
m[2] = [];
m[2][0] = "Groepen";
m[2][1] = "Groepsindeling";
m[2][2] = "Plattegrond";
m[3] = [];
m[3][0] = "Ouders";
m[3][1] = "Inleiding";
m[3][2] = "OV";
m[3][3] = "MR";
m[4] = [];
m[4][0] = "Kinderen";
m[4][1] = "Schoolkrant";
m[4][2] = "Links";
m[5] = [];
m[5][0] = "Foto's";
m[6] = [];
m[6][0] = "Contact";
m[6][1] = "Adres";
m[6][2] = "Route";
m[6][3] = "Contactformulier";

var subwidth = 120;
var offset = 50;
var spacing = 60;
var dim = [];
dim[0] = 37;
dim[1] = 73;
dim[2] = 52;
dim[3] = 46;
dim[4] = 54;
dim[5] = 37;
dim[6] = 48;

var menuTimer;

function Menu(oRoot,currentpage) {
  this.dat = m;
  this.oRoot = oRoot;
  this.currentPage = currentpage;

  Menu.prototype.init = menuInit;
  Menu.prototype.extend = menuExtend;
}

function onMouseOver(evt) {
  if(!evt)
    evt = window.event;
  var src;
  if(window.event) src = evt.srcElement;
  else src = evt.target;
  src.style.color = "#ff0000";
  document.body.style.cursor = 'pointer';
}
function onMouseOut(evt) {
  if(!evt)
    evt = window.event;
  var src;
  if(window.event) src = evt.srcElement;
  else src = evt.target;
  src.style.color = "#ffffff";
  menuTimer = setTimeout(hideall,300);
  document.body.style.cursor = 'default';
}
function subMouseOver(evt) {
  if(!evt)
    evt = window.event;
  if(window.event) src = evt.srcElement;
  else src = evt.target;

  clearTimeout(menuTimer);
  document.body.style.cursor = 'pointer';
  src.style.color = "#ff0000";
}
function subMouseOut(evt) {
  if(!evt)
    evt = window.event;
  if(window.event) src = evt.srcElement;
  else src = evt.target;

  menuTimer = setTimeout(hideall,300);
  document.body.style.cursor = 'default';
  src.style.color = "#000000";
}
function onMouseUp(evt) {
  if(window.event) src = window.event.srcElement;
  else src = evt.target;

  var i;
  for(i=0;i<m.length;i++) {
    if(m[i][0] == src.innerHTML)
      for(j=1;j<m[i].length;j++) {
	document.getElementById('sub'+i+'_'+j).style.visibility='visible';
      }
  }
}
function menuNavigate(evt) {
  if(window.event) src = window.event.srcElement;
  else src = evt.target;

  var i;
  for(i=0;i<m.length;i++) {
    for(j=1;j<m[i].length;j++)
      if(m[i][j] == src.innerHTML)
	window.location = "index.php?p0="+m[i][0]+"&p1="+m[i][j];
  }
}

function hideall() {
  for(i=0; i<m.length;i++) {
    for (j=1;j<m[i].length;j++) {
      document.getElementById('sub'+i+'_'+j).style.visibility='hidden';
    }
  }
}

function menuInit() {
  // offset,spacing,dim[]
  var i;
  var j;
  var x = offset;
  var y = 350;
  var yinc = 24;
  for(i=0,j=this.dat.length;i<j;i++) {
    var div = document.createElement('div');
    div.appendChild(document.createTextNode(this.dat[i][0]));
    div.className = 'menuroot';
    div.style.position = 'absolute';
    div.style.top = y +'px';
    div.style.left = x + 'px';
//    div.style.width = dim[i] + 'px';
//    div.style.width = '90px';
//    div.style.textAlign = 'left';
    div.style.paddingLeft = '20px';
    div.style.paddingRight = '20px';
    div.style.height = (yinc-4) + 'px';
    if(this.currentPage == this.dat[i][0]) {
      div.style.borderBottom = '2px solid red';
    }
    div.onmouseover = onMouseOver;
    div.onmouseout = onMouseOut;
    div.onmouseup = onMouseUp;
    this.oRoot.appendChild(div);

    subx = x - (subwidth-dim[i])/2;
    for(k=1,l=this.dat[i].length;k<l;k++) {
      div = document.createElement('div');
      div.className = 'menusub';
      div.id = 'sub'+i+'_'+k;
      div.style.position = 'absolute';
      div.style.top = (y + k*yinc) + 'px';
      div.style.left = (subx + 20) +'px';
      div.style.width = subwidth + 'px';
      div.style.height = (yinc-4) + "px";
      div.style.border = '1px solid #7b97da';
      div.style.background = 'white';
      div.style.visibility = 'hidden';
      div.onmouseup = menuNavigate;
      div.onmouseover = subMouseOver;
      div.onmouseout = subMouseOut;
      p = document.createElement('p');
      if(window.event) p.style.margin = '0px';
      p.appendChild(document.createTextNode(this.dat[i][k]));
      div.appendChild(p);

      this.oRoot.appendChild(div);
    }

    x += dim[i] + spacing;
  }
}

function menuExtend(x)
{
}