// JavaScript Document

// define some initial variables
var numberOfHeadings = 0;
var currentHeading = 0;
var firstTimeThrough = true;

/*************************************/
/* intialize the thumbnail code      */
/*************************************/
var divHolderOldX=0; // this variable will keep track of where the div is on the x axis
var divHolderNewX=0; // tell us what the new value of the x axis should be
var oldSliderX=0;
var newSliderX=0;
var sliderWidth=197; // this should always be the width in pixels used by the css for the slider container - the width of the knob
var thumbCounter; // this variable will tell us how many thumbnails there are;
var currentThumb=1; // tell us which thumbnail is currently being viewed;
var thumbWidth = new Array();// create an array for the width of each image.
var thumbSpacing = 22; // must match the right padding used in the style sheet for the "#thumbHolder a{" declaration
var myElementsEffects;
var oldStep = 0;
window.addEvent('domready', function() {
	loadXML2();
	// start the actual code here
	myElementsEffects = new Fx.Elements($$('div#thumbHolder'));
});

/**********************************/
/* end of thumbnail initialization*/
/**********************************/

/**********************************/
/* Start of Background fader code */
/**********************************/
// function to load the xml
function loadXML()
{
	// prevent xml caching
	var timestamp = new Date();
	var uri = "xml/home.xml";
	var uniqueURI = uri + (uri.indexOf("?") > 0 ? "&" : "?")+ "timestamp="+ timestamp.getTime();
	try
	{
		if (window.ActiveXObject)
		{
			var errorHappendHere = "Check Browser and security settings";
			xmlDoc = new ActiveXObject("Microsoft.XMLDOM");
			xmlDoc.async=false;
			xmlDoc.load(uniqueURI);
			getHomeBkgd();
		}
		else if(window.XMLHttpRequest)
		{
			var errorHappendHere = "Error handling XMLHttpRequest request";
			var d = new XMLHttpRequest();
			d.open("GET", uniqueURI, false);
			d.send(null);
			xmlDoc=d.responseXML;
			getHomeBkgd();
		} else {
			var errorHappendHere = "Error.";
			xmlDoc = document.implementation.createDocument("","",null);
			xmlDoc.async=false;
			xmlDoc.load(uniqueURI);
			xmlDoc.onload=getHomeBkgd();
		}
	}	
	catch(e)
	{
		alert(errorHappendHere);
	}
}

