//This file need mootools v 1.1 to function.
//This script controls that image fade in/fade out functionality of the SITO homepage
var rotateSpeed = 2000;
var rotateDuration = 4000;

var myFx = null;
var myFx2 = null;

var i = 0; 
var j = 1;

var alt = 0; //A flag that is used to alternate the z-index between the two loaded images  

var image1 = null;
var image2 = null;

//this function swaps the z-index and source of the image 
function RotateImagesSwap(){

	if(alt == 0){
		i = i + 2;

		if(i > imageArray.length - 1){
			i = 0;
		}

		image1.style.zIndex = 0;
		image2.style.zIndex = 1;
		image1.src = imageArray[i];

		alt = 1;

		return;
	} else if(alt == 1){

		j = j + 2;

		if(j > imageArray.length - 1){
			j = 1;
		}

		image1.style.zIndex = 1;
		image2.style.zIndex = 0;
		image2.src = imageArray[j];

		alt = 0;

		return;
	}
}

//this function performes the fade events and is triggered whenever an image is loaded 
function RotateImagesInit(){
	if(alt == 0){
		myFx.set(1);
		myFx.start(1, 0);
		myFx2.set(1);
	} else if(alt == 1){
		myFx2.set(1);
		myFx2.start(1, 0);
		myFx.set(1);
	}
}

function RotateImagesConstruct(){

	image1 = $('main-image-element');
	
	if(image1){
		myFx = new Fx.Style(image1, 'opacity', {duration: rotateDuration, onComplete: RotateImagesSwap}); 
					
		image1.onload = function(){
			setTimeout("RotateImagesInit()", rotateSpeed);
		}
	}

	image2 = $('main-image-element2');
	
	if(image2){
		myFx2 = new Fx.Style(image2, 'opacity', {duration: rotateDuration, onComplete: RotateImagesSwap}); 

		image2.onload = function(){
			setTimeout("RotateImagesInit()", rotateSpeed);
		}

		image2.src = imageArray[j];
	}
}