///////////////////////////////////////////////////////////////////////////////
//
//	Name:			Thomas Weiß
//
//	Beschreibung:	Steuerung für ein Slider-Banner
//
//	Datum:			15.04.2011
//
//	Inhalt:			Grundeinstellungen
//					void	SetOpacity(object,opacityPct)
//					void	ChangeOpacity(void)
//					int		GetIndexFromCoocie()
//					void	SetIndexToCoocie(int)
//					bool	Navigate(int)
//					bool	FadeImage(int, bool, bool)
//					void	PermenentFade(int)
//
///////////////////////////////////////////////////////////////////////////////



// Grundeinstellungen /////////////////////////////////////////////////////////
var g_oConfig	= {
	fadeInterval:				1000 * 15,					// 15 Sekunden
	containerID:				'ContainerDIV',				// Div, welches das Image mit dem zu fadeten Image enthält
	imageID:					'FadingIMG',				// Image, welches gefadet werden soll
	iconActiveOpacity:			1.0,						// 100% sichtbar
	iconInactiveOpacity:		0.4,						// 40% sichtbar
	strCookieName:				'JAG2000_SLIDER_ITEMID',	// Name des zu speichernden Cookies
	fromOpacity:				0,							// Anfangswert für Fading
	toOpacity:					100,						// Endwert für Fading
	duration:					1000 * 2, 					// 2 Sekunden Überblendeffekt
	aktualIndex:				0,							// Startindex und aktuel angezeigter Index
	allowThumbnailNavigation:	true,						// Wenn das klicken auf ein Thumbnail ein Sprung zur Seite ausführen soll
	oldID:						'',							// ID des Div's, welches aktiv war
	newID:						'',							// ID des Div's, welches aktiv wird
	startTime:					null,
	items:						[{							// Beinhaltete Elemente
		title: 		'Startseite',												// Titel des Thumbnails
		imgID:		'IconDIV1',													// ID des zugehörigen Thumbnails
		imgSrc:		'tl_files/xBrowser_style_sheets/Layout/slider/Banner1.jpg',	// Zu ladendes Bild
		callUrl:	'?id=1'														// URL der aufzurufenden Seite nach klick
	},{
		title:		'Programme',
		imgID:		'IconDIV2',
		imgSrc:		'tl_files/xBrowser_style_sheets/Layout/slider/Banner2.jpg',
		callUrl:	'?id=36'
	},{
		title: 		'Stuff',
		imgID:		'IconDIV3', 
		imgSrc:		'tl_files/xBrowser_style_sheets/Layout/slider/Banner3.jpg',
		callUrl:	'?id=54'
	},{
		title:		'Downloads',
		imgID:		'IconDIV4',
		imgSrc:		'tl_files/xBrowser_style_sheets/Layout/slider/Banner4.jpg',
		callUrl:	'?id=32'
	}] // end of items
}; // end of config ///////////////////////////////////////////////////////////



///////////////////////////////////////////////////////////////////////////////
//	Opacity and Fade in script.
//	Script copyright (C) 2008 http://www.cryer.co.uk/.
//	Script is free to use provided this copyright header is included.
///////////////////////////////////////////////////////////////////////////////
function SetOpacity(object,opacityPct) {
	// IE.
	object.style.filter		= 'alpha(opacity=' + opacityPct + ')';
	// Old mozilla and firefox
	object.style.MozOpacity	= opacityPct/100;
	// Everything else.
	object.style.opacity	= opacityPct/100;
}; // SetOpacity //////////////////////////////////////////////////////////////



///////////////////////////////////////////////////////////////////////////////
//	Veranlasst das ändern der Durchsichtigkeit
///////////////////////////////////////////////////////////////////////////////
function ChangeOpacity() {
	var oImage					= document.getElementById(g_oConfig.imageID);
	var fOpacity				= oImage.style.opacity * 100;
	var dtNow					= (new Date()).getTime();

	fOpacity					= g_oConfig.fromOpacity + (g_oConfig.toOpacity - g_oConfig.fromOpacity) * (dtNow - g_oConfig.startTime) / g_oConfig.duration;

	// Wenn das Bild komplett ausgeblendet ist
	if (fOpacity <= 0.0) SetOpacity(oImage,0);
	// Wenn das Bild komplett eingeblendet ist
	else if (fOpacity >= 100.0) {
		var oOldDIV				= document.getElementById(g_oConfig.oldID);
		var oNewDIV				= document.getElementById(g_oConfig.newID);

		oOldDIV.style.opacity	= g_oConfig.iconInactiveOpacity;
		oNewDIV.style.opacity	= g_oConfig.iconActiveOpacity;

		g_oConfig.oldID			= g_oConfig.newID;
		SetOpacity(oImage, 100.0);
		
		g_oConfig.startTime		= (new Date()).getTime();

		var oContainer			= document.getElementById(g_oConfig.containerID);
		if (oContainer.timer) window.clearTimeout(oContainer.timer);
		oContainer.timer		= window.setTimeout("PermenentFade()", g_oConfig.fadeInterval);
	} else {
		SetOpacity(oImage, fOpacity);
		oImage.timer			= window.setTimeout("ChangeOpacity()", 1);
	} // end of if
}; // ChangeOpacity ///////////////////////////////////////////////////////////



