// JavaScript Document
// Slideshow 0.1
// by Leo Gerber, diewebdesigner.com
// using Prototype and Sriptaculous


// Time to wait before each cycle
myStartDelay = 1000;
//Time to wait between fading
myDelay = 2.0;
// Fading Time
myFadeTime = 2.0;
// Should preloading start on execution (false) or on window.load (true)
startOnLoad = true;
//
// Counters, don't touch
cnt = 0;
myLoaded = 0;

// Override this function in HTML body with correct images
//function myImages() {
//	pics = new Array();
//	// Change to imagepaths for Slideshow
//	pics[0] = "/fileadmin/templates/animated/01.jpg";
//	pics[1] = "/fileadmin/templates/animated/02.jpg";
//	pics[2] = "/fileadmin/templates/animated/03.jpg";
//	pics[3] = "/fileadmin/templates/animated/04.jpg";
//	pics[4] = "/fileadmin/templates/animated/05.jpg";
//	return pics;
//}
//
// Preload Images
function preloadImages() {
	pics = myImages();
	
	pl = pics.length;
	preloadImg = Array(pl);
	for (i=0; i<pl; i++) {
		preloadImg[i] = new Image();
		new Event.observe(preloadImg[i], 'load', imgLoaded, false);
		preloadImg[i].src = pics[i];
	}
}

// Check if all images are loaded
function imgLoaded() {
	myLoaded++;
	if(myLoaded == pl) {
		initMyImgFade();
	}
}

// Setup DOM nodes and start slideshow
function initMyImgFade() {
	cnt = 1;
	imgcontainer = $('slideContainer');
	// Remove static img1
	Element.remove('slideImage');
	// Build dynamic img1
	imgcontainer.appendChild(buildImgContainer('slideImage', 'absolute', 10));
	// Build dynamic img2
	imgcontainer.appendChild(buildImgContainer('slideImage2', 'relative', 5));
	
	image2cont = $('slideImage2');
	tmpImg1 = buildImg('img1', preloadImg[0].src);
	tmpImg2 = buildImg('img2', preloadImg[1].src);
	image1cont = $('slideImage');
	image1cont.appendChild(tmpImg1);
	image2cont.appendChild(tmpImg2);
	image1 = $('img1');
	image1.src = preloadImg[0].src;
	image2 = $('img2');
	setTimeout("startSlideshow();", myStartDelay);
}

function buildImgContainer(contId, contPos, contZ) {
	return Builder.node('div', {id: contId, style:'position:'+contPos+'; z-index:'+contZ});
}

function buildImg(imgId, imgSrc) {
	return Builder.node('img', {id:imgId, src:imgSrc});
}

function startSlideshow() {
	for (i=0; i<pl; i++) {
		new Effect.Opacity(image1, {duration:myFadeTime, from:1.0, to:0.0, afterFinish:changeImg1, queue: {position:'end', scope:'imgfade'}});
		new Effect.Opacity(image1, {duration:0.5, from:0.0, to:1.0, delay:myDelay, afterFinish:changeImg2, queue: {position:'end', scope:'imgfade'}});
	}
}

function reStart() {
	setTimeout("startSlideshow();", myStartDelay);
}

function changeImg1(obj) {
	image1.src = preloadImg[cnt].src;
}

function changeImg2(obj) {
	cnt++;
	if(cnt == pl) {
		cnt = 0;
		image2.src = preloadImg[cnt].src;
		reStart();
	} else {
		image2.src = preloadImg[cnt].src;
	}
}

if(startOnLoad == true) {
	Event.observe(window, 'load', preloadImages, false);
} else {
	preloadImages();
}