// mainTemplate.js

		//Global Variables
		var CONTENTID = "transContent";  
		var FADEDIV   = "color";			
			
		//Variable used to determine if the fade function are running
   		var isRunning = false;				
			
		//preload images
		hdrOne       = new Image();	
		hdrOne.src   = "/en_US/Media/images/Content/Pictorial/Events/105th_Coverage/template/img_topnav_bkg_1.jpg";
		hdrTwo       = new Image();
		hdrTwo.src   = "/en_US/Media/images/Content/Pictorial/Events/105th_Coverage/template/img_topnav_bkg_2.jpg";
		hdrThree     = new Image();
		hdrThree.src = "/en_US/Media/images/Content/Pictorial/Events/105th_Coverage/template/img_topnav_bkg_3.jpg";
		hdrFour      = new Image();
		hdrFour.src  = "/en_US/Media/images/Content/Pictorial/Events/105th_Coverage/template/img_topnav_bkg_4.jpg";
		hdrFive      = new Image();
		hdrFive.src  = "/en_US/Media/images/Content/Pictorial/Events/105th_Coverage/template/img_topnav_bkg_5.jpg";
		
			
		//rotateImage variables
		HEADERSIMGARRAY  = new Array(hdrOne,hdrTwo,hdrThree,hdrFour,hdrFive);
		var ROTATINGIMAGEID = "rotatingImage";
		var NEXTIMAGEPOS = 1;
			
		//Function fadeImage
		function fadeImage()
		{					
								
			//Don't execute when clicking image that
			//is already turned on
			if(!isRunning)
			{			
				setLock(true);						
				fade(FADEDIV);
			}		
		}//end fadeImage
			
		//function fade
		function fade(displayArea)
		{
			//Set variables
		    var colorObject = document.getElementById(displayArea);
		    var backgroundColorVariable = "#000000"; //Set main background fade in color
		    var startOpacity = 0;
		        
		    //Init fade process
		    colorObject.style.backgroundColor = backgroundColorVariable;
		    setOpacity(colorObject, startOpacity);
		    colorObject.style.display = "block"; //turn on color div		
		    fadeInHelper(displayArea, startOpacity);
		}//end fade
		
		//Function fadeInHelper
		function fadeInHelper(displayArea, opacity)
		{
			//set variables				
		    var colorObject = document.getElementById(displayArea);
		    var endOpacity = 100;
		    var increaseValue = 5;
		    var timeoutSpeed = 10;
		        
		    if(opacity <= endOpacity) {
		    	setOpacity(colorObject, opacity);
		        opacity += increaseValue;
		        window.setTimeout("fadeInHelper('" + displayArea + "'," + opacity + ");", timeoutSpeed);
		  	}
		    else {		           
		    	if(rotateImage())
				{						
					fadeOutHelper(displayArea, endOpacity);
				}					
		 	}
		}//end fadeInHelper					
					
		//Function fadeOutHelper
		function fadeOutHelper(displayArea, opacity)
		{
			//set Variables				
		    var colorObject = document.getElementById(displayArea);
		    var endOpacity = 0;
		    var decreaseValue = 5;
		    var timeoutSpeed = 10;
		        
		    if (opacity >= endOpacity) {
		    	setOpacity(colorObject, opacity);
		        opacity -= decreaseValue;
		        window.setTimeout("fadeOutHelper('" + displayArea + "'," + opacity + ");", timeoutSpeed);
		  	}
		    else {
		    	colorObject.style.display = "none"; //turn off color div 		          
				setLock(false);    
		  	}
		}//end fadeOutHelper
		
		//Function setOpacity
		function setOpacity(obj, opacity) 
		{	
			//set variables
		    var maxOpacity = 100;
		    var secondaryOpacity = 99.999;
		        
		    opacity = (opacity == maxOpacity) ? secondaryOpacity : opacity;
		        
		    // IE/Win
		    obj.style.filter = "alpha(opacity:" + opacity + ")";
		      
		    // Safari<1.2, Konqueror
		    obj.style.KHTMLOpacity = opacity / maxOpacity;
		        
		    // Older Mozilla and Firefox
		    obj.style.MozOpacity = opacity / maxOpacity;
		        
		    // Safari 1.2, newer Firefox and Mozilla, CSS3
		    obj.style.opacity = opacity / maxOpacity;
		}//end setOpacity functions
			
		//Function setLock
		function setLock(lock)
		{       
			isRunning = lock;
		}//end setLock function		
			
		//Function rotateImage
		function rotateImage()
		{					
			if(document.getElementById(ROTATINGIMAGEID))
			{
				var imageObject = document.getElementById(ROTATINGIMAGEID);	
				var arrayLength = HEADERSIMGARRAY.length;
					
				//Set background image													
				imageObject.style.background = 'url(' + HEADERSIMGARRAY[NEXTIMAGEPOS].src + ') top left no-repeat';
					
				//Set next position
				if(NEXTIMAGEPOS >= (arrayLength - 1))						
					NEXTIMAGEPOS = 0;					
				else 						
					NEXTIMAGEPOS ++;					
			}				
			return true;				
		}//end rotateImage function	
			
		//Function init
		function init()
		{
			var rotateImageInterval = window.setInterval("fadeImage()", 12272);
		}//end function init			
			
		function addLoadEvent(func) { 
		 
		  var oldonload = window.onload; 
		  if (typeof window.onload != 'function') { 
		    window.onload = func; 
		  } else { 
		    window.onload = function() { 
		      if (oldonload) { 
		        oldonload(); 
		      } 
		      func(); 
		    } 
		  } 
		}	
	
		addLoadEvent(init);	// run init onLoad