//function to load the images
// we do not recommend editing this function
var getHomeBkgd = function getHomeBkgd()
{
	var imageMode=xmlDoc.getElementsByTagName("node")[0].getAttribute('imageMode');
	// check to see which image mode is set
	if(imageMode=="rotate"){
		// array of all of the image paths to be loaded
		var images=new Array;
		// variable to build all of the heading images within the innerHTML
		var topHeadingCode="";
		// create an object with all of the image nodes
		var xmlTopNodes=xmlDoc.getElementsByTagName("node")[0].getElementsByTagName("homeHeading"); 
		// find out how many top nodes there are
		var numTopNodes=xmlTopNodes.length; 
		// assign the number of nodes found to a global level variable
		numberOfHeadings = numTopNodes;
		// loop through the images
		for(var x=0; x<numberOfHeadings; x++){
			// get the value of the image source
			var newImage = xmlDoc.getElementsByTagName("node")[0].getElementsByTagName("homeHeading")[x].getElementsByTagName("location")[0].childNodes[0].nodeValue;
			// get the value of the image alt text
			var newAlt = xmlDoc.getElementsByTagName("node")[0].getElementsByTagName("homeHeading")[x].getElementsByTagName("alt")[0].childNodes[0].nodeValue;
			// add to the final code
			topHeadingCode+='<img src="' + newImage + '" border="0" id="heading'+x+'" alt="'+newAlt+'" /><br />';	
			// populate the images array
			images[x]=newImage;
		}
		// set the global currentProfile number to the randome number generated
		currentHeading = 0;
		// write div to contain loading image
		var loadingText = '<div id="backgroundLoader"><img src="images/homeBkgd/ajax-loader.gif" alt="loading" width="32" height="32" id="loadingAnimation" /></div>';
		// put everything together and create the image
		document.getElementById('headingContainer').innerHTML = loadingText+topHeadingCode;
		document.getElementById('learnMoreLink').href=xmlDoc.getElementsByTagName("node")[0].getElementsByTagName("homeHeading")[0].getElementsByTagName("href")[0].childNodes[0].nodeValue;
		// Preloader of large images
		new Asset.images(images, {
			onComplete: function(){
				timedCount();
			}
		});
	}else{  // this else fires off if imageMode is set to refresh
		// create an object with all of the image nodes
		var xmlTopNodes=xmlDoc.getElementsByTagName("node")[0].getElementsByTagName("homeHeading"); 
		// find out how many top nodes there are
		var numTopNodes=xmlTopNodes.length; 
		// Pull in a random number based on the number of nodes
		var randomNumber=Math.floor(Math.random()*numTopNodes);
		// get the value of the image source
		var newImage = xmlDoc.getElementsByTagName("node")[0].getElementsByTagName("homeHeading")[randomNumber].getElementsByTagName("location")[0].childNodes[0].nodeValue;
		// get the value of the image alt text
		var newAlt = xmlDoc.getElementsByTagName("node")[0].getElementsByTagName("homeHeading")[randomNumber].getElementsByTagName("alt")[0].childNodes[0].nodeValue;
		// add to the final code
		topHeadingCode+='<img src="' + newImage + '" border="0" id="headingRefresh" alt="'+newAlt+'" /><br />';	
		// add the html to the page
		document.getElementById('headingContainer').innerHTML = topHeadingCode;
		document.getElementById('learnMoreLink').href=xmlDoc.getElementsByTagName("node")[0].getElementsByTagName("homeHeading")[randomNumber].getElementsByTagName("href")[0].childNodes[0].nodeValue;
	}
}
// starting z-index
var counter=2;
// timed loop for heading images
function timedCount()
{	
	// determine browser type
	var browser=navigator.appName;
	var transitionDuration = 1500;// set timing for transitions
	var transitionTiming = 8000; // set the time in between transitions
	// redefine the learn more button's href value
	document.getElementById('learnMoreLink').href=xmlDoc.getElementsByTagName("node")[0].getElementsByTagName("homeHeading")[currentHeading].getElementsByTagName("href")[0].childNodes[0].nodeValue;
	// time in between loops
	setTimeout("timedCount()",transitionTiming);
	// determin which heading to work with
	var newId = "heading" + currentHeading;
	// make sure opacity starts at 0
	if (browser=="Netscape"){
		document.getElementById(newId).style.opacity = '0';
	}else if(browser=="Microsoft Internet Explorer"){
		document.getElementById(newId).style.filter='alpha(opacity=00)';
	}
	// set the z index of the new heading to be on top
	document.getElementById(newId).style.zIndex=counter;
	// only chang the first heading if this is the first time through the loop
	if(firstTimeThrough){
		var myElementsEffects = new Fx.Elements($$('#headingContainer img#heading0'),{duration: transitionDuration});
		myElementsEffects.start({
			'0': { //let's change the first element's opacity
				'opacity': [0,1]
			}
		});
		firstTimeThrough = false;
	}else{
		// hide loader graphic
		document.getElementById('loadingAnimation').style.display = "none";
		// set the new heading's opacity from 0 to 1
		var myElementsEffects = new Fx.Elements($$('#headingContainer img#heading'+currentHeading),{duration: transitionDuration});
		myElementsEffects.start({
			'0': { //change the headings's opacity
				'opacity': [0,1]
			}
		});
	}
	// reset the current Heading value appropriately if it reaches the end of the images or not
	if(currentHeading == numberOfHeadings-1){
		currentHeading = 0;
	}else{
		currentHeading++;	
	}
	counter++;
}

var getNav = function getImages()
{
	getHomeHeadings();
}

/*************************************************************************/
/* functions for the thumbnail section of the homepage                   */
/*************************************************************************/

function loadXML2()
{
var timestamp = new Date();
var uri = "xml/imageGallery.xml";
var uniqueURI = uri + (uri.indexOf("?") > 0 ? "&" : "?")+ "timestamp="+ timestamp.getTime();
	try
	{
		if (window.ActiveXObject)
		{
			var errorHappendHere = "Check Browser and security settings";
			xmlDoc2 = new ActiveXObject("Microsoft.XMLDOM");
			xmlDoc2.async=false;
			xmlDoc2.onreadystatechange=verify;
			xmlDoc2.load(uniqueURI);
			getImages();
		}
		else if(window.XMLHttpRequest)
		{
			var errorHappendHere = "Error handling XMLHttpRequest request";
			var d = new XMLHttpRequest();
			d.open("GET", uniqueURI, false);
			d.send(null);
			xmlDoc2=d.responseXML;
			getImages();
		} else {
			var errorHappendHere = "Error.";
			xmlDoc2 = document.implementation.createDocument("","",null);
			xmlDoc2.onreadystatechange=verify;
			xmlDoc2.async=false;
			xmlDoc2.load(uniqueURI);
			xmlDoc2.onload=getImages();
		}
	}	
	catch(e)
	{
		alert(errorHappendHere);
	}
}
function verify()
{
  // 0 Object is not initialized
  // 1 Loading object is loading data
  // 2 Loaded object has loaded data
  // 3 Data from object can be worked with
  // 4 Object completely initialized
  if (xmlDoc2.readyState != 4)
  {
    return false;
  }
}

