/*

GEBRAUCHSANWEISUNG

- Dieser Code muss in das Textfeld vom indexhibit (direkt ganz oben, keine Leerzeichen dazwischen):

<script type="text/javascript" src="http://www.ragaprong.de/ecat_galerie/ecat_galerie_script.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.ragaprong.de/ecat_galerie/ecat_galerie_styles.css">
<div id="ecat_galerie">
	<div id="button_links"></div>
	<div id="button_rechts"></div>
	<img id="stage" src="" alt="ecat_galerie" width="558" height="350" />
	<div id="anzeige"></div>
</div>

- Die Bilder werden im Verzeichnis '/ecat_galerie/images/' abgelegt
  Das Ganze ist konzipiert für Bilder der Größe  558px x 350px

- Die Galerie selber wird hier im Script konfiguriert (siehe unten)

*/


$(document).ready(function()
{
   /* KONFIGURIERE BILDER HIER */
   /* ['/pfad/zum/bild.jpg','Bildunterschrift'] */
   var images = 	[['/ecat_galerie/images/home_slide_09.jpg',''],
					 ['/ecat_galerie/images/home_slide_01.jpg',''],
    				 ['/ecat_galerie/images/home_slide_03.jpg',''],
					 ['/ecat_galerie/images/home_slide_04.jpg',''],
    				 ['/ecat_galerie/images/home_slide_05.jpg',''],
					 ['/ecat_galerie/images/home_slide_06.jpg',''],
					 ['/ecat_galerie/images/home_slide_07.jpg',''],
   					 ['/ecat_galerie/images/home_slide_08.jpg','']];
	
	
	/* IMAGE PRELOADER */
	var cache = [];
	var number_of_images = images.length;
	for(i = 0; i != number_of_images; i++)
		{
		var cacheImage = document.createElement('img');
			cacheImage.src = images[i][0];
			cache.push(cacheImage);
		}
    
    
    /* INIT */
	var current_position = 0;
	$('#anzeige').html('' + images[current_position][1]);
    src = cache[current_position].src;
    $('#stage').attr('src', src);
    
    
    /* LINKS BLAETTERN */
    $('#button_links').click(function() {
    	
    	if(current_position > 0)
    	{
        	current_position -= 1;
       	}else{
        	/* GEHE ANS ENDE */
        	current_position = number_of_images-1;
        }
        
        $('#stage').fadeOut('fast', function() {
        	src = cache[current_position].src;
    		$('#anzeige').html('' + images[current_position][1]);
    		$('#stage').attr('src', src);
    	})
    	$('#stage').fadeIn('normal', function() {})

	});
	
	
	/* RECHTS BLAETTERN */
	$("#button_rechts").click(function() {
		
		if(current_position < number_of_images-1)
		{
			current_position += 1;
        }else{
        	/*GEHE AN DEN ANGANG */
        	current_position = 0;
        }
        
        $('#stage').fadeOut('fast', function() {
        	src = cache[current_position].src;
    		$('#anzeige').html('' + images[current_position][1]);
    		$('#stage').attr('src',src);
    	})
    	$('#stage').fadeIn('normal', function() {})
        
	});
})