///////////////////////////////////////////////////////////////////////////////
//	Holt die SeitenID aus dem Cookie. Falls es kein cookie gibt oder etwas
//	schief läuft, wird der standardinitialwert zurückgegeben.
///////////////////////////////////////////////////////////////////////////////
function GetIndexFromCoocie() {
	var iResult						= g_oConfig.aktualIndex;

	var strCookie					= document.cookie;
	var aCookies					= strCookie.split(";");

	// Durchlaufe alle gefundenen Cookies
	for (iCounter=0; iCounter<aCookies.length; iCounter++) {
		var iPos		= aCookies[iCounter].indexOf(g_oConfig.strCookieName);

		// Wenn es das Cookie gibt
		if (iPos != -1) {
			iResult					= parseInt(aCookies[iCounter].split("=")[1]);
			break;
		} // end of if
	} // end of for

	return iResult;
}; // GetIndexFromCoocie //////////////////////////////////////////////////////



///////////////////////////////////////////////////////////////////////////////
//	Holt die SeitenID aus dem Cookie. Falls es kein cookie gibt oder etwas
//	schief läuft, wird der standardinitialwert zurückgegeben.
///////////////////////////////////////////////////////////////////////////////
function SetIndexToCoocie(iIndex) {
	var dtAblauf	= new Date();
	var dtDatum		= dtAblauf.getTime() + (30 * 60 * 1000); // 30 Minuten
	dtAblauf.setTime(dtDatum);

	var strCookie	= g_oConfig.strCookieName + '=' + iIndex + '; expires=' + dtAblauf.toGMTString();
	document.cookie = strCookie;	
}; // SetIndexToCoocie ////////////////////////////////////////////////////////



///////////////////////////////////////////////////////////////////////////////
//	Ruft die übergebene Seite auf, bzw. die Seite, die mit diesem item-index
//	verknüpft ist.
///////////////////////////////////////////////////////////////////////////////
function Navigate(iIndex) {
	var bNavigate	= g_oConfig.allowThumbnailNavigation;

	// wenn kein Index übergeben wurde, man also auf den Banner geklickt hat
	// und nicht auf das Thumbnail
	if (iIndex == undefined) {
		bNavigate		= true;
		iIndex			= g_oConfig.aktualIndex;
	} // end of if
	
	// Wenn die Seite gewechselt werden soll
	if (bNavigate) {
		SetIndexToCoocie(iIndex);
		window.location	= g_oConfig.items[iIndex].callUrl;	
	} // end of if

	return true;
}; // Navigate ////////////////////////////////////////////////////////////////



///////////////////////////////////////////////////////////////////////////////
//	Initialisiert den Bildwechsel
///////////////////////////////////////////////////////////////////////////////
function FadeImage(iIndex, bNavigate, bFirstTime) {
	if (bNavigate) {
		Navigate(iIndex);
	} // end of if
	
	var oImage						= document.getElementById(g_oConfig.imageID);
	var oDIV						= document.getElementById(g_oConfig.containerID);

	g_oConfig.aktualIndex			= iIndex;

	// Nicht beim laden der Seite
	if (!bFirstTime) {
		oDIV.style.backgroundImage	= 'url(' + oImage.src + ')';
		oDIV.style.backgroundRepeat	= 'no-repeat';
	} // end of if

	g_oConfig.newID					= g_oConfig.items[iIndex].imgID;
	SetOpacity(oImage, 0);

	oImage.src						= g_oConfig.items[iIndex].imgSrc;

	// Ggf. aktiven Timer killen
	if (oImage.timer) window.clearTimeout(oImage.timer);

	g_oConfig.startTime				= (new Date()).getTime();
	oImage.timer					= window.setTimeout("ChangeOpacity()", 10);
	
	return true;
}; // FadeImage ///////////////////////////////////////////////////////////////



///////////////////////////////////////////////////////////////////////////////
//	Realisiert ein ständiges ändern der Bilder
///////////////////////////////////////////////////////////////////////////////
function PermenentFade(bFirstTime) {
	// Nur beim laden der Seite
	if (bFirstTime) {
		var iIndex 			= GetIndexFromCoocie();
		g_oConfig.oldID		= g_oConfig.items[iIndex].imgID;
		FadeImage(iIndex)
	} else {
		var iIndex			= ++g_oConfig.aktualIndex < g_oConfig.items.length ? g_oConfig.aktualIndex : 0;
		FadeImage(iIndex);
	} // end of if

	g_oConfig.startTime		= (new Date()).getTime();

	var oContainer			= document.getElementById(g_oConfig.containerID);
	oContainer.timer		= window.setTimeout("PermenentFade()", g_oConfig.fadeInterval);
}; // PermenentFade ///////////////////////////////////////////////////////////
