// JavaScript Document

function initNav(thename,theid) {
	initMaps('navtop','navabout','navinvest');
	if (thename != undefined && theid != undefined) {
		document.navname = thename;
		document.navid = theid;
		displayOn(document.navname,document.navid);
	}
}

function initMaps() {
	if (document.getElementById) {
		var mapIds = initMaps.arguments;    // pass string IDs of containing map elements
      	var i, j, area, areas;
      	for (i = 0; i < mapIds.length; i++) {
        	areas = document.getElementById(mapIds[i]).getElementsByTagName("area");

        	for (j = 0; j < areas.length; j++) {  // loop thru area elements
           		area = areas[j];
				area.navtype = area.getAttribute("navtype");
				area.navname = area.getAttribute("navname");
				
		   		if ( area.navtype == "hide" ) {
		   	   		area.onmouseout = hideNavEvent;
					area.onmouseover = showNavEvent;
		   		} else if ( area.navtype == "sub" ) {
	           		area.onmousedown = subNavSwap;    // set event handlers
	   	       		area.onmouseout = subNavSwap;
   	           		area.onmouseover = subNavSwap;
               		area.onmouseup = subNavSwap;
				} else {
	           		area.onmousedown = imgSwap;    // set event handlers
	   	       		area.onmouseout = imgSwap;
   	           		area.onmouseover = imgSwap;
               		area.onmouseup = imgSwap;
           		}
      		}
   		}
	}
}

function displayOn(navname,areaid) {
	var areas = document.getElementById(navname).getElementsByTagName("area");
	var elem = areas[areaid];
	var imgClass = navname;
    var coords = elem.coords.split(",");         // convert coords to clip
    var clipVal = "rect(" + coords[1] + "px " +
                            coords[2] + "px " +
                            coords[3] + "px " +
                            coords[0] + "px)";

    document.getElementById(imgClass + "Off").style.visibility = "visible";							
    document.getElementById(imgClass + "Roll").style.visibility = "hidden";
	
    imgStyle = document.getElementById(imgClass + "On").style;
    imgStyle.clip = clipVal;
    imgStyle.visibility = "visible";
	
	if (navname == 'navabout') {
		displayOn('navtop',0);
	} else if (navname == 'navinvest') {
		displayOn('navtop',2);
	}
}

