/**
 * Bilder Faden, Links wechseln und noch ein paar Funktionen
 *
 * @author Tobi Kivelip <tobi@kivelip.net>
 */
/**
 * Konfiguration
 */
var iOpacityStart = 1.0;	// Startwert der Deckkraft
var steps = 0.06;	// Prozent der Deckkraft
var fadeTime = 50;	// Zeit pro Step in Millisekuden
var nextFade = 5000 // Zeit zwischen den Animationen

var divID = "head";		// CSS ID des Containers

var images = new Array();
var imgLink = new Array();
images[0] =	"img/head1.jpg";
imgLink[0] = "/index.php";
images[1] =	"img/head2.jpg";
imgLink[1] = "/index.php";
images[2] = "img/head3.jpg";
imgLink[2] = "/index.php";
/*
images[3] = "img/head4.jpg";
imgLink[3] = "/index.php";
images[4] = "img/head5.jpg";
imgLink[4] = "/index.php";
*/

/**
 * Globale Variablen
 */
var bild1;
var bild2;
var myCounter = 1;
var iOpacity;
var pre = Array();

/**
 * Startet alle benötigten Funktionen
 */
function tkStart() {
	tkPreload();
	tkCheckPreload();
	setTimeout("tkAnimation()", nextFade);
}

/**
 * Bilder vorladen
 */
function tkPreload() {
	for(i=0; i<images.length; i++) {
		pre[i] = new Image();
		pre[i].src = images[i];
	}
}

/* ---------------- Funktion: tkCheckPreload ----------------
 * 	testet ob alle Bilder vorgeladen sind (rekursiv)
 */
function tkCheckPreload() {
	var loaded = 0;
	for(i=0; i<pre.length; i++) {
		if(pre[i].complete) {
			loaded++;
		}
	}
	if (loaded<pre.length) {
		setTimeout("tkCheckPreload()", 500);
	} else {
		clearTimeout();
	}
}

/**
 * Animation: Bilder Faden
 */
function tkAnimation() {
	change_image(myCounter);
	myCounter++;
	if (myCounter > (images.length-1)) {
		myCounter=0;
	}
	setTimeout("tkAnimation()", nextFade);
}

/* ---------------- Funktion: change_image ----------------
 * 	Fuegt das zu fadende Bild ein und ruft die fade-funktion aus
 *	Uebergabeparameter: newImage -> Das neue Bild inkl. Pfad
 */
function change_image(myKey) {
	// Startwert der Deckkraft einstellen
	iOpacity = iOpacityStart;

	// Derzeitiges Bild (1. Kind im DOM)
	myDiv = $(divID);

	bild1 = myDiv.down();

	// Neues Bild
	bild2 = bild1.cloneNode(true);
	bild2.src = images[myKey];
	setOpacity(bild2, 0);

	// Neues Bild einbinden
	myDiv.appendChild(bild2);

	// Ueberblenden
	fade_images();
}

/* ---------------- Funktion: fade_images ----------------
 * 	Ueberblendet zwei Bilder, das ausgeblendete wird entfernt
 */
function fade_images() {
	// Deckkreft verringern
	iOpacity -= steps;
	// Ist das Bild noch sichtbar?
	if(iOpacity >= 0) {
		// Deckfraft setzen
		setOpacity(bild1, iOpacity);
		setOpacity(bild2, (1-iOpacity));

		// Funktion neu aufrufen
		setTimeout("fade_images()", fadeTime);
	} else {
		// ausgeblendetes Bild entfernen
		bild1.remove();
		return false;
	}
}

/**
 * Setzt die die Deckkraft (Dezimal)
 */
function setOpacity(element, opacity) {
	element.style.MozOpacity = opacity;
	element.style.opacity = opacity;
	element.style.filter = "alpha(opacity=" + (opacity*100) + ")";
}
addOnLoadEvent(tkStart);