var autoScrollTimeout = null;
var stage_count = 0;
var stage_width = 0;
var slider_duration = 600; // Dauer des Slidingeffekts

// HAUPTFUNKTION für den Slider
function moveStage(direction) {
	// Aktuelle Position des Sliders
	var slider_pos = $('#slider-wrapper').position();
	
	// Neue Position wird berechnet
	var new_slider_pos = 0;
	if (direction == 'left') {
		if (slider_pos.left >= 0) {
			slider_pos.left = -stage_count * stage_width;
			$('#slider-wrapper').css('left', slider_pos.left);
		}
		new_slider_pos = slider_pos.left + stage_width;
	} else {
		if (slider_pos.left <= -stage_count * stage_width) {
			slider_pos.left = 0;
			$('#slider-wrapper').css('left', slider_pos.left);
		}
		new_slider_pos = slider_pos.left - stage_width;
	}
	// Die neue Position des Sliders wird gesetzt und der Übergang animiert
	// Für andere Effekte, siehe ... http://api.jquery.com/animate/
	$('#slider-wrapper').animate({ left:new_slider_pos }, slider_duration, 'swing');
	
	startAutoScroll();
}


function startAutoScroll()
{
	stopAutoScroll();
	autoScrollTimeout = setTimeout('moveStage()', 6000);
}

function stopAutoScroll()
{
	if (autoScrollTimeout) {
		clearTimeout(autoScrollTimeout);
	}
	autoScrollTimeout = null;
}

$(document).ready(function(){
		
	stage_width = $('#content-wrapper').width(); // Breite der Seite, bzw. des Inhaltsblocks. Aktuell 955px
	
	// Der Block "slider-wrapper" wird automatisch auf die richtige breite gesetzt, also Breite der Seite mal Anzahl der Stage-Blöcke
	var slider_width = 0;
	var $wrapper = $('#slider-wrapper');

	// Anzahl und Breite der Stages
	$('.stage').each(function(){
		slider_width = slider_width + stage_width;
		stage_count++;
	});

	// erste Stage klonen
	$('.stage:eq(0)', $wrapper).clone().appendTo($wrapper);
	slider_width += stage_width;
	
	// letzte Stage klonen
	$('.stage:eq('+(stage_count-1)+')', $wrapper).clone().prependTo($wrapper);
	slider_width += stage_width;

	$wrapper.css('width',slider_width+'px');
	
	$wrapper.css('left', -stage_width);
	
	// Die Pfeile werden überwacht. Bei Klick wird die Hauptfunktion aufgerufen
	$('#arrow-left').click(function(){ moveStage('left'); });
	$('#arrow-right').click(function(){ moveStage('right'); });
	
	
	autoScrollTimeout = setTimeout('moveStage()', 6000);
	
});

// Diese Funktion öffnet die Popups
// Hier kann evtl. je nach page/popup individuelle Einstellungen vorgenommen werden
function openPopup(page) {
	stopAutoScroll();
	var popup_id = '#'+page;
	// lightbox_me Plugin von http://buckwilson.me/lightboxme/
	$(popup_id).lightbox_me({
		centered: true, 
		overlayCSS: {background: 'white', opacity: .6},
		closeSelector: '.close',
		onLoad: function() { 
			//$('#sign_up').find('input:first').focus()
		},
		onClose: function() {
			startAutoScroll();
		}
	});

}