inactiveThumbnailOpacity = 1;
slideshowTimeoutSeconds = 3;

/****************************************
	Galerien intialisieren
	
	(theoretisch mehr als eine pro
	Seite mšglich)
****************************************/
function initEasygallery(slideShow) {
	
	var galleryContainerName = 'div.tx-frpeasygallery-pi1';
	
	$(galleryContainerName).each(function(galleryNumber) {
		initGallery(this, slideShow);
	});
} // function



/****************************************
	Einzelne Galerie intialisieren
****************************************/
function initGallery(galleryObject, startSlideShow) {
	
	
	// Alle Bildcontainer ausblenden
	$('.bilder .bild', galleryObject).hide();
	
	// Aktuelle Bildnummer auf dem Galerieobjekt speichern
	$.data(galleryObject, 'currentImageNumber', 0);
	
	// Thumbnails "dimmen"
	$('.thumbnails ul li', galleryObject).fadeTo(0,inactiveThumbnailOpacity);
	$('.thumbnails ul li', galleryObject).addClass('inactive');
	
	// Hover-Effekte Thumbnails
	$('.thumbnails ul li', galleryObject).hover(
		function(){
			if ( (!$(this).hasClass('active')) ) {
				$(this).fadeTo(100,1);
			}
		},
		function(){
			if ( (!$(this).hasClass('active')) ) {
				$(this).fadeTo(100,inactiveThumbnailOpacity);
			}
		}
	
	);
	
	
	// Anhand der Thumbnail-Links die Anzahl und Reihenfolge
	// der grossen Bilder ableiten
	var thumbnailLinks = $('.thumbnails ul li a', galleryObject);
	
	thumbnailLinks.each(function(imageNumber, element){
	
		// Jeweils Galerie-Objekt (Plugin) und Bildnummer (resp. Linknummer)
		// auf dem Thumbnail-Link merken (ist dann beim Klick abrufbar).
		$.data(this, 'galleryObject'	, galleryObject);
		$.data(this, 'imageNumber', imageNumber);
		
		// Klick-Event auf den Link anwenden
		$(this).click(function(event){
			cancelSlideShow($.data(this, 'galleryObject'));
			changeGalleryImage($.data(this, 'galleryObject'), $.data(this, 'imageNumber'));	
  		})
	});
	
	
	// Erstes Bild darstellen
	changeGalleryImage(galleryObject, $.data(galleryObject, 'currentImageNumber'));
	
	if (startSlideShow) {
		setTimeout(function() {
			kickSlideshow(galleryObject);
		}, slideshowTimeoutSeconds*1000);
	}
	
} // function initGallery



/****************************************
	Slideshow automatisch starten
****************************************/
function kickSlideshow(galleryObject) {
	var slideshowStatus = $.data(galleryObject, 'slideshowStatus');
	if (slideshowStatus != 'stopped') {
		var imageNumber = $.data(galleryObject, 'currentImageNumber');
		imageNumber = imageNumber+1;
		changeGalleryImage(galleryObject, imageNumber);
		setTimeout(function(){
			kickSlideshow(galleryObject);
		}, slideshowTimeoutSeconds*1000);
	}
} // function kickSlideshow



/****************************************
	Slideshow beenden
****************************************/
function cancelSlideShow(galleryObject) {
	$.data(galleryObject, 'slideshowStatus', 'stopped');
} // function cancelSlideShow


/****************************************
	Auslšsefunktion fŸr einen
	Bildwechsel
****************************************/
function changeGalleryImage(galleryObject, newImageNumber) {
	var fadingInProgress = $.data(galleryObject, 'fadingInProgress');
	if (fadingInProgress) {
		return false;
	}
	
	// Neue Bildnummer setzen
	$.data(galleryObject, 'newImageNumber', newImageNumber);
	
	// Bild-Div herausfinden
	var bigImageArea = $('.bilder .bild', galleryObject)[newImageNumber];
	
	// †berprŸfen, ob Bild(-nummer) Ÿberhaupt existiert, sonst erstes Bild auswŠhlen
	if (!bigImageArea) {
		changeGalleryImage(galleryObject, 0);
		return false;
	} // if
	
	
	var bildWurdeBereitsGeladen = $.data(bigImageArea, 'imageIsPreloaded');
	
	if (bildWurdeBereitsGeladen != true) {
		
		preloadAndDisplayNewImage(galleryObject);

	} else {
		displayNewImage(galleryObject)
	}
	
} // function bildwechsel initiieren

		


/****************************************
	Vorladen
****************************************/
function preloadAndDisplayNewImage(galleryObject) {
	
	// Bild-Div herausfinden
	var imageNumber = $.data(galleryObject, 'newImageNumber');
	var bigImageArea = $('.bilder .bild', galleryObject)[imageNumber];	
	$(bigImageArea).hide();
	
	// Die Bildquelle herauslesen
	var imageSource = $(bigImageArea).attr('data-source');
	
	// Neuen Bildlader instantiieren
	var imageLoader = new Image();
	$(imageLoader).load(function(event){
		$('img', bigImageArea).attr('src',imageSource);
		$.data(bigImageArea, 'imageIsPreloaded', true);
		displayNewImage(galleryObject)
	});
	
	$(imageLoader).attr('src',imageSource);

} // function vorladen




/****************************************
	Bild auswechseln 
****************************************/
function displayNewImage(galleryObject) {
	
	var fadingInProgress = $.data(galleryObject, 'fadingInProgress');
	if (fadingInProgress) {
		return false;
	} else {
		 $.data(galleryObject, 'fadingInProgress', true);
	}
	
	
	// Bild-Div fŸr die Darstellung herausfinden
	var newImageNumber = $.data(galleryObject, 'newImageNumber');
	var currentImageNumber = $.data(galleryObject,'currentImageNumber');
	
	
	// Die Bildquelle herauslesen
	var bigImageArea = $('.bilder .bild', galleryObject)[newImageNumber];	
	var imageSource = $(bigImageArea).attr('data-source');
	
	// Aktuelles Bild herauslesen
	var oldImageContainer = $('.bilder .bild', galleryObject)[currentImageNumber];
	$.data(galleryObject, 'currentImageNumber', newImageNumber);
	
	
	
	// Alle Bilder ausblenden
	var numberOfPicturesFadedOut = 0;
	$('.bilder .bild').fadeOut(200, function(){
		// Dieses Bild einblenden
		numberOfPicturesFadedOut++;
		if (numberOfPicturesFadedOut == $('.bilder .bild').length) {
			
			// Aktives/Inaktives Thumbnail setzen
			// 'altes' Thumbnail
			var oldThumbnail = $('.thumbnails ul li', galleryObject)[currentImageNumber];
			$(oldThumbnail).removeClass('active');
			$(oldThumbnail).addClass('inactive');
			$(oldThumbnail).fadeTo(100, inactiveThumbnailOpacity);
			
			// 'neues' Thumbnail
			var newThumbnail =  $('.thumbnails ul li', galleryObject)[newImageNumber];
			$(newThumbnail).fadeTo(100,1);
			$(newThumbnail).removeClass('inactive');
			$(newThumbnail).addClass('active');
			
			// Grosses Bild einblenden
			$(bigImageArea).fadeIn(500, function(){
				 $.data(galleryObject, 'fadingInProgress', false);
			});
		}
		
	});	
	
} // 




