/***************************************************************************************
*	This script will dynamically replace an image in an <img> tag. It retrieves		   *
*	the images from an XML file whose path is specified in the "imageURL" variable.	   *
*	The XML file should also include the original image so that it is a part of the    *
*	cycle. You specify which image tag should be targeted by placing an id attribute   *
*	within the specific tag you want to effect and set its value as "replace".		   *
*																					   *
***************************************************************************************/

/***************************************************************************************
*	The images for this script in this example should contain the following 		   *
*	dimensions in order to not destroy the template.								   *
*			WIDTH:	433px															   *
*			HEIGHT:	136px															   *
*																					   *
***************************************************************************************/

(function(){  //entire module is within an anonymous function
	var imageURL = "../images.xml";
	var imageElement;  //global variable used to store element that holds picture
	var picNum = 0;  //holds value of current picture being displayed
	var picTotal; //holds value of total number of pictures
	//This is a list of possible ways to create XMLHttpRequest Objects
	//Used to find correct one below 
	
	HTTP = new Object();
	
	HTTP._factories = [
		function() { return new XMLHttpRequest(); },
		function() { return new ActiveXObject("Msxml2.XMLHTTP"); },
		function() { return new ActiveXObject("Microsoft.XMLHTTP"); }];
	//Used to store the correct function for creating XMLHttpRequest object from above array
	HTTP._factory = null;
	//Function tries each XMLHttpRequest creation fucntion until it finds one that works
	HTTP.newRequest = function(){
		if(HTTP._factory != null) return HTTP._factory();
		
		for(var i = 0; i < HTTP._factories.length; i++){
			try{
				var factory = HTTP._factories[i];
				var request = factory();
				if(request != null){
					HTTP._factory = factory;
					return request;
				}
			}
			catch(e){
				continue;
			}
		}
	}
	
	//XMLHttpRequest Object used to parse images from XML file
	var request = HTTP.newRequest();
	
	//When document is finished loading, call init() function
	if(window.addEventListener) window.addEventListener("load", init, false);
	else if(window.attachEvent) window.attachEvent("onload", init);
	
	function init(){
		imageElement = document.getElementById("replace");
		//Open XML page & send request
		//Remember that because we pass false, request is synchronous and will  not return till done
		request.open("GET", imageURL, false);
		request.send(null);
		if(request.status != 200){
			alert("Error with XML retrieval");
		}
		setInterval(PictureRoutine, 5000);
	}
	
	function PictureRoutine(){
		//Get element holding image
		if(picTotal == null){
			picTotal = request.responseXML.firstChild.childNodes.length;
		}
		//Set picNum equal to next picture or 1 if on last picture
		if(picNum < picTotal) picNum++;
		else picNum = 1;
		imageElement.setAttribute("src", '_images/' + request.responseXML.firstChild.childNodes[picNum - 1].firstChild.nodeValue);
		/*alert(request.responseXML.firstChild.firstChild.firstChild.nodeValue);
		alert(picTotal);
		alert(picNum);*/
	}
	
})();
