var bIE = document.all ? true : false;  
var bSafari = navigator.userAgent.toLowerCase().indexOf("safari") != -1;
var aNavOverImages = new Array("experience", "security", "reliability", "connected", "integrated", "discoverable", "deployable", "mobile");
var sCurrentRO = "base";
var sSection; //set in body on sub pages

var nInterval;
var nOpacity; 
var sCurrentFade;

//add code nav initialize code to onload event
if (document.getElementById) {
	addEvent(window, "onload", navInit);
	preloadImages();
}

/*********************************************
 * preload navigation off images used in rollover
 *********************************************/	  
function preloadImages() {  
	var iImage = new Image();
	for (var i=0; i < aNavOverImages.length; i++) {
		iImage.src = "/taiwan/msdn/windowsvista/images/shared/nav_" + aNavOverImages[i] + "_on.jpg";
	}  
}

/*********************************************
 * initialize the navigation
 *********************************************/	
function navInit() {	

	if (document.getElementById) {

		//start mouse tracking for carat movement
		if (! bIE) {
			document.captureEvents(Event.MOUSEMOVE);
		}
		document.onmousemove = getMouseXY;	


		//add rollover functionality to each nav button
		for (var i=0; i < aNavOverImages.length; i++) {
		
			var oLink = document.getElementById("vdc_" + aNavOverImages[i]);

			oLink.onmouseover = function() {				

				var sID = this.id.substring(4, this.id.length); 
				clearInterval(nInterval);			
			
				
					hideRO();

					if (sCurrentRO != sID) {				
					
						//update nav states
						this.firstChild.src = "/taiwan/msdn/windowsvista/images/shared/nav_" + sID + "_on.jpg";			
						if (sCurrentRO != "base") {
							document.getElementById("vdc_" + sCurrentRO).firstChild.src = "/taiwan/msdn/windowsvista/images/shared/nav_" + sCurrentRO	 + "_off.jpg";	
						}
		
						document.getElementById("ro_base").style.display = "none";				
						document.getElementById("ro_" + sCurrentRO).style.display = "none";										
						
						if (document.getElementById("ro_" + sID).style.display != "block") {
							document.getElementById("ro_" + sID).style.display = "block";
							document.getElementById("roContentHit").style.display = "block";	

							//fade for modern browsers except safari
							if (! bSafari) {
															
								sCurrentFade = sID;
								roImg = document.getElementById("ro_" + sCurrentFade + "_img").style;
								nOpacity = 0;
	
								roImg.filter = "alpha(opacity=0)"; 
								roImg.KhtmlOpacity = nOpacity;            
								roImg.MozOpacity = nOpacity;              
								roImg.opacity = nOpacity;							
								
								nInterval = setInterval(fadeUpRO, 60);								
							}
						}

						document.getElementById("ro_" + sID).onmouseover = hideRO;	
						document.getElementById("roContentHit").onmouseover = hideRO;
	
						sCurrentRO = sID;				
					}
			}
		}  	
		
		//mouseout functionality to surrounding areas
		document.getElementById('header_shim_left').onmouseover = hideRO;
		document.getElementById('vdcHeaderLogo').onmouseover = hideRO;	
		document.getElementById('vdcImagery').onmouseover = hideRO;		
	}	
}

/*********************************************
 * set the opacity of the rollover image
 *********************************************/	
function setOpacity() {

	var oImg = document.getElementById("ro_" + sCurrentFade + "_img").style;
 	oImg.filter = "alpha(opacity=" + nOpacity + ")"; 
	oImg.KhtmlOpacity = (nOpacity / 100);            
	oImg.MozOpacity = (nOpacity / 100);              
	oImg.opacity = (nOpacity / 100);
	
	//workaround to prevent mozilla opacity stutter on reaching 100%	
	if (! document.all) {
		document.fDebug.elements[0].value = (nOpacity / 100);
	}	
}

/*********************************************
 * control fade up the rollover image
 *********************************************/	
function fadeUpRO() {

	if (nOpacity < 100) {
		nOpacity += 10;
		setOpacity();
	} else {
		clearInterval(nInterval);
	}
}

/*********************************************
 * hide the currently displayed nav rollover item
 *********************************************/	
function hideRO() {
	if (sCurrentRO != "base") {
		document.getElementById("ro_" + sCurrentRO).style.display = "none";	
		document.getElementById("vdc_" + sCurrentRO).firstChild.src = "/taiwan/msdn/windowsvista/images/shared/nav_" + sCurrentRO	 + "_off.jpg";		
		document.getElementById("roContentHit").style.display = "none";
		document.getElementById("ro_base").style.display = "block";
		document.getElementById("vdcContentCell").style.backgroundImage = "url(images/shared/back_content.jpg)";																										
		document.getElementById("vdcContentCell").style.backgroundColor = "transparent";		
		sCurrentRO = "base";
	}
}
 

/*********************************************
 * get mouse coordiates
 *********************************************/	
function getMouseXY(e) {

	var nX, nY;
	var nYTop = 238 + 65;
	var nYBottom = 319 + 65;
	var nYLeft = 207;
	var nYRight = 779;
	
	if (bIE){
		nX = event.clientX + document.body.scrollLeft;
		nY = event.clientY + document.body.scrollTop;
	} else {
		nX = e.pageX;
		nY = e.pageY;
	}
	
	//offset y position if page scrolled
	var nScrollOffset;
	if (document.documentElement.scrollTop) {		
		nScrollOffset = document.documentElement.scrollTop;
		if ((nScrollOffset) && (nScrollOffset > 0)) {		
			if (document.all) {
				nY = nScrollOffset + nY;
			} else {
				nYTop -= nScrollOffset;
				nYBottom -= nScrollOffset;				
				nY -= nScrollOffset;
			}
		}
	}
	
	//move carat to match position, within range	
	if ((nY >= nYTop) && (nY <= nYBottom)) {
		if ((nX >= nYLeft) && (nX <= nYRight)) {
			document.getElementById('vdcCarat').style.visibility = "visible";
			document.getElementById('vdcCarat').style.left = (nX - 7) + "px";				
		} else {
			document.getElementById('vdcCarat').style.visibility = "hidden";
		}
	} else {
			document.getElementById('vdcCarat').style.visibility = "hidden";	
	}
	return true;
}	

/*********************************************
 * bind an event and method
 *********************************************/	
function addEvent(oTarget, sType, fpDest) {
	var oOldEvent = oTarget[sType];
	if (typeof oOldEvent != "function") {
		oTarget[sType] = fpDest;
	} else {
		oTarget[sType] = function(e) {
			oOldEvent(e);
			fpDest(e);
		}
	}
}