/**********************************
Initialisierung und Start
**********************************/
function addEvent (elm, evType, fn, useCapture)
{
	if (elm.addEventListener)
	{
		elm.addEventListener (evType, fn, useCapture);
		return true;
	} 
	else if (elm.attachEvent)
	{
		var r = elm.attachEvent ("on" + evType, fn);
		return r;
	}
}
addEvent (window, 'load', winOnLoad)
function winOnLoad ()
{
	
	log ('', false);
	imgArraySmall = new Array ();
	imgArrayBig = new Array ();
	steps = 5;
	lastPosition = "Left";
	imgArrayBig = newImgBig (imagesBig);
	if (imagesBig.length == 1)
	{
		xImgAsyncWait (imgLoadStatus, showOneImage, appImgError, '', '', imgArrayBig);
	} 
	else 
	{
		xImgAsyncWait (imgLoadStatus, preloadNext, appImgError, '', '', imgArrayBig);
	}
}
function appImgError (n, c, e, a)
{
	var s = '\nFinal Image Status:' +
	'\n total=' + n +
	'\n loaded=' + c +
	'\n errors=' + e +
	'\n aborts=' + a;
}
function imgLoadStatus (n, c, e, a)
{
	var s = '\nImage Status:' +
	'\n total=' + n +
	'\n loaded=' + c +
	'\n errors=' + e +
	'\n aborts=' + a;
}
function log (s, bOverwrite)
{
	var log = document.getElementById ('debugLog');
	if (log)
	{
		if (bOverwrite) log.value = s;
		else log.value += s;
	}
}
//Browserabhngige Fader-Funktionalitt
function fader (obj, opacity)
{
	//alert(obj);
	if (obj.style.MozOpacity != null)
	{
		obj.style.MozOpacity = (opacity / 100) -.001;
	} else if (obj.style.opacity != null)
	{
		obj.style.opacity = (opacity / 100) -.001;
	} else if (obj.style.filter != null)
	{
		obj.style.filter = "alpha(opacity=" + opacity + ")";
	}
}
//Bild-Array mit groen Bildern erzeugen
function newImgBig (imagesBig)
{
	for (i = 0; i < imagesBig.length; i ++)
	{
		imgArrayBig [i] = new Image ();
		imgArrayBig [i].src = imagesBig [i];
	}
	return imgArrayBig;
}
//Bild-Array mit kleinen Bildern erzeugen
function newImgSmall (imagesSmall)
{
	for (i = 0; i < imagesSmall.length; i ++)
	{
		imgArraySmall [i] = new Image ();
		imgArraySmall [i].src = imagesSmall [i];
	}
	return imgArraySmall;
}
//wenn nur ein groes Bild vorhanden ist, dieses anzeigen
function showOneImage ()
{
	replaceBigImage (0, "");
}
//wenn nur zwei Bilder vorhanden sind
function showTwoImages ()
{
	var imagesSmallLeft = "";
	for (i = 0; i < imagesSmall.length; i ++)
	{
		imagesSmallLeft += '<img id="imgLeft' + i + '" class="img1" src="' + imagesSmall [i] + '" alt="" />';
	}
	xGetElementById ("hrefLeft").innerHTML = imagesSmallLeft;
	galleryImagesLeft = xGetElementById ("hrefLeft").childNodes;
	for (i = 0; i < galleryImagesLeft.length; i ++)
	{
		galleryImagesLeft [i].style.zIndex = 0;
		fader (galleryImagesLeft [i] , 0);
	}
	currentImageLeft = Math.round (Math.random () * (imagesSmall.length - 1));
	currentImageBig = currentImageLeft + 1;
	if (currentImageBig > imagesSmall.length - 1)
	{
		currentImageBig = 0;
	}
	fader (galleryImagesLeft [currentImageLeft] , 100);
	xGetElementById ("hrefLeft").href = "javascript:replaceBigImage(" + currentImageLeft + ", 'Left')";
	//xGetElementById ("imgbig").src = imagesBig [currentImageBig];
	xGetElementById ("imgbig").style.backgroundImage = 'url(' + imagesBig [currentImageBig] + ')';
	xGetElementById ("img_small_box").style.display = 'block';
	xGetElementById ("img_big_box").style.display = "block";
}
//wenn nur drei Bilder vorhanden sind
function showThreeImages ()
{
	imageInit ();
	fadeInit ();
	currentImageBig = currentImageLeft;
	newImageNumber = Math.round (Math.random () * (imgArraySmall.length - 1));
	while ( ! checkImage ())
	{
		newImageNumber = Math.round (Math.random () * (imgArraySmall.length - 1));
	}
	currentImageBig = newImageNumber;
	//xGetElementById ("imgbig").src = imagesBig [newImageNumber];
	xGetElementById ("imgbig").style.backgroundImage = 'url(' + imagesBig [newImageNumber] + ')';
	xGetElementById ("img_big_box").style.display = "block";
}
//Bild-Array der kleinen Bilder vorladen
function preloadNext ()
{
	imgArraySmall = newImgSmall (imagesSmall);
	if (imagesBig.length == 2)
	{
		xImgAsyncWait (imgLoadStatus, showTwoImages, appImgError, '', '', imgArraySmall);
	} 
	else if (imagesBig.length == 3)
	{

		xImgAsyncWait (imgLoadStatus, showThreeImages, appImgError, '', '', imgArraySmall);
		
	} 
	else 
	{
		xImgAsyncWait (imgLoadStatus, appStart, appImgError, '', '', imgArraySmall);
	}
}
//Bilder schreiben
function imageInit ()
{
	var imagesSmallLeft = "";
	var imagesSmallRight = "";
	for (i = 0; i < imagesSmall.length; i ++)
	{
		imagesSmallLeft += '<img id="imgLeft' + i + '" class="img1" src="' + imagesSmall [i] + '" alt="" />';
		imagesSmallRight += '<img id="imgRight' + i + '" class="img2" src="' + imagesSmall [i] + '" alt="" />';
	}
	xGetElementById ("hrefLeft").innerHTML = imagesSmallLeft;
	xGetElementById ("hrefRight").innerHTML = imagesSmallRight;
}
//alle Bilder nach hinten legen und trnasparent setzen
function fadeInit ()
{
	galleryImagesLeft = xGetElementById ("hrefLeft").childNodes;
	galleryImagesRight = xGetElementById ("hrefRight").childNodes;
	//alle Bilder zu Beginn transparent setzen
	for (i = 0; i < galleryImagesLeft.length; i ++)
	{
		galleryImagesLeft [i].style.zIndex = 0;
		galleryImagesRight [i].style.zIndex = 0;
		fader (galleryImagesLeft [i] , 0);
		fader (galleryImagesRight [i] , 0);
	}
	//Bild Container sichtbar machen
	xGetElementById ("img_small_box").style.display = 'block';
	//Definition der ersten Bilder
	currentImageLeft = Math.round (Math.random () * (imagesSmall.length - 1));
	currentImageRight = Math.round (Math.random () * (imagesSmall.length - 1));
	//zwei unterschiedliche Bilder anzeigen
	while (currentImageLeft == currentImageRight)
	{
		currentImageLeft = Math.round (Math.random () * (imagesSmall.length - 1));
		currentImageRight = Math.round (Math.random () * (imagesSmall.length - 1));
	}
	//erste Bilder sichtbar machen
	fader (galleryImagesLeft [currentImageLeft] , 100);
	fader (galleryImagesRight [currentImageRight] , 100);
	xGetElementById ("hrefLeft").href = "javascript:replaceBigImage(" + currentImageLeft + ", 'Left')";
	xGetElementById ("hrefRight").href = "javascript:replaceBigImage(" + currentImageRight + ", 'Right')";

}
//Anwendung starten
function appStart ()
{
	imageInit ();
	fadeInit ();
	//erstes Grobild gleich dem linken kleinen setzen
	//xGetElementById ("imgbig").src = imagesBig [currentImageLeft];
	xGetElementById ("imgbig").style.backgroundImage = 'url(' + imagesBig [currentImageLeft] + ')';
	currentImageBig = currentImageLeft;
	xGetElementById ("img_big_box").style.display = "block";
	//automatischen Bildwechsel starten
	window.setTimeout ("imageReplace ()", 5000);
		
}
/**********************************
Funktionen fr Bildwechsel
**********************************/
function checkImage ()
{
	if (newImageNumber == currentImageRight || newImageNumber == currentImageLeft || newImageNumber == currentImageBig)
	{
		return false;
	} 
	else
	{
		return true;
	}
}
//Positionen wechseln
function imageReplace ()
{
	
	if (lastPosition == "Left")
	{
		newPosition = "Right";
	} 
	else
	{
		newPosition = "Left";
	}
	lastPosition = newPosition;
	
	newImageNumber = Math.round (Math.random () * (imgArraySmall.length - 1));
	//neues Bild soll nicht mit den derzeit angezeigten (auch dem groen) bereinstimmen
	while ( !checkImage())
	{
		newImageNumber = Math.round (Math.random () * (imgArraySmall.length - 1));
	}
	
	//ersten Crossfade ausfhren
	crossfade (newImageNumber, newPosition, true);
}
/**********************************
Crossfade / Bildwechsel
**********************************/
function crossfade (nextImage, position, start)
{
	if (start)
	{
		//momentanes Bild nach hinten legen (ist sichtbar)
		eval ("galleryImages" + position + " [" + eval ("currentImage" + position) + "].style.zIndex = 0");
		//neues Bild vor altes legen
		eval ("galleryImages" + position + " [" + nextImage + "].style.zIndex = 100");
		opacity = 0;
		//Einblenden des neuen Bildes starten
		crossfade (nextImage, position, false);
	} 
	else
	{
		fader (eval ("galleryImages" + position + " [" + nextImage + "]") , opacity);
		//Opacity des neuen Bildes schrittweise erhhen
		opacity += steps;
		
		if (opacity > 100)
		{
			//wenn neues Bild eingeblendet wurde, altes transparent setzen
			fader (eval ("galleryImages" + position + " [" + eval ("currentImage" + position) + "]") , 0);
			//Neudefinition des momentanen Bildes
			eval ("currentImage" + position + " = " + nextImage);
			xGetElementById ("href" + position).href = "javascript:replaceBigImage(" + nextImage + ",'" + position + "')";
			//Warten bis zum nchsten Bildwechsel (macht erst ab 3 Bildern Sinn)
			if (imagesBig.length > 3)
			{
				window.setTimeout ("imageReplace ()", 5000);
				
			}
		} 
		else
		{
			window.setTimeout ("crossfade(" + nextImage + ", '" + position + "', " + start + ")", 30);
		}
		
	}
}
function replaceBigImage (newImageBig, position)
{
	if (imagesBig.length == 2)
	{
		crossfade (currentImageBig, "Left", true)
	}
	if (imagesBig.length == 3)
	{
		crossfade (currentImageBig, position, true);
	}
	//xGetElementById ("imgbig").src = imgArrayBig [newImageBig].src;
	xGetElementById ("imgbig").style.backgroundImage = 'url(' + imgArrayBig [newImageBig].src + ')';
	currentImageBig = newImageBig;
	xGetElementById ("img_big_box").style.display = "block";
}