/**
 * @author RF
 */
seiten = new Array('start', 'activida', 'fewo', 'techniken');
zeit = 1000;

$(document).ready(function() {
	bindevents();
});

function bindevents()
{
	$('.weiter').click(vonrechts);
	$('.zurueck').click(vonlinks);
	$('.' + seiten[0]).children('.projektbild').mouseenter(einblenden);
	$('.' + seiten[0]).children('.schatten').mouseleave(ausblenden);
}

function unbindevents(hover)
{
	$('.weiter').unbind('click', vonrechts);
	$('.zurueck').unbind('click', vonlinks);
	$('.' + seiten[hover]).children('.projektbild').unbind('mouseenter', einblenden);
	$('.' + seiten[hover]).children('.schatten').unbind('mouseleave', ausblenden);
}

function einblenden()
{
	$(this).siblings('.schatten').fadeIn(500);
}

function ausblenden()
{
	$(this).fadeOut(500);
}

function vonrechts()
{
	unbindevents(1);
	$('.' + seiten[2]).css('margin-left', '250px');
	$('.' + seiten[2]).animate({'opacity':0.1}, zeit, function() {});
	$('.' + seiten[3]).animate({'opacity':0}, zeit, function() {});
	//$('.' + seiten[2]).animate({'opacity':0.1, 'margin-left':'250px'}, zeit, function() {});
	//$('.' + seiten[3]).animate({'opacity':0, 'margin-left':'-200px'}, zeit, function() {});
	//$('.' + seiten[3]).animate({'opacity':0, 'margin-left':'-1100px'}, zeit, function() {});
	$('.' + seiten[1]).animate(
		{'margin-left':'-200px', 'opacity':1},
		zeit, function() {}
	);
	$('.' + seiten[0]).animate({
		'margin-left':'-650px',
		'opacity':0.1
	}, zeit, function() {
		var temp = seiten.shift();
		seiten.push(temp);
		bindevents();
		$('.' + seiten[0]).css('z-index', 10);
		$('.' + seiten[3]).css('z-index', 5);
	});
}

function vonlinks()
{
	unbindevents(3);
	$('.' + seiten[2]).css('margin-left', '-650px');
	$('.' + seiten[2]).animate({'opacity':0.1}, zeit, function() {});
	$('.' + seiten[1]).animate({'opacity':0}, zeit, function() {});
	//$('.' + seiten[2]).animate({'opacity':0.1, 'margin-left':'-650px'}, zeit, function() {});
	//$('.' + seiten[1]).animate({'opacity':0, 'margin-left':'-200px'}, zeit, function() {});
	//$('.' + seiten[1]).animate({'opacity':0, 'margin-left':'700px'}, zeit, function() {});
	$('.' + seiten[3]).animate(
		{'margin-left':'-200px', 'opacity':1},
		zeit, function() {}
	);
	$('.' + seiten[0]).animate({
		'margin-left':'250px',
		'opacity':0.1
	}, zeit, function() {
		var temp = seiten.pop();
		seiten.unshift(temp);
		bindevents();
		$('.' + seiten[0]).css('z-index', 10);
		$('.' + seiten[1]).css('z-index', 5);
	});
}