var menuItems = new Array();
var linkNum = 0;
var sectionNum = 0;
var subIndex = 0;

var menuImages = new Array('familyVehicle_adjustableVest', 136, 'familyVehicle_nonAdjustableVest', 124, 'familyVehicle_vestClosure', 192, 'schoolBus_nonAdjustableVest', 140, 'schoolBus_adjustableVest', 213, 'schoolBus_1086camHarness', 142, 'schoolBus_seatMount', 163, 'schoolBus_vestClosure', 175, 'medicalTransport_modifiedVest', 113, 'medicalTransport_wheelChairMount', 173, 'accessories_cpsTechBags', 90, 'kidCam', 233, 'tetherMount', 223, 'floorMount', 208, '86yHarness', 179, 'kidY', 173,  'schoolBus', 99, 'familyVehicle', 85, 'medicalTransport', 89, 'accessories', 93);

menuItems[linkNum] = new Array();
menuItems[linkNum][sectionNum] = new Array();
menuItems[linkNum][sectionNum][0] = new Array();
menuItems[linkNum][sectionNum][1] = new Array();

// SCHOOL BUS PRODUCTS
menuItems[linkNum][sectionNum][0][subIndex] = 'School Bus Products';
menuItems[linkNum][sectionNum][1][subIndex++] = 'products/schoolBus.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Adjustable Vests';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/schoolBus/adjustableVest.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Non-adjustable Vests';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/schoolBus/nonAdjustableVest.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Vest Closure & Size Info';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/schoolBus/vestClosure.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Seat Mount';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/schoolBus/seatMount.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Tether Mount';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/schoolBus/tetherMount.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Floor Mount';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/schoolBus/floorMount.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = '1086 Camharness™';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/schoolBus/1086camHarness.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'KidCam™ Harness';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/schoolBus/kidCam.shtml';


  sectionNum += 1;
  subIndex = 0;


menuItems[linkNum][sectionNum] = new Array();
menuItems[linkNum][sectionNum][0] = new Array();
menuItems[linkNum][sectionNum][1] = new Array();

// FAMILY VEHICLE PRODUCTS
menuItems[linkNum][sectionNum][0][subIndex] = 'Family Vehicle Products';
menuItems[linkNum][sectionNum][1][subIndex++] = 'products/familyVehicle.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Adjustable Vests';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/familyVehicle/adjustableVest.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Non-adjustable Vests';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/familyVehicle/nonAdjustableVest.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Vest Closure & Size Info';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/familyVehicle/vestClosure.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Tether Mount';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/familyVehicle/tetherMount.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Floor Mount';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/familyVehicle/floorMount.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = '86 Y Harness';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/familyVehicle/86yHarness.shtml';

//  menuItems[linkNum][sectionNum][0][subIndex] = 'Kid Y and Ride Ryte™ Booster';
//  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/familyVehicle/kidY.shtml';

  sectionNum += 1;
  subIndex = 0;

menuItems[linkNum][sectionNum] = new Array();
menuItems[linkNum][sectionNum][0] = new Array();
menuItems[linkNum][sectionNum][1] = new Array();

// MEDICAL TRANSPORT PRODUCTS
menuItems[linkNum][sectionNum][0][subIndex] = 'Medical Transport Products';
menuItems[linkNum][sectionNum][1][subIndex++] = 'products/medicalTransport.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Modfied vests';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/medicalTransport/modifiedVest.shtml';

  menuItems[linkNum][sectionNum][0][subIndex] = 'Wheel Chair Mount';
  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/medicalTransport/wheelChairMount.shtml';


  sectionNum += 1;
  subIndex = 0;

menuItems[linkNum][sectionNum] = new Array();
menuItems[linkNum][sectionNum][0] = new Array();
menuItems[linkNum][sectionNum][1] = new Array();

// ACCESSORIES
menuItems[linkNum][sectionNum][0][subIndex] = 'Accessories';
menuItems[linkNum][sectionNum][1][subIndex++] = 'products/accessories.shtml';

//  menuItems[linkNum][sectionNum][0][subIndex] = 'CPS Tech Bags';
//  menuItems[linkNum][sectionNum][1][subIndex++] = 'products/accessories/cpsTechBags.shtml';


function mouseOver(img) {
  img.src = img.src.substring(0,img.src.lastIndexOf(".")) + "_hover" + img.src.substring(img.src.lastIndexOf("."), img.src.length);
}

