// preaload images for the left menu
var FCX = new Image(100,100);
FCX.src = "images/FcxIcon.gif";

var FCX_hover = new Image(100,100);
FCX_hover.src = "images/FcxIcon_hover.gif";

var Civic = new Image();
Civic.src = "images/CivicIcon.gif";

var Civic_hover = new Image();
Civic_hover.src = "images/CivicIcon_hover.gif";

var Insight = new Image();
Insight.src = "images/InsightIcon.gif";

var Insight_hover = new Image();
Insight_hover.src = "images/InsightIcon_hover.gif";

var Formula1 = new Image();
Formula1.src = "images/Formula1Icon.gif";

var Formula1_hover = new Image();
Formula1_hover.src = "images/Formula1Icon_hover.gif";

// function for highlighted left menus
function ToggleLeftMenuView (){	
	switch (this.id){
		case "divCivic" : this.getElementsByTagName("img")[0].src = Civic_hover.src;
											break;
		case "divFCX" :   this.getElementsByTagName("img")[0].src = FCX_hover.src;
											break;						
		case "divInsight" : this.getElementsByTagName("img")[0].src = Insight_hover.src;
											break;
		case "divFormula1" : this.getElementsByTagName("img")[0].src = Formula1_hover.src;
											break;
	}
	
	// show the corresponding highlight image on the center display area
	var strDivName = this.id;
	strDivName = strDivName.substr(strDivName.indexOf("v")+1, strDivName.length);
	if (document.getElementById(strDivName)){		
		var objElem = document.getElementById(strDivName);
		objElem.style.display = "block";	
	}
}

// function for original left menus
function NormalLeftMenuView (){	
	switch (this.id){
		case "divCivic" : this.getElementsByTagName("img")[0].src = Civic.src;
											break;
		case "divFCX" :   this.getElementsByTagName("img")[0].src = FCX.src;
											break;						
		case "divInsight" : this.getElementsByTagName("img")[0].src = Insight.src;
											break;
		case "divFormula1" : this.getElementsByTagName("img")[0].src = Formula1.src;
											break;
	}
	
	// hide corresponding hightlight image on the center display area
	var strDivName = this.id;
	strDivName = strDivName.substr(strDivName.indexOf("v")+1, strDivName.length);
	if (document.getElementById(strDivName)){		
		var objElem = document.getElementById(strDivName);
		objElem.style.display = "none";	
	}
}

function LoadTriggers (){
	var objParentElem = document.getElementById("pnlLeftMenu");
	var objElems = objParentElem.getElementsByTagName("div");
	
	for (var i = 0; i < objElems.length; i++){
		objElems[i].onmouseover = ToggleLeftMenuView;
		objElems[i].onmouseout = NormalLeftMenuView;
	}
}

window.onload = LoadTriggers;