/*
==============================================
==============================================
Version 1.2
May 07 2008
Martyn Green
==============================================
Requires: "utility.js"
==============================================
==============================================
*/

//declarations
var r;	 				// the rotator element
var rImages = new Array(); 		// array that will hold all child elements of the rotator
var rContent = new Array();		// array that will holf all the text content for the rotator items
var currentImage; 			// keeps track of which image should currently be showing
var previousImage;			// keeps track of which image was last showing
var loopCount = 0;			// keeps track of how many times the cycle has played
var canPlay = true;			// keeps track of whether the cycle can keep playing

//parameters
var rotatorUrl = "http://sciencenow.sciencemag.org/include/rotator.xml";		// url of XML list of rotating images
//var rotatorUrl = "local.xml";		// url of XML list of rotating images
var rId = 'rotator-image';		// the ID of the rotator element in the XHTML
var rTitle = 'teaserTitle';		// the ID of the title element in the XHTML
var rText = 'teaserText';		// the ID of the teaser text element in the XHTML
var fadeInterval = 4000;		// interval between fades (ms)
var fadeRate = 60;			// speed at which fade occurs, somewhat arbitrary, but best between 20-70
var startDelay = 1000;			// delay before fading process begins (ms)
var loopMax = 3;			// number of times to loop the playback (a play button will then appear)


function initRotator() {

	// load external XML data and pass result to layout function
	_loadExtText(rotatorUrl, layoutRotator, true)

}

function layoutRotator(oContent) {

	// define the base node for the XML
	var base = oContent.firstChild;

	//alert(base);

	//set reference to the rotator container on the page
	r = document.getElementById(rId);
	
	// clear the default contents of the rotator element;
	r.innerHTML = "";

	// set temporary counter.
	var iCount = 0;

	//parse content from the XML file
	for (var i=0; i<base.childNodes.length; i++) {
		if (base.childNodes[i].nodeName == "item") {
			
			// define temporary object for content items
			var oTmp = new Object();
			
			var node = base.childNodes[i].firstChild;

			// loop over all child nodes and populate image and content arrays
			while (node) {
				if (node.nodeName == "title") {
					oTmp.title = node.firstChild.nodeValue;
				} else if (node.nodeName == "linkAddress") {
					oTmp.link = node.firstChild.nodeValue;
				} else if (node.nodeName == "teaser") {
					oTmp.teaser = node.firstChild.nodeValue;
				} else if (node.nodeName == "image") {
					var newImg = document.createElement('img');
					newImg.setAttribute('id','rotator' + i);
					newImg.setAttribute('src', node.firstChild.nodeValue);
					// add new image to page
					r.appendChild(newImg);	
					// also push into into array
					rImages.push(newImg);
					//initialise opacity of this image
					fader(iCount,0);
					//increment counter for next image
					iCount++;
				}
			
				node = node.nextSibling;
			}
			
			rContent.push(oTmp);
			
		}

	}
	
	//attach resume button
	var newEl = document.createElement('div');
	newEl.setAttribute('id','rotator-resume');
	newEl.onclick = restart;
	r.appendChild(newEl);

	//set the text to the first value.
	setRotatorText(0)
	//trigger the rotator.
	fadeInit();

}

function fader(imageNumber,opacity) {
	// set opacity for specified image
	var obj=rImages[imageNumber];
	if (obj.style) {
		if (obj.style.MozOpacity!=null) {  
			obj.style.MozOpacity = (opacity/100) - .001;
		} else if (obj.style.opacity!=null) {
			obj.style.opacity = (opacity/100) - .001;
		} else if (obj.style.filter!=null) {
			obj.style.filter = "alpha(opacity="+opacity+")";
		}
	}
}

function fadeInit() {
	if (document.getElementById) {

		// initialize rotator
		r.style.visibility = 'visible';
		currentImage=0;
		previousImage=rImages.length-1;
		opacity=100;
		fader(currentImage,100);
		window.setTimeout("crossfade(100)", startDelay);
	}
}

function crossfade(opacity) {
	if (opacity < 100) {
		fader(currentImage,opacity);
		opacity += 10;
		window.setTimeout("crossfade("+opacity+")", fadeRate);
	} else {
		fader(previousImage,0);
		previousImage=currentImage;
		currentImage++;
		if (currentImage>=rImages.length) {
			currentImage=0;
			loopCount++;
		}
		rImages[previousImage].style.zIndex = 0;
		rImages[currentImage].style.zIndex = 100;
		opacity=0;
		setRotatorText(previousImage);
		
		//check to see whether it's at the end of the loop cycle.
		if (loopCount >= loopMax && currentImage > 0) {
			canPlay = false;
		}
		
		//continue playing if allowed.
		if (canPlay) {
			window.setTimeout("crossfade("+opacity+")", fadeInterval);
		} else {
			document.getElementById("rotator-resume").style.visibility = 'visible';
		}
	}
}

function restart() {
	document.getElementById("rotator-resume").style.visibility = 'hidden';
	loopCount = 0;
	canPlay = true;
	crossfade(0);
}

function setRotatorText(idx) {
	var tmpTitle = "<a href='" + rContent[idx].link + "'>"  + rContent[idx].title + "</a>";
	_updateContent(rTitle,tmpTitle);
	_updateContent(rText,rContent[idx].teaser);
}

//initialize page
//================================
window.onload = _executeOnLoad(window.onload, initRotator);

//_updateContent('teaserTitle','');
//_processing('teaserText');

