

$(document).ready(function(){

	var autoplay = true; 
	var autoplayDelay = 4000;  // startverzoegerung der slideshow in milisec
	var autoplayDelayIsActive = false;
	//var kommtVonButton = false;	// um timeout am anfang(delay) zu unterbrechen mit fkt ClearAlert ohne autoplay zu starten wenn button gedrueckt 
	var autoplayOnLeave = true;
	var autoplayButton = false;
	var autoplayBar = true;
	var autoplayTime = 8000;
	var autoplayKorr = 100
	
	var autoplayBarHeight = '2px'; // '5px'
	var autoplayBarColor = '#ffbd00'; // '#00f'
	
	var fading = true;
	var fadingTime = 200;
	
	var vorButton = true;
	var zurueckButton = true;
	
	var direktWahl = true;
	var bulletOverUrl = "pix/bulletOver.png";
	var bulletOutUrl = "pix/bulletOut.png";
	var bulletSize = 16;
	
	var bulletPlayUrl = "pix/bulletPlay.png";
	var bulletPauseUrl = "pix/bulletPause.png";
	var bulletPlayPauseSize = 16;
	
	
	var currentPosition = 0;
	var slideWidth = 992;
	var slides = $('.slide');
	var numberOfSlides = slides.length;
	
	////////  onMouseLeave  ////////
	var hideControl = true;
	var controlIsVisible = false;
	
	var hideDirektWahl = false;
	var direktWahlIsVisible = false;
	
	var hidePlaypause = true;
	var playpauseIsVisible = false;

////////////////////////////// DO NOT CHANGE //////////////////////////////
	
    var istPositionEx;
    var idCorr;

////////////////////////////// setup DOM //////////////////////////////


	// Remove scrollbar in JS
	$('#slidesContainer').css('overflow', 'hidden');

	// Wrap all .slides with #slideInner div
	slides.wrapAll('<div id="slideInner"></div>')
    // Float left to display horizontally, readjust .slides width
	.css({
      'float' : 'left',
      'width' : slideWidth
    });

	// Set #slideInner width equal to total width of all slides
	$('#slideInner').css('width', slideWidth * numberOfSlides);
	
	
	if(autoplayBar == true){
		$('#slidesContainer').append('<div id="autoplaybar"></div>');	
		$('#autoplaybar').css('height', autoplayBarHeight);
		$('#autoplaybar').css('background-color', autoplayBarColor);
	}
  // Insert controls in the DOM
/* Direktwahl mit TextBullets
  	var direktwahlHtml = '<div id="direktwahl"><span class="controlnr" id="c0">&bull;</span><span class="controlnr" id="c1">&bull;</span><span class="controlnr" id="c2">&bull;</span><span class="controlnr" id="c3">&bull;</span></div>';
	var direktwahlHtml = '<div id="direktwahl">'
	for (i=0; i < numberOfSlides; i++){
		direktwahlHtml = direktwahlHtml+'<span class="controlnr" id="c'+i+'">&bull;</span>';
	}
	direktwahlHtml = direktwahlHtml+'</div>';
	<img src="img/bulletOut.png" id=""/>
*/
	var direktwahlHtml = '<div id="direktwahl">'
	for (i=0; i < numberOfSlides; i++){
		direktwahlHtml = direktwahlHtml+'<img src="'+bulletOutUrl+'" width="'+bulletSize+'" height="'+bulletSize+'" id="c'+i+'" class="grafikbullets"/>';
	};
	direktwahlHtml = direktwahlHtml+'</div>';

	if(vorButton == true){
		$('#slideshow').prepend('<span class="control" id="leftControl">Clicking moves left</span>');
	};
	

	
	if(zurueckButton == true){
		$('#slideshow').append('<span class="control" id="rightControl">Clicking moves right</span>');
	};
	if(direktWahl== true){
	$('#slideshow').prepend(direktwahlHtml);
	};
	$('#slideshow').prepend('<img id="playpause" src="'+bulletPauseUrl+'" width="'+bulletPlayPauseSize+'" height="'+bulletPlayPauseSize+'" alt="plapause" title="plaause">');
	if(autoplayButton == false){
		$('#playpause').attr('class','unsichtbar'); 
	};

	
	$('.control').bind('click', function(){
		if(autoplayDelayIsActive == true){
			clearAlert();
		}		
		doVorZurueck(this.id);
	});


	// aktiver bullet highlighten
	manageControls(currentPosition);

	// setup Autoplay Button (bei autoplay wird pause gezeigt
	setupAutoplayButton();

	// If auto start is on kick off the slideshow
	if(autoplay == true){  
		timeoutID = window.setTimeout(clearAlert, autoplayDelay); 
		autoplayDelayIsActive = true;
	}
	function clearAlert(){
		autoplayStart(); 
		window.clearTimeout(timeoutID); 
		autoplayDelayIsActive = false;
	}  
	
	
	
	if(hideControl == true){
		$('.control').hide();
	}
	if(hideDirektWahl == true){		
		$('#direktwahl').hide();
	}
	if(hidePlaypause == true){		
		$('#playpause').hide();
	}
	$('#slideshow').bind('mouseover', function(){ 
		if(hideControl == true){
			if(controlIsVisible == false){
			 $('.control').fadeIn(fadingTime);
			 controlIsVisible  = true;
			}
		};
		
		if(hideDirektWahl == true){		
			if(direktWahlIsVisible == false){
			 $('#direktwahl').fadeIn(fadingTime);
			 direktWahlIsVisible  = true;
			}
		}
		
		if(hidePlaypause == true && autoplayButton == true){		
			if(playpauseIsVisible == false){
			 $('#playpause').fadeIn(fadingTime);
			 playpauseIsVisible  = true;
			}
		}
		
		if(autoplayOnLeave == true){
			if( autoplayPlay == true){
				autoplayPause();
			}
		}
		
	
	});

	
	
	
	
	$('#slideshow').bind('mouseleave', function(){ 
		if(hideControl == true){
			if(controlIsVisible == true){
			 $('.control').fadeOut(fadingTime);
			 controlIsVisible  = false;
			}
		};
		
		if(hideDirektWahl == true){		
			if(direktWahlIsVisible == true){
			 $('#direktwahl').fadeOut(fadingTime);
			 direktWahlIsVisible  = false;
			}
		}
	
		if(hidePlaypause == true && autoplayButton == true){		
			if(playpauseIsVisible == true){
			 $('#playpause').fadeOut(fadingTime);
			 playpauseIsVisible  = false;
			}
		}
	
		if(autoplayOnLeave == true){
			if( autoplayPlay == false){
				autoplayStart();
			}
		}
	
	});
	
////////////////////////////// setup DOM ENDE//////////////////////////////
	
	
////////////////////////////// funktionen //////////////////////////////
	function autoplayBarStart() {
		if(autoplayBar == true){
			$("#autoplaybar").stop(true, true);
			$("#autoplaybar").css("display","visible");
			$("#autoplaybar").css("width","1px");
			$("#autoplaybar").animate({
				width: '100%',
			}, (autoplayTime-autoplayKorr), 'linear');//(autoplayTime-(autoplayTime*3/100)), 
		}
	}



	function autoplayStart(){  
		autoplayPlay = true;  
		interval = setInterval(autoplayVor, autoplayTime);  
		autoplayBarStart();
	}  
	 
	function autoplayVor(){ 
		vorZurueck('rightControl');
	   //$('#rightControl').click();  
	}  
	 
	function autoplayPause(){  
		autoplayPlay  = false;  
		clearInterval(interval); 
		$("#autoplaybar").stop(true, true); 
		$("#autoplaybar").css("width","0px");  			// ex 1px    geaendert wegen jquery 1.7.1.
		//$("#autoplaybar").css("display","none");		// hat gefunzt bei jquery 1.3.2.
	};
	
	function autoplayClick(){
		if(autoplayPlay == true){  
			$(this).attr('src',bulletPlayUrl); 
			autoplayPause(); 
		}else{  
			$(this).attr('src',bulletPauseUrl);  
			autoplayStart();  
		}  
	};
	
	function setupAutoplayButton(){  
		var autoplayButton = $('#playpause');
		if(autoplay == true){
			autoplayButton.attr('src',bulletPauseUrl);  
		}else{
			autoplayButton.attr('src',bulletPlayUrl);    
		}	
		autoplayButton.bind('click', autoplayClick);
	};
	
	function vorZurueck(controlId){
		// Determine new position
		if (autoplayPlay == true){
				autoplayBarStart() ;
		}
		
		if(fading == true){
			$('.slide').fadeOut(fadingTime);
		}
		
		currentPosition = parseInt(currentPosition); //PSICO sonst ist curren... manchmal string und es wird dann 01 oder 011 - dann will er zu bidl 11 sliden, das es ja ncht gibt
		//currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;
		currentPosition = (controlId == 'rightControl') ? currentPosition+1 : currentPosition-1;
		
		if(currentPosition >= numberOfSlides){
			currentPosition = 0;
		}
		
		if(currentPosition < 0){
			currentPosition = numberOfSlides-1;
		}
		// Hide / show controls
		manageControls(currentPosition);
		// Move slideInner using margin-left
		$('#slideInner').animate({
			'marginLeft' : slideWidth*(-currentPosition)
		});
		
		if(fading == true){
			$('.slide').fadeIn(fadingTime);
		}
	};

	function doVorZurueck(controlId){
		if (autoplayPlay == true){
			$('#playpause').click();  
		}
		vorZurueck(controlId);
	};

	function manageControls (istPosition) { // aktueller bullet wird MouseOver
	// manageControls: Hides and Shows controls depending on currentPosition
    // Hide left arrow if position is first slide
	// if(position==0){ $('#leftControl').hide() } else{ $('#leftControl').show() }
	// Hide right arrow if position is last slide
	// if(position==numberOfSlides-1){ $('#rightControl').hide() } else{ $('#rightControl').show() }

	/* fuer Text Bullets
		$('#c' + istPositionEx).attr('class','controlnr'); 
		$('#c' + istPosition).attr('class','controlnr controlnraktiv');  
		istPositionEx = istPosition;
	*/
		$('#c' + istPositionEx).attr('src', bulletOutUrl); 
		$('#c' + istPosition).attr('src', bulletOverUrl);    
		istPositionEx = istPosition;
	};

	
	
	// Create event listeners for direktanwahl von slides
	$('.grafikbullets').bind('click', function(){ //$('.controlnr').bind('click', function(){
		if(autoplayDelayIsActive == true){
			clearAlert();
		}
		if (autoplayPlay == true){
				autoplayBarStart() ;
		}
		idCorr = this.id; // id ist c1 z.b.  das c muss weg !!
		idCorr = idCorr.substring(1);
		idCorr = parseInt(idCorr);
		
		if (autoplayPlay == true){
			$('#playpause').click();  
		}

		if(currentPosition != idCorr){ // damit kein fkt aufruf nicht bei aktivem bild
	    // Determine new position
			if(fading == true){
				$('.slide').fadeOut(fadingTime);
			}
			currentPosition = parseInt(currentPosition); //PSICO sonst ist curren... manchmal string und es wird dann 01 oder 011 - dann will er zu bidl 11 sliden, das es ja ncht gibt
			currentPosition = idCorr;
			// Hide / show controls
			manageControls(currentPosition);
			// Move slideInner using margin-left
			$('#slideInner').animate({
				'marginLeft' : slideWidth*(-currentPosition)
			});
		
			if(fading == true){
				$('.slide').fadeIn(fadingTime);
			}
		}; // ND damit kein fkt
	});

////////////////////////////// funktionen ENDE //////////////////////////////





});