function mouseOut(img) {
  img.src = img.src.replace("_hover.", ".");
}

var menuPopupTimer;
var slideTimer;

function popupMenu(item, itemNum) {

  // LOAD CONTENT
  loadPopupMenuContent(itemNum);

  // POSITION MENU
  document.getElementById("popupMenu").style.top = item.offsetTop;
  document.getElementById("popupMenu").style.left = 638 - item.offsetWidth;

  document.getElementById("popupMenuFrame").style.top = document.getElementById("popupMenu").offsetTop;
  document.getElementById("popupMenuFrame").style.left = document.getElementById("popupMenu").offsetLeft;
  document.getElementById("popupMenuFrame").style.width = document.getElementById("popupMenu").offsetWidth;
  document.getElementById("popupMenuFrame").style.height = document.getElementById("popupMenu").offsetHeight;
  document.getElementById("popupMenuFrame").style.zIndex = document.getElementById("popupMenu").style.zIndex - 1;
  document.getElementById("popupMenuFrame").style.display = "block";

  if (navigator.appName.indexOf("Explorer") != -1) {
  // APPLY FADE EFFECT
  document.getElementById("popupMenuFrame").style.filter="blendTrans(duration=.25)";
  document.getElementById("popupMenuFrame").style.visibility = "hidden";
  document.getElementById("popupMenuFrame").filters.blendTrans.apply();
  document.getElementById("popupMenuFrame").style.visibility = "visible";
  document.getElementById("popupMenuFrame").filters.blendTrans.play();

  document.getElementById("popupMenu").style.filter="blendTrans(duration=.25)";
  document.getElementById("popupMenu").style.visibility = "hidden";
  document.getElementById("popupMenu").filters.blendTrans.apply();
  document.getElementById("popupMenu").style.visibility = "visible";
  document.getElementById("popupMenu").filters.blendTrans.play();

  }
  else {
    document.getElementById("popupMenu").style.visibility = "visible";
    document.getElementById("popupMenuFrame").style.visibility = "visible";
  }
  clearPopupMenuTimer();
}

function subPopupMenu(item, itemNum, sectionNum) {
  loadSubPopupMenuContent(itemNum, sectionNum);

  // Position menu
  var parent = document.getElementById("popupMenu");
  document.getElementById("popupMenu2").style.top = parent.offsetTop + item.parentNode.offsetTop - 2;
  document.getElementById("popupMenu2").style.left = parent.offsetLeft - document.getElementById("popupMenu2").offsetWidth+1;

  document.getElementById("popupMenu2Frame").style.top = document.getElementById("popupMenu2").offsetTop;
  document.getElementById("popupMenu2Frame").style.left = document.getElementById("popupMenu2").offsetLeft;
  document.getElementById("popupMenu2Frame").style.width = document.getElementById("popupMenu2").offsetWidth;
  document.getElementById("popupMenu2Frame").style.height = document.getElementById("popupMenu2").offsetHeight;
  document.getElementById("popupMenu2Frame").style.zIndex = document.getElementById("popupMenu2").style.zIndex - 1;
  document.getElementById("popupMenu2Frame").style.display = "block";

  if (navigator.appName.indexOf("Explorer") != -1) {
  // APPLY FADE EFFECT
    document.getElementById("popupMenu2Frame").style.filter="blendTrans(duration=.25)";
    document.getElementById("popupMenu2Frame").style.visibility = "hidden"
    if (menuItems[itemNum][sectionNum][0].length != 1) {
      document.getElementById("popupMenu2Frame").filters.blendTrans.apply();
      document.getElementById("popupMenu2Frame").style.visibility = "visible";
      document.getElementById("popupMenu2Frame").filters.blendTrans.play();
    }

    document.getElementById("popupMenu2").style.filter="blendTrans(duration=.25)";
    document.getElementById("popupMenu2").style.visibility = "hidden";
    if (menuItems[itemNum][sectionNum][0].length != 1) {
      document.getElementById("popupMenu2").filters.blendTrans.apply();
      document.getElementById("popupMenu2").style.visibility = "visible";
      document.getElementById("popupMenu2").filters.blendTrans.play();
    }
  }
  else {
    document.getElementById("popupMenu2").style.visibility = "visible";
    document.getElementById("popupMenu2Frame").style.visibility = "visible";
    if (menuItems[itemNum][sectionNum][0].length != 1) {
      document.getElementById("popupMenu2").style.visibility = "hidden";
      document.getElementById("popupMenu2Frame").style.visibility = "hidden";
    }
  }
  clearPopupMenuTimer();
}

