// Opbouwen productmenu - Velda
// (c) T.H. Deibel 2006/03/04
//
var isDOM = (document.getElementById ? true : false); 
var isIE4 = ((document.all && !isDOM) ? true : false);
var isNS4 = (document.layers ? true : false);

function getRef(id) {
if (isDOM) return document.getElementById(id);
if (isIE4) return document.all[id];
if (isNS4) return document.layers[id];
}
function getSty(id) {
return (isNS4 ? getRef(id) : getRef(id).style);
} 

// Hide timeout.
var popTimer = 0;
// Array showing highlighted menu items.
var litNow = new Array();

function popOver(menuNum, itemNum) {
 clearTimeout(popTimer);
 hideAllBut(menuNum);
 litNow = getTree(menuNum, itemNum);
 changeCol(litNow, true);
 targetNum = menu[menuNum][itemNum].target;
 if (targetNum > 0) {
  thisX = parseInt(menu[menuNum][0].ref.left) + parseInt(menu[menuNum][itemNum].ref.left);
  thisY = parseInt(menu[menuNum][0].ref.top) + parseInt(menu[menuNum][itemNum].ref.top);
  with (menu[targetNum][0].ref) {
   left = parseInt(thisX + menu[targetNum][0].x);
   top = parseInt(thisY + menu[targetNum][0].y);
   visibility = 'visible';
  }
 }
}
function popOut(menuNum, itemNum) {
 if ((menuNum == 0) && !menu[menuNum][itemNum].target)
  hideAllBut(0)
 else
  popTimer = setTimeout('hideAllBut(0)', 500);
}
function getTree(menuNum, itemNum) {
// Array index is the menu number. The contents are null (if that menu is not a parent)
// or the item number in that menu that is an ancestor (to light it up).
 itemArray = new Array(menu.length);
 while(1) {
  itemArray[menuNum] = itemNum;
  // If we've reached the top of the hierarchy, return.
  if (menuNum == 0) return itemArray;
  itemNum = menu[menuNum][0].parentItem;
  menuNum = menu[menuNum][0].parentMenu;
 }
}
// Pass an array and a boolean to specify colour change, true = over colour.
function changeCol(changeArray, isOver) {
 var itemNum, newColOver, newColBg;
 for (menuIndex = 0; menuIndex < changeArray.length; menuIndex++) {
  if (itemNum=changeArray[menuIndex]) {
   with (menu[menuIndex][itemNum].ref) {
    if (menuIndex <= maxColIndex) { // menuIndex is 0 t/m 8
      newColOver= (menuIndex==0) ? colOver[itemNum] : colOver[menuIndex]; // Alleen bij menu[0] verschillende kleuren!
      newColBg  = (menuIndex==0) ? colBg[itemNum] : colBg[menuIndex];
    }
    else { // menuIndex > 8 : haal gegevens van parents
      newColOver= colOver[ menu[menuIndex][0].parentMenu ];
      newColBg  = colBg[ menu[menuIndex][0].parentMenu ];
    }
    if (isNS4) bgColor = (isOver) ? newColOver : newColBg;
    else backgroundColor = (isOver) ? newColOver : newColBg;
   }
  }
 }
}
function hideAllBut(menuNum) {
 var keepMenus = getTree(menuNum, 1);
 for (count = 0; count < menu.length; count++)
   if (!keepMenus[count]) menu[count][0].ref.visibility = 'hidden';
 changeCol(litNow, false);
}
// *** MENU CONSTRUCTION FUNCTIONS ***
function Menu(isVert, popInd, x, y, width, borderClass, textClass) {
 this.isVert = isVert; // True or false - a vertical menu?
 this.popInd = popInd; // The popout indicator used (if any) for this menu.
 this.x = x; // Position and size settings.
 this.y = y;
 this.width = width;
 // The stylesheet class used for item borders and the text within items.
 this.borderClass = borderClass;
 this.textClass = textClass;
 // Parent menu and item numbers, indexed later.
 this.parentMenu = null;
 this.parentItem = null;
 // Reference to the object's style properties (set later).
 this.ref = null;
}
function Item(text, href, target) { // frame wordt NIET gebruikt!
 this.text = text;
 this.href = href;
 this.frame = '';
 this.length = defHeight;
 this.spacing = 2;
 this.target = target;
 // Reference to the object's style properties (set later).
 this.ref = null;
}
function writeMenus() {
 if (!isDOM && !isIE4 && !isNS4) return;
 var str2=''; // tbv debuggen
 for (currMenu = 0; currMenu < menu.length; currMenu++) with (menu[currMenu][0]) {
   // Variable for holding HTML for items and positions of next item.
   var str = '', itemX = 0, itemY = 0, backCol;
   // Remember, items start from 1 in the array (0 is menu object itself, above).
   // Also use properties of each item nested in the other with() for construction.
   for (currItem = 1; currItem < menu[currMenu].length; currItem++) with (menu[currMenu][currItem]) {
     var itemID = 'menu' + currMenu + 'item' + currItem;
     // The width and height of the menu item - dependent on orientation!
     var w = (isVert ? width : length);
     var h = (isVert ? length : width);
     // Create a div or layer text string with appropriate styles/properties.
     // Thanks to Paul Maden (www.paulmaden.com) for helping debug this in IE4, apparently
     // the width must be a miniumum of 3 for it to work in that browser.
     if (currMenu > maxColIndex) {
       backCol = colBg[menu[currMenu][0].parentMenu]; // Bij menu[9-..] zelfde kleuren als parent!
     }
     else { // Bij menu[0] verschillende kleuren en bij menu[1..8] dezelfde kleuren
       backCol = (currMenu==0) ? colBg[currItem] : colBg[currMenu];
     }
     if (isDOM || isIE4) {
       str += '<div id="' + itemID + '" style="position:absolute; left:' + itemX + '; top:' + itemY +
              '; width:' + w + '; height:' + h + '; visibility:inherit; ';
       if (backCol) str += 'background:' + backCol + '; ';
       str += '" ';
     }
     if (isNS4) {
       str += '<layer id="' + itemID + '" left="' + itemX + '" top="' + itemY + '" width="' +  w +
              '" height="' + h + '" visibility="inherit" bgcolor="' + backCol + '" ';
     }
     if (borderClass) str += 'class="' + borderClass + '" ';
     // Add mouseover handlers and finish div/layer.
//str += ' title="' + currMenu + ',' + currItem + '"';

     str += ' onMouseOver="popOver(' + currMenu + ',' + currItem + ')" onMouseOut="popOut(' + currMenu + ',' + currItem + ')" ' + (href ? 'onClick="newLocation(\'' + href + '\');"' : '') + '>\n';

     // ITEMS:
     // Add contents of item (default: table with link inside).
     // In IE/NS6+, add padding if there's a border to emulate NS4's layer padding.
     str += '<table width="' + (w - 2) + '" border="0" cellspacing="0" cellpadding="' +
            (!isNS4 && borderClass ? 3 : 0) + '">\n<tr><td align="right" class="' + textClass + '" ' +
            (href ? 'onClick="newLocation(\'' + href + '\');"' : '') + ' height="' + (h - 7) + '">' + 
            (href ? '<a class="' + textClass + '" href="' + href + '">' + text + '</a>' : text) + '</td>\n';
     if (target > 0) {
       // Set target's parents to this menu item.
       menu[target][0].parentMenu = currMenu;
       menu[target][0].parentItem = currItem;
       // Add a popout indicator.
       if (popInd) str += '<td width="14" class="' + textClass + '" align="right">' + popInd + '</td>\n'; // VASTE BREEDTE !!!
     }
     str += '</tr></table>\n' + (isNS4 ? '</layer>\n' : '</div>\n');
     if (isVert) itemY += length + spacing;
     else itemX += length + spacing;
   }
   if (isDOM) {
     var newDiv = document.createElement('div');
     document.getElementsByTagName('body').item(0).appendChild(newDiv);
     newDiv.innerHTML = str;
     ref = newDiv.style;
     ref.position = 'absolute';
     ref.left=0; // THD20060304
     ref.top=0; // THD20060304
     ref.visibility = 'hidden';
   }
   // Insert a div tag to the end of the BODY with menu HTML in place for IE4.
   if (isIE4) {
     document.body.insertAdjacentHTML('beforeEnd', '<div id="menu' + currMenu + 'div" ' + 'style="position: absolute; visibility: hidden">' + str + '</div>');
     ref = getSty('menu' + currMenu + 'div');
   }
   // In NS4, create a reference to a new layer and write the items to it.
   if (isNS4) {
     ref = new Layer(0);
     ref.document.write(str);
     ref.document.close();
   }
   for (currItem = 1; currItem < menu[currMenu].length; currItem++) {
     itemName = 'menu' + currMenu + 'item' + currItem;
     if (isDOM || isIE4) menu[currMenu][currItem].ref = getSty(itemName);
     if (isNS4) menu[currMenu][currItem].ref = ref.document[itemName];
   }
   str2 = str2 + str; // tbv debuggen
 }
 with(menu[0][0]) {
   ref.left = x;
   ref.top = y;
   ref.visibility = 'visible';
 }
//messageWindow("ProdMenu source", str2); // DEBUG WINDOW !!!!
}
function messageWindow(title, msg)
{
  var width="300", height="125";
  var left = (screen.width/2) - width/2;
  var top = (screen.height/2) - height/2;
  var styleStr = 'toolbar=no,location=no,directories=no,status=no,menubar=no,scrollbar=yes,resizable=yes,copyhistory=yes,width='+width+',height='+height+',left='+left+',top='+top+',screenX='+left+',screenY='+top;
  var msgWindow = window.open("","msgWindow", styleStr);
  var head = '<head><title>'+title+'</title></head>';
  var body = msg+'<br><hr><form><input type="button" value="   Done   " onClick="self.close()"></form>';
  msgWindow.document.write(head + body);
}
function rePositionMenu() {
  var leftPos, offset = 10;
  if (window.innerWidth) docWidth = self.innerWidth;
  else if (document.documentElement && document.documentElement.clientWidth) docWidth = document.documentElement.clientWidth;
  else if (document.body) docWidth = document.body.clientWidth;
  else docWidth = window.screen.width;
  leftPos = Math.round(docWidth / 2) - (tableWidth / 2) + offset;
  if (leftPos < offset) leftPos = offset;
  with(menu[0][0].ref) left = leftPos;
}