// image swapping event handling
function imgSwap(evt) { 
   evt = (evt) ? evt : event;                   // equalize event models
   var elem = (evt.target) ? evt.target : evt.srcElement;
   
   var imgClass = elem.parentNode.name;         // get map element name
   var coords = elem.coords.split(",");         // convert coords to clip
   var clipVal = "rect(" + coords[1] + "px " +
                           coords[2] + "px " +
                           coords[3] + "px " +
                           coords[0] + "px)";
   var imgStyle;
   // alert(evt.type);
   switch (evt.type) {
      case "mousedown" :	  
         imgStyle = document.getElementById(imgClass + "On").style;
         imgStyle.clip = clipVal;
         imgStyle.visibility = "visible";
		/* debug code */
		/*
		var mp = getPositionedEventCoords(evt);
		var img = document.getElementById(imgClass + "Off");
		alert("img(x,y) = ("+findPosX(img) +","+ findPosY(img)+") :: (x,y) = ("+evt.clientX +","+ evt.clientY+") :: (x,y) = ("+mp.x +","+ mp.y+") :: (x,y) = ("+ document.body.scrollLeft +","+ document.body.scrollTop +") ");
		*/
		/* end debug code */
         break;
      case "mouseout" :
         document.getElementById(imgClass + "Roll").style.visibility = "hidden";
         // document.getElementById(imgClass + "On").style.visibility = "hidden";
		 if (elem.navtype == "show") {
		 	var mp = getPositionedEventCoords(evt);
			if (mp.y <= coords[1] || mp.x <= coords[0] || mp.x >= coords[2]) {
			 	hideSub(elem.navname);
				if (document.navname) {
					displayOn(document.navname,document.navid);	
				}
			}
		 }
         break;
      case "mouseover" :
         document.getElementById(imgClass + "Off").style.visibility = "visible";		 
         imgStyle = document.getElementById(imgClass + "Roll").style;
         imgStyle.clip = clipVal;
         imgStyle.visibility = "visible";
		 if (elem.navtype == "show") {
		 	showSub(elem.navname);
		 }	 
         break;
      case "mouseup" :
         document.getElementById(imgClass + "On").style.visibility = "hidden";
         // guarantee click in IE
         if (elem.click) {
             elem.click();
         }
         break;
   }
   evt.cancelBubble = true;
   return false;
}
function subNavSwap(evt) {
   	evt = (evt) ? evt : event;                   // equalize event models	
	imgSwap(evt);
	
	if (evt.type == "mouseout") {
		// check to see if we hide the sub nav.
		var elem = (evt.target) ? evt.target : evt.srcElement;
		if ( ! isInSideNav(elem.navname,evt) ) {
			hideSub(elem.navname);
			if (document.navname) {
				displayOn(document.navname,document.navid);	
			}
		}
	}
}
function showSub(subName) {
	var imgClass = subName;
	// alert("showSub " + imgClass);
	document.getElementById(imgClass + "Off").style.visibility = "visible";
	if (document.navname && subName != document.navname && document.navname != "navtop") {
		hideSub(document.navname);
	}	
}
function hideSub(subName) {
	var imgClass = subName;

    document.getElementById(imgClass + "Roll").style.visibility = "hidden";
	document.getElementById(imgClass + "On").style.visibility = "hidden";
	document.getElementById(imgClass + "Off").style.visibility = "hidden";
}
function isInSideNav(navname,evt) {
	var areas = document.getElementById(navname).getElementsByTagName("area");
	var coords, area;
	for (var i =0; i<areas.length; i++) {
		area = areas[i];
		if (area.navtype == "hide") {
			coords = area.coords.split(",");
			break;
		}
	}
	if (coords) {
		var mousePos = getPositionedEventCoords(evt);
/*
		alert (" mousePos.x: " + mousePos.x +
			   " mousePos.y: " + mousePos.y +
			   " coords: " + coords[0] + " " + coords[1] + 
			   "  " + coords[2] + " " + coords[3] );
*/		
		if (mousePos.x >= coords[0] && mousePos.x < coords[2] && mousePos.y >= coords[1] && mousePos.y < coords[3]) {
			return true;
		} else {
			return false;
		}
	} else {
		alert("error in isOutSideNav() " + area.coords);
		return false;
	}
}
function hideNavEvent(evt) {
	//     alert("hidNavEvent");
   	evt = (evt) ? evt : event;                   // equalize event models
   	var elem = (evt.target) ? evt.target : evt.srcElement;
	if (elem.navname) {
		if ( ! isInSideNav(elem.navname,evt) ) {
			hideSub(elem.navname);
			if (document.navname) {
				displayOn(document.navname,document.navid);	
			}
		}
	}
	evt.cancelBubble = true;
}
function showNavEvent(evt) {
	//     alert("hidNavEvent");
   	evt = (evt) ? evt : event;                   // equalize event models
   	var elem = (evt.target) ? evt.target : evt.srcElement;

	if ( elem.navname) {
	   showSub(elem.navname);
	}
	evt.cancelBubble = true;
}
function getPositionedEventCoords(e) {	

	if (!e) var e = window.event;

    var elem = (e.target) ? e.target : e.srcElement;
    var img = document.getElementById(elem.parentNode.name + "Off");
		 	
    var coords = {x:0, y:0};
	
	if (e.pageX || e.pageY) {
		coords.x = e.pageX - findPosX(img);
		coords.y = e.pageY - findPosY(img);
	} else if (e.offsetX || e.offsetY) {
		coords.x = e.offsetX;
		coords.y = e.offsetY;
	}
    e.cancelBubble = true;
    return coords;
}
function findPosX(obj)
{
	var curleft = 0;
	if (obj.offsetParent)
	{
		while (obj.offsetParent)
		{
			curleft += obj.offsetLeft
			obj = obj.offsetParent;
		}
	}
	else if (obj.x)
		curleft += obj.x;
	return curleft;
}

function findPosY(obj)
{
	var curtop = 0;
	if (obj.offsetParent)
	{
		while (obj.offsetParent)
		{
			curtop += obj.offsetTop
			obj = obj.offsetParent;
		}
	}
	else if (obj.y)
		curtop += obj.y;
	return curtop;
}