var nextStartimage = 0;
var currentStartimage = 0;
var startimageHeight = '220px';
var startimageContentElementId = 'ce406';
var startimageStaticContentElementId = 'headerImage';

// after effects are done rotation is startet again
function callbackRotationEffect(effect){
	startRotationEffect();
}

// rotation function, here happens everthing
function startRotationEffect(){
	// hide current image
	$('staticImage').style.display = 'none';
	
	// set src of the next image
	$('staticImage').src = $('startImageAnimation' + nextStartimage).src;
	
	// startimage array
	ctElement = $(startimageContentElementId);
	var startimages = ctElement.getElementsByTagName('img');
	
	// start with image 0 after the last image
	if(nextStartimage == (startimages.length - 1)){
		nextStartimage = 0;
	}
	
	// rotate
	new Effect.Appear('staticImage', {duration: 2, from: 0.01, to:  1});
	new Effect.Fade('staticImage', {queue:'end', from: 1, to: 0.01, delay:2, duration: 2, afterFinish: callbackRotationEffect});
	
	// set the counters
	currentStartimage = nextStartimage;
	nextStartimage++;
}

// function for random array order
function randOrd(){
	return (Math.round(Math.random())-0.5);
}

// numbers all images, and starts the rotation
startImageAnimation = function() {
	if($(startimageStaticContentElementId) && $(startimageContentElementId)){
		$(startimageStaticContentElementId).innerHTML = '<img id="staticImage" src=""/>';
		$(startimageStaticContentElementId).style.backgroundImage = 'none';
		$(startimageStaticContentElementId).style.textIndent = '0';
		
		$('staticImage').id = 'staticImage';
		$('staticImage').style.position = 'absolute';
		$('staticImage').style.left = 0;
		$('staticImage').style.top = 0
		
		ctElement = $(startimageContentElementId);
		ctElement.style.display = 'none';
		var startimages = ctElement.getElementsByTagName('img');
		var startimagesArray = new Array();
		for (var i=0; i<startimages.length; i++) {
			startimagesArray[i] = startimages[i];
		}
		startimagesArray.sort(randOrd);
		for (var i=0; i<startimagesArray.length; i++) {
			startimagesArray[i].style.display = 'none';
			startimagesArray[i].style.position = 'absolute';
			startimagesArray[i].style.left = 0;
			startimagesArray[i].style.top = 0;
			startimagesArray[i].id = 'startImageAnimation' + i;
		}
		
		startRotationEffect();
	}
}

if (window.attachEvent) {
	window.attachEvent("onload", startImageAnimation);
} else {
	window.addEventListener("load", startImageAnimation, false);
}