function closePopupMenu() {
  if (navigator.appName.indexOf("Explorer") != -1) {
  document.getElementById("popupMenu2").style.filter="blendTrans(duration=.25)";
  document.getElementById("popupMenu").style.filter="blendTrans(duration=.25)";
  document.getElementById("popupMenu2Frame").style.filter="blendTrans(duration=.25)";
  document.getElementById("popupMenuFrame").style.filter="blendTrans(duration=.25)";

  document.getElementById("popupMenu2").filters.blendTrans.apply();
  document.getElementById("popupMenu2").style.visibility = "hidden";
  document.getElementById("popupMenu2").filters.blendTrans.play();

  document.getElementById("popupMenu").filters.blendTrans.apply();
  document.getElementById("popupMenu").style.visibility = "hidden";
  document.getElementById("popupMenu").filters.blendTrans.play();

  document.getElementById("popupMenu2Frame").filters.blendTrans.apply();
  document.getElementById("popupMenu2Frame").style.visibility = "hidden";
  document.getElementById("popupMenu2Frame").filters.blendTrans.play();

  document.getElementById("popupMenuFrame").filters.blendTrans.apply();
  document.getElementById("popupMenuFrame").style.visibility = "hidden";
  document.getElementById("popupMenuFrame").filters.blendTrans.play();
  }
  else {
  document.getElementById("popupMenu").style.visibility = "hidden";
  document.getElementById("popupMenu2").style.visibility = "hidden";
  document.getElementById("popupMenuFrame").style.visibility = "hidden";
  document.getElementById("popupMenu2Frame").style.visibility = "hidden";
  }

  document.getElementById("popupMenu").innerHTML = '';
  document.getElementById("popupMenu2").innerHTML = '';
}

function startPopupMenuTimer() {
  if (document.getElementById("popupMenu").innerHTML != "") {
    clearTimeout(menuPopupTimer);
    menuPopupTimer = setTimeout("closePopupMenu()", 1000);
  }
}

function clearPopupMenuTimer() {
  clearTimeout(menuPopupTimer);
}

function loadPopupMenuContent(n) {
  var html = '<table cellspacing=1 cellpadding=3 class="bgLightGrey" onmouseout="startPopupMenuTimer()">';

  for (i = 0; i < menuItems[n].length; i++) {
    html += '<tr height=24><td>'+((menuItems[n][i][0].length != 1) ? '<img src="arrow.gif" alt="">' : '')+'</td><td class="bgLightGrey"><a href="'+menuItems[n][i][1][0]+'" class="popupLink" onmouseover="subPopupMenu(this,'+n+','+i+'); loadSectionImage(this.href)"">'+menuItems[n][i][0][0]+'</a></td></tr>';
  }

  html += '<tr><td></td><td class="bgLightGrey" align="center"><div id="subImageDisplay" style="position: relative;"></div></td></tr></table>';

  document.getElementById('popupMenu').innerHTML = html;
}

function loadSubPopupMenuContent(n, s) {
  html = '<table width=181 cellspacing=1 cellpadding=3 class="bgLightGrey" onmouseover="clearPopupMenuTimer()" onmouseout="startPopupMenuTimer()">';

  for (j = 1; j < menuItems[n][s][0].length; j++) {
      html += '<tr height=24><td class="bgLightGrey"><a href="'+menuItems[n][s][1][j]+'" class="popupLink" onmouseover="loadProductImage(this.href)">'+menuItems[n][s][0][j]+'</a></td></tr>';
  }

  html += '<tr><td class="bgLightGrey" align="center"><div id="subImageDisplay2" style="position: relative;"></div></td></tr></table>';

  document.getElementById('popupMenu2').innerHTML = html;
}

function loadSectionImage(link) {
  if (getImage(link) != 0) {
    document.getElementById("subImageDisplay").innerHTML = '';
    resizePopupMenu(link);
    document.getElementById("subImageDisplay").innerHTML = '<img src="'+getImage(link)+'" alt="">';
  }
  else {
    document.getElementById("subImageDisplay").innerHTML = '';
    resizePopupMenu(link);
    document.getElementById("subImageDisplay").innerHTML = '<img src="spacer.gif" alt="">';
  }
}

function loadProductImage(link) {
  document.getElementById("subImageDisplay2").innerHTML = '';
  resizeSubPopupMenu(link);
  document.getElementById("subImageDisplay2").innerHTML = '<img src="'+getImage(link)+'" alt="">';
}

function resizePopupMenu(l) {
  document.getElementById("subImageDisplay").style.height = getImageHeight(l);
  document.getElementById("popupMenuFrame").style.height = document.getElementById("popupMenu").offsetHeight + 1;
}

function resizeSubPopupMenu(l) {
  document.getElementById("subImageDisplay2").style.height = getImageHeight(l);
  document.getElementById("popupMenu2Frame").style.height = document.getElementById("popupMenu2").offsetHeight + 1;
}

function getImage(elem) {
  for (i = 0; i < menuImages.length; i+=2) {
    var section = (menuImages[i].indexOf("_") != -1) ? menuImages[i].substring(0, menuImages[i].indexOf("_")) : "";
    var product = (section != -1) ? menuImages[i].substring(menuImages[i].indexOf("_")+1, menuImages[i].length) : menuImages[i];

    if (elem.indexOf(product) != -1) {
      if (elem.indexOf(section) != -1) {
        if (section != "")
          resizeSubPopupMenu(section + ((section != "") ? "_" : "") + product);

        return "menu_" + section + ((section != "") ? "_" : "") + product + ".gif";
      }
    }



  }

  return 0;
}

function getImageHeight(elem) {

  for (i = 0; i < menuImages.length; i+=2) {
    if (elem.indexOf(menuImages[i]) != -1)
      return menuImages[i+1];
  }

  return 1;
}

function productMouseInfo(side, details, elem) {
  document.getElementById("productMouseInfo").style.visibility = "visible";
  document.getElementById("productMouseInfo").innerHTML = '<p class="borderedText">'+details+'</p>';
  document.getElementById("productMouseInfo").style.left = (side == 'left') ? document.getElementById("image_product").offsetLeft - document.getElementById("productMouseInfo").offsetWidth : document.getElementById("image_product").offsetLeft + document.getElementById("image_product").offsetWidth;

  if (navigator.appName.indexOf("Explorer") != -1)
    document.getElementById("productMouseInfo").style.top = window.event.offsetY + document.getElementById("image_product").offsetTop - document.getElementById("productMouseInfo").offsetHeight / 2;
  else
    document.getElementById("productMouseInfo").style.top = document.getElementById("image_product").offsetHeight / 2 + document.getElementById("image_product").offsetTop - document.getElementById("productMouseInfo").offsetHeight / 2;
}

function closeProductMouseInfo() {
  document.getElementById("productMouseInfo").style.visibility = "hidden";
}

function toggleProductView() {
  if (document.getElementById("toggleProductViewButton").src.indexOf("Back") != -1) {
    document.getElementById("image_product").src = document.getElementById("image_product").src.replace("front", "back");
    document.getElementById("image_product").useMap = document.getElementById("image_product").useMap.replace("front", "back");
    document.getElementById("toggleProductViewButton").src = "seeFrontView.gif";
  }
  else {
    document.getElementById("image_product").src = document.getElementById("image_product").src.replace("back", "front");
    document.getElementById("image_product").useMap = document.getElementById("image_product").useMap.replace("back", "front");
    document.getElementById("toggleProductViewButton").src = "seeBackView.gif";
  }
}

function loadProductPreview(link) {
  var image = link.substring(link.lastIndexOf("/") + 1, link.lastIndexOf("."));

  if (document.getElementById("productFullSizePreview").src.indexOf(image) == -1) {
    link = link.substring(0, link.lastIndexOf("/"));
    var section = link.substring(link.lastIndexOf("/") + 1, link.length);
    link = link.substring(0, link.lastIndexOf("/"));
    var vehicle = link.substring(link.lastIndexOf("/") + 1, link.length);

    document.getElementById("productFullSizePreview").src = "products/" + vehicle + "/" + section + "_" + image + ".jpg";
  }
  else
    document.getElementById("productFullSizePreview").src = "thumbnailPlaceholder.jpg";
}