var getImages = function getImages()
{
	// Make left and right buttons visible if javascript is on
	document.getElementById('leftArrow').style.display = "block";
	document.getElementById('rightArrow').style.display = "block";
	var xmlImages=xmlDoc2.getElementsByTagName("node")[0].getElementsByTagName("image");
	var numImages=xmlImages.length; // find out how many images there are
	thumbCounter = numImages; // assign the number of images to a higher level variable for use in other functions
	var thumbMaker; // assign all img sourcecode to this variable and use it in innerHTML.
	var divWidth, divHeight; // decide how tall and wide to make the div holding the thumbnails
	var imageSrc, imageAlt, imageLinkPath;
	for(var i=0; i<numImages; i++){
		imageSrc = xmlDoc2.getElementsByTagName("image")[i].getElementsByTagName("source")[0].childNodes[0].nodeValue;
		imageAlt = xmlDoc2.getElementsByTagName("image")[i].getElementsByTagName("altText")[0].childNodes[0].nodeValue;
		imageLinkPath = xmlDoc2.getElementsByTagName("image")[i].getElementsByTagName("linkPath")[0].childNodes[0].nodeValue;
		thumbWidth[i] = xmlDoc2.getElementsByTagName("image")[i].getElementsByTagName("width")[0].childNodes[0].nodeValue;
		if(i == 0){
			thumbMaker = '<a href="javascript:profileBuilder(\''+i+'\');"><img border="0" src="'+imageSrc+'" id="image' + i +'" alt="'+ imageAlt +'" /></a>';
			divWidth = parseInt(xmlDoc2.getElementsByTagName("image")[i].getElementsByTagName("width")[0].childNodes[0].nodeValue)+thumbSpacing;
		}else{
			thumbMaker = thumbMaker + '<a href="javascript:profileBuilder(\''+i+'\');"><img border="0" src="'+imageSrc+'" id="image' + i +'" alt="'+ imageAlt +'" /></a>';
			divWidth = divWidth + (parseInt(xmlDoc2.getElementsByTagName("image")[i].getElementsByTagName("width")[0].childNodes[0].nodeValue)+thumbSpacing);
		}

	}
	// set widths and height of containers
	document.getElementById('thumbHolder').style.height = xmlDoc2.getElementsByTagName("image")[0].getElementsByTagName("height")[0].childNodes[0].nodeValue + "px";
	document.getElementById('thumbHolder').style.width = divWidth+"px";
	// add the thumbnails to the page
	document.getElementById('thumbHolder').innerHTML = thumbMaker;
	// start the left button out as semi-invisible
	var browser=navigator.appName;
	if (browser=="Netscape"){
		//alert("in firefox");
		document.getElementById('leftLink').style.opacity = '.25';
	}else if(browser=="Microsoft Internet Explorer"){
		//alert("in IE");
		document.getElementById('leftLink').style.filter='alpha(opacity=25)';
	}
	// create the first profile
	profileBuilder(0);
}

function checkRightButton(){
	var browser=navigator.appName;
	if(currentThumb < thumbCounter-4){
		currentThumb++;
		divHolderNewX = parseInt(divHolderOldX) - (parseInt(thumbWidth[currentThumb-1])+thumbSpacing);
		// assign new value for newSliderX
		newSliderX = sliderWidth * (parseInt(currentThumb-1) / parseInt(thumbCounter-1));
		if(currentThumb == thumbCounter){
			newSliderX=sliderWidth+1;
		}
		// slide the images
		myElementsEffects.start({
			'0': { //let's change the first element's position
				'left': [divHolderOldX,divHolderNewX]
			}
		});
		// reset the old Value of x after everything else is done
		divHolderOldX = divHolderNewX;
		oldSliderX = newSliderX;
	}
	// change visibility of buttons as needed 
	// the 4 in the line below is the number of thumbnails showing - 1
	if (currentThumb == thumbCounter-4){
		if (browser=="Netscape"){
			document.getElementById('leftLink').style.opacity = '1';
			document.getElementById('rightLink').style.opacity = '.25';
		}else if(browser=="Microsoft Internet Explorer"){
			//alert("in IE");
			document.getElementById('leftLink').style.filter='alpha(opacity=100)';
			document.getElementById('rightLink').style.filter='alpha(opacity=25)';
		}
	}else if (currentThumb != 0){
		if (browser=="Netscape"){
			//alert("in firefox");
			document.getElementById('leftLink').style.opacity = '1';
			document.getElementById('rightLink').style.opacity = '1';
		}else if(browser=="Microsoft Internet Explorer"){
			//alert("in IE");
			document.getElementById('leftLink').style.filter='alpha(opacity=100)';
			document.getElementById('rightLink').style.filter='alpha(opacity=100)';
		}
	}else{
		if (browser=="Netscape"){
			//alert("in firefox");
			document.getElementById('leftLink').style.opacity = '.25';
			document.getElementById('rightLink').style.opacity = '1';
		}else if(browser=="Microsoft Internet Explorer"){
			//alert("in IE");
			document.getElementById('leftLink').style.filter='alpha(opacity=25)';
			document.getElementById('rightLink').style.filter='alpha(opacity=100)';
		}
	}
}

