// JavaScript Document

var isIE = false;
var req;
 
var grouparray;
var currentgroup = 0;
var currentdrawitem = 0;
var currentclearitem = 0;
var nextfunctioninterval;
var draworder = new Array();
draworder[0] = new Array(1,2,3,4);
var longpauseImage = 4000; // Pause after big image
var longpause = 5500;      // Pause after small image
var shortpause = 500;      // Pause between two small images
var goNext = 0;
var largeimagelink;
var largeimagename;
var hover = 0;
var firstCall=-1;

//var preloadImage;

function preLoadNextBig()
{
	var group = currentgroup;
	group++;

	if (group >= grouparray.length){
			group = 0;
	}
	
	// Get the big picture URL

	largeImage = "../assets/rotation/big/"+grouparray[group].getElementsByTagName('largeimage')[0].firstChild.nodeValue;	
	preloadImage = new Image(428,278);
	preloadImage.src = largeImage;
	
}

function preLoadNextSmall()
{
	var smallimagearray = grouparray[currentgroup].getElementsByTagName('smallimage');
	for (i = 0; i <4; i++)
	{
		var imageurl = "../assets/rotation/small/"+smallimagearray[i].firstChild.nodeValue;
		var preloadImage = new Image(214,139);	
		preloadImage.src = imageurl;
	}
}

function processReqChange() 
{
	if (req.readyState == 4) 
	{	
		if (req.status == 200) 
		{		
			InitializeRotation();
		} 
		else 
		{
			// Unable to open xml file	
		}
	}
}


function InitializeRotation(){		
	grouparray = req.responseXML.getElementsByTagName('displaygroup');
	currentgroup = Math.floor(Math.random() * grouparray.length);
	
	if (firstCall > 0)
	{
		currentgroup = firstCall-1;
	}
	
	largeimagelink = grouparray[currentgroup].getElementsByTagName('largeimage')[0].getAttribute('url');
	largeimagename = grouparray[currentgroup].getElementsByTagName('largeimage')[0].getAttribute('name');
	element = document.getElementById('photo');
	element.className = "big"+(currentgroup+1);

	ClearSmallImage(1);
}

function DrawSmallImage(init){
	if (init){
		currentdrawitem = 0;
		randomval = Math.floor(Math.random() * draworder.length);
		localdraworder = draworder[randomval];
	}
		
	element = document.getElementById('area' + localdraworder[currentdrawitem]);
	var smallimagearray = grouparray[currentgroup].getElementsByTagName('smallimage');
	var imageurl = smallimagearray[currentdrawitem].firstChild.nodeValue;
	var imagelink = smallimagearray[currentdrawitem].getAttribute('url');
	var imagename = smallimagearray[currentdrawitem].getAttribute('name');

	switch (localclearorder[currentdrawitem])
	{
		case 1:
			width=214;
			height=139
			break;
		case 2:
			width=213;
			height=139
			break;
		case 3:
			width=214;
			height=138
			break;
		case 4:
			width=213;
			height=138
			break;
	}	
		
	element.innerHTML = '<a href="' + imagelink + '" title="'+imagename+'"><img src="../assets/rotation/small/' + imageurl + '" width="'+width+'" height="'+height+'" alt="'+imagename+'"/></a>';

	if (currentdrawitem >= 3){
		preLoadNextBig();
		nextfunctioninterval = setTimeout('ClearSmallImage(1)',longpause);
	} else {
		currentdrawitem++;
		nextfunctioninterval = setTimeout('DrawSmallImage(0)',shortpause);
	}
}

function ClearSmallImage(init){
		if (init){
		currentclearitem = 0;
		if (firstCall > 0)
		{
			firstCall = -1;
			goNext=1;
		}
		else
		{
			currentgroup++;
		}
		if (currentgroup >= grouparray.length){
			currentgroup = 0;
		}
			
		largeimagelink = grouparray[currentgroup].getElementsByTagName('largeimage')[0].getAttribute('url');
		largeimagename = grouparray[currentgroup].getElementsByTagName('largeimage')[0].getAttribute('name');
		
		element = document.getElementById('photo');		
		element.className = "big"+(currentgroup+1);
		randomval = Math.floor(Math.random() * draworder.length);
		localclearorder = draworder[randomval];		
	}
	
	element = document.getElementById('area' + localclearorder[currentclearitem]);
	
	switch (localclearorder[currentclearitem])
	{
		case 1:
			width=214;
			height=139
			break;
		case 2:
			width=213;
			height=139
			break;
		case 3:
			width=214;
			height=138
			break;
		case 4:
			width=213;
			height=138
			break;
	}
		
	element.innerHTML = '<a href="' + largeimagelink + '" title="'+largeimagename+'"><img src="../assets/common/empty.gif" width="'+width+'" height="'+height+'" alt="'+largeimagename+'"/></a>';
	
	if (currentclearitem >= 3){
		goNext = 0;
		preLoadNextSmall();
		nextfunctioninterval = setTimeout('DrawSmallImage(1)',longpauseImage);
	} 
	else {
		currentclearitem++;
		if (goNext == 1)
		{
			nextfunctioninterval = setTimeout('ClearSmallImage(0)',0);
		}
		else
		{
			nextfunctioninterval = setTimeout('ClearSmallImage(0)',shortpause);
		}
	}
	
}

function loadXMLDoc(url,first) {
	firstCall=first;
	if (window.XMLHttpRequest) {
		req = new XMLHttpRequest();
		req.onreadystatechange = processReqChange;
		req.open("GET", url, true);
		req.send(null);
	} else if (window.ActiveXObject) {
		isIE = true;
		req = new ActiveXObject("Microsoft.XMLHTTP");
		if (req) {
			req.onreadystatechange = processReqChange;
			req.open("GET", url, true);
			req.send();
		}
	}	
}
