window.onload = initAll;
var xhr = false;
var dataArray = new Array();
var url = "spotlights.xml";

function initAll() {
	if (window.XMLHttpRequest) {
		xhr = new XMLHttpRequest();
	}
	else {
		if (window.ActiveXObject) {
			try {
				xhr = new ActiveXObject("Microsoft.XMLHTTP");
			}
			catch (e) { }
		}
	}

	if (xhr) {
		xhr.onreadystatechange = setDataArray;
		xhr.open("GET", url, true);
		xhr.send(null);
	}
	else {
		alert("Sorry, but I couldn't create an XMLHttpRequest");
	}
}

function setDataArray() {
	if (xhr.readyState == 4) {
		if (xhr.status == 200) {
			if (xhr.responseXML) {
				var allData = xhr.responseXML.getElementsByTagName("spotlight");

				for (var i=0; i<allData.length; i++) {
					var tempObj = new Object;
					tempObj.quote = getVal(allData[i],"quote");
					tempObj.attrib = getVal(allData[i],"attrib");
					tempObj.pic = getVal(allData[i],"pic");
					dataArray[i] = tempObj;
				}
				
				//document.getElementById("updateArea").innerHTML = "buhaihai";
				
				showSpotlight(0);
			}
		}
		else {
			alert("There was a problem with the request " + xhr.status);
		}
	}
	
	function getVal(theData,theTag) {
		return theData.getElementsByTagName(theTag)[0].firstChild.nodeValue;
	}
	
	//alert(dataArray.length);
	
}

function showSpotlight(spotnum) {

	//alert(spotnum);
	//alert(dataArray.length);
	if (spotnum == dataArray.length) {
		//alert("bigger");
		spotnum = 0;
	}
	
	var theSpot = null;
	
	theSpot = dataArray[spotnum];
	
	var spotCode = '<p class="spotQuote"><span>&ldquo\;</span>';
	spotCode += theSpot.quote;
	spotCode += '<span>&rdquo\;</span></p>';
	
	spotCode += '<p class="spotattrib">&mdash\;';
	spotCode += theSpot.attrib;
	spotCode += '</em></p>';
	
	spotCode += '<p><img src="images/spotlight/';
	spotCode += theSpot.pic;
	spotCode += '" /></p>';
	
	//alert (theSpot.attrib);

	document.getElementById("spotContent").innerHTML = spotCode;

	
	document.getElementById("nextSpot").onclick = function() {
			showSpotlight(spotnum+1);
	}
}