function checkLeftButton(){
	var browser=navigator.appName;
	if(currentThumb > 1){
		currentThumb--;
		divHolderNewX = parseInt(divHolderOldX) + (parseInt(thumbWidth[currentThumb-1])+thumbSpacing);
		// assign new value for newSliderX
		newSliderX = sliderWidth * (parseInt(currentThumb-1) / parseInt(thumbCounter-1));
		if(currentThumb == 0){
			newSliderX=0;
		}
		// start image slider
		myElementsEffects.start({
			'0': { //let's change the first element's left position
				'left': [divHolderOldX,divHolderNewX]
			}
		});
		// reset the old Value of x after everything else is done
		divHolderOldX = divHolderNewX;
		oldSliderX = newSliderX;
	}
	// change visibility of buttons as needed
	if (currentThumb == 1){
		if (browser=="Netscape"){
			//alert("in firefox");
			document.getElementById('leftLink').style.opacity = '.25';
			document.getElementById('rightLink').style.opacity = '1';
		}else if(browser=="Microsoft Internet Explorer"){
			//alert("in IE");
			document.getElementById('leftLink').style.filter='alpha(opacity=25)';
			document.getElementById('rightLink').style.filter='alpha(opacity=100)';
		}
	}else{
		if (browser=="Netscape"){
			//alert("in firefox");
			document.getElementById('leftLink').style.opacity = '1';
			document.getElementById('rightLink').style.opacity = '1';
		}else if(browser=="Microsoft Internet Explorer"){
			//alert("in IE");
			document.getElementById('leftLink').style.filter='alpha(opacity=100)';
			document.getElementById('rightLink').style.filter='alpha(opacity=100)';
		}
	}
}


function profileBuilder(profileNum){
	profileNum = parseInt(profileNum);
	var profileBuilder=""; // variable to put together all of the needed html for the thumbnail content
	var profileAltText = xmlDoc2.getElementsByTagName("image")[profileNum].getElementsByTagName("altText")[0].childNodes[0].nodeValue;
	var profileHeading = xmlDoc2.getElementsByTagName("image")[profileNum].getElementsByTagName("heading")[0].childNodes[0].nodeValue;
	var profileDescription = xmlDoc2.getElementsByTagName("image")[profileNum].getElementsByTagName("description")[0].childNodes[0].nodeValue;
	var profileSubText = xmlDoc2.getElementsByTagName("image")[profileNum].getElementsByTagName("subText")[0].childNodes[0].nodeValue;
	var profileLinkText = xmlDoc2.getElementsByTagName("image")[profileNum].getElementsByTagName("linkText")[0].childNodes[0].nodeValue;
	var profileLinkPath = xmlDoc2.getElementsByTagName("image")[profileNum].getElementsByTagName("linkPath")[0].childNodes[0].nodeValue;
	var profileLargeImage = xmlDoc2.getElementsByTagName("image")[profileNum].getElementsByTagName("largeThumbSource")[0].childNodes[0].nodeValue;
	document.getElementById('thumbHeading').innerHTML = profileHeading;
	profileBuilder += '<p><span class="thumbSubHeading">'+profileDescription+'</span><br />';
	profileBuilder += profileSubText + '<br />';
	profileBuilder += '<a href="'+profileLinkPath+'">'+profileLinkText+'</a>';
	document.getElementById('thumbContent').innerHTML = profileBuilder;
	document.getElementById('largeThumb').src = profileLargeImage;
	document.getElementById('largeThumb').alt = profileAltText;
	// detect browser type
	var browser=navigator.appName;
	var b_version=navigator.appVersion;
	var version=parseFloat(b_version);

	// set all thumbnails to 100% opacity
	for(var x=0; x<thumbCounter; x++){
		if (browser=="Netscape"){
			document.getElementById('image'+x).style.opacity = '1';
		}else if(browser=="Microsoft Internet Explorer"){
			document.getElementById('image'+x).style.filter='alpha(opacity=100)';
		}
	}
	// set the selected thumbnail to 50% opacity
	//document.getElementById('image'+profileNum).style.opacity = '.5';
	if (browser=="Netscape"){
		document.getElementById('image'+profileNum).style.opacity = '.5';
	}else if(browser=="Microsoft Internet Explorer"){
		document.getElementById('image'+profileNum).style.filter='alpha(opacity=50)';
	}
}
