var x;
var i=3;
var fadetimer;
var rotatetimer;
//Cache the images
image1 = new Image;
image2 = new Image;
image3 = new Image;
image4 = new Image;
image1.src = "images/currentcontents/1.jpg";
image2.src = "images/currentcontents/2.jpg";
image3.src = "images/currentcontents/3.jpg";
image4.src = "images/currentcontents/4.jpg";

var images = new Array(image1, image2, image3, image4);

//Used to instialise the rotating images section, IF the user has JS turned on, otherwise it stays hidden
function showrotatingimages()
{
	document.getElementById('nonrotatingcontents').style.display = "none";
	document.getElementById('rotatingcontents').style.display = "block";
}

//delay is the delay between each rotating image in ms, 5000 is a good number. speed is the speed at which transisition occurs. 1 = fast, 10 = slow.
//images is the array of images we will be rotating through					   
function rotateimages()
{
	rotatetimer = setInterval("callfadeimages()", 5000);
}

function getnextivalue(ivalue)
{
	return (ivalue==3)?0:(i + 1);
}						   

function callfadeimages()
{
	//reset timer
	x = 0;
	//fade the images
	fadetimer = setInterval("fadeimages()", 20);
	//i = i + 1;
	i = (i==3)?0:i + 1;
}
						   
function fadeimages()
{
	var oldimageindex;
	var newimageindex;
	var oldimage;
	var newimage;
	//Set the index of the fading in and fading out image
	oldimageindex = i;
	newimageindex = getnextivalue(i);
	//Do the fading
	oldimage = document.getElementById('image' + oldimageindex);
	oldimage.style.opacity = ((100-x)/100);
	oldimage.style.filter='alpha(opacity='+(100-x)+')'
	newimage = document.getElementById('image' + newimageindex)
	newimage.style.opacity = (x/100);
	newimage.style.filter='alpha(opacity='+(x)+')'
	x=x+5;
	if (x>=101)
	{
		clearInterval(fadetimer);
		setblock(newimageindex);
		document.getElementById('rotatingimagetextbox').innerHTML = descriptions[newimageindex];
	}
}

function stoprotate(imageid)
{
	clearInterval(rotatetimer);
	document.getElementById('fullimage').style.display = "block";
	document.getElementById('fullimage').src = images[imageid].src;
	setblock(imageid);
	document.getElementById('rotatingimagetextbox').innerHTML = descriptions[imageid];
}
function restartrotate()
{
	var imageindex = getnextivalue(i);
	rotateimages();
	document.getElementById('fullimage').style.display = "none";
	setblock(imageindex);
	document.getElementById('rotatingimagetextbox').innerHTML = descriptions[imageindex];
}

function setblock(blocknumber)
{
	for (z=0;z<=3;z=z+1) 
	{
		document.getElementById('block' + z).style.fontWeight = "normal";
		document.getElementById('block' + z).style.background = "none";
		document.getElementById('block' + z).style.color = "black";
	}

	document.getElementById('block' + blocknumber).style.fontWeight = "bold";
	document.getElementById('block' + blocknumber).style.backgroundColor = "#005422";
	document.getElementById('block' + blocknumber).style.color = "white";
}