var rolledID = "";
var clickedID = "";
var name = "";
var rolledOnItem;

var clickedIDSubs = new Array();
clickedIDSubs[0] = ["serviceMenuLink","serviceMenu"];
clickedIDSubs[1] = ["popDestLink","popDestMenu"];
clickedIDSubs[2] = ["buyPassLink", "buyPassMenu"];
clickedIDSubs[3] = ["groupDiscLink", "groupDiscMenu"];
clickedIDSubs[4] = ["rideshareLink","rideshareMenu"];
clickedIDSubs[5] = ["riderProgsLink","riderProgsMenu"];
clickedIDSubs[6] = ["safetySecurityLink","safetySecurityMenu"];
clickedIDSubs[7] = ["improvingTransitLink","improvingTransitMenu"];
clickedIDSubs[8] = ["otherTransLink","otherTransMenu"];
clickedIDSubs[9] = ["aboutUsLink","aboutUsMenu"];

//check to see if rolledOnItem is one of array of subitems

var subMenuArray = new Array();
subMenuArray[0] = "serviceMenu";
subMenuArray[1] = "popDestMenu";
subMenuArray[2] = "buyPassMenu";
subMenuArray[3] = "groupDiscMenu";
subMenuArray[4] = "rideshareMenu";
subMenuArray[5] = "riderProgsMenu";
subMenuArray[6] = "safetySecurityMenu";
subMenuArray[7] = "improvingTransitMenu";
subMenuArray[8] = "aboutUsMenu";

var mainMenuItems = new Array();

mainMenuItems[0] = 'serviceMenuLink';
mainMenuItems[1] = 'popDestLink';
mainMenuItems[2] = 'buyPassLink';
mainMenuItems[3] = 'groupDiscLink';
mainMenuItems[4] = 'rideshareLink';
mainMenuItems[5] = 'riderProgsLink';
mainMenuItems[6] = 'safetySecurityLink';
mainMenuItems[7] = 'improvingTransitLink';
mainMenuItems[8] = 'otherTransLink';
mainMenuItems[9] = 'aboutUsLink';
mainMenuItems[10] = 'howRideLink';

function clearAll(){

  for (var i=0; i< mainMenuItems.length; i++){
    clearHighlight(mainMenuItems[i]);
  }
}

function handleEvent(evt, name, sub){
  if (evt == 'over'){
    if(clickedID != name){
      setHighlight(name);
    }

  } else if (evt == 'out'){
    if(clickedID != name){
      clearHighlight(name);
    }

  } else if (evt == 'click'){
    handleClick(evt, name, sub);
  }
}

function handleClick(evt, name, sub){
  if(clickedID == ""){
    openSub(sub);
    setHighlight(name);
    clickedID = name;
  }else if (clickedID != name){
    for (var i=0; i < clickedIDSubs.length; i++){
      if (clickedID == clickedIDSubs[i][0]){
        closeSub(clickedIDSubs[i][1]);
      }
    }
    clearHighlight(clickedID);
    openSub(sub);
    //need to open sub assoc with name
    setHighlight(name);
    clickedID = name;

  } else if (clickedID == name){
    closeSub(sub);
    clearHighlight(name);
    clickedID = "";
  }
}

function setHighlight(link, itemType){
    rolledOnItem = link;

	if (itemType == "sub"){
			document.getElementById(link).style.backgroundColor = '#039';
			document.getElementById(link).style.color = '#fff';
	}else{
		if (link == 'howRideLink' || link == "otherTransLink"){
			document.getElementById(link).style.backgroundImage = 'none';
			document.getElementById(link).style.backgroundColor = '#039';
			document.getElementById(link).style.color = '#fff';
		}else{

			document.getElementById(link).style.backgroundImage = 'url(../Images/leftNavArrowHL.gif)';
			document.getElementById(link).style.backgroundColor = '#039';
			document.getElementById(link).style.color = '#fff';
			document.getElementById(link).style.backgroundRepeat = 'no-repeat';
		}
	}
}

function clearHighlight(link, itemType){
	if (itemType == "sub"){
		document.getElementById(link).style.backgroundColor = '#CCE1FF';
		document.getElementById(link).style.color = '#039';
	} else{
		if (link == 'howRideLink' || link == "otherTransLink"){
			document.getElementById(link).style.backgroundImage = 'none';
			document.getElementById(link).style.backgroundColor = '#99CCFF';
			document.getElementById(link).style.color = '#039';
			document.getElementById(link).style.backgroundRepeat = 'no-repeat';
		}else {
			document.getElementById(link).style.backgroundImage = 'url(../Images/leftNavArrow.gif)';
			document.getElementById(link).style.backgroundColor = '#99CCFF';
			document.getElementById(link).style.color = '#039';
			document.getElementById(link).style.backgroundRepeat = 'no-repeat';
		}
	}
}

function openSub(sub){
	document.getElementById(sub).style.display = 'block';
}

function closeSub(sub){
	document.getElementById(sub).style.display = 'none';
}