var co = 0;
		
var timeLineWidth = 550;
var timeLineTextWidth = 390;

var timeLineDivs;
var timeLineTextDivs;

document.observe("dom:loaded", function() {
	
	// Wenn nur ein Teaserbild vorhanden vor/zurueck ausblenden
	if ( c == 1 ){
		$('moveForward').hide();
		$('moveBackward').hide();
		
		timeLineDivs = $('timeline').childElements();
		timeLineDivs[0].style.backgroundImage = "url(.."+$(timeLineDivs[0].id+"_background").innerHTML+")";
	}else{
		// Erstelle das Div vor dem ersten für den Fall, dass es gleich nach Links gehen soll
		moveElementsLeft();
		
		timeLineDivs = $('timeline').childElements();
		
		timeLineDivs[0].style.backgroundImage = "url(.."+$(timeLineDivs[0].id+"_background").innerHTML+")";
		timeLineDivs[1].style.backgroundImage = "url(.."+$(timeLineDivs[1].id+"_background").innerHTML+")";
		timeLineDivs[2].style.backgroundImage = "url(.."+$(timeLineDivs[2].id+"_background").innerHTML+")";
	}
		
	
});

// Aktiviert die Buttons
function activateButtons(){
	$('moveForward').onclick = new Function("moveright();");
	$('moveBackward').onclick = new Function("moveleft();");

}

// Deaktiviert die onClick Funktion
function deactivateButtons(){
	$('moveForward').onclick = new Function("");
	$('moveBackward').onclick = new Function("");
}

// Fügt am Anfang der Liste das letzte Element hinzu
function moveElementsLeft(){
	timeLineDivs = $('timeline').childElements()
	timeLineTextDivs = $('timeline_text').childElements()
	
	
	
	
	$(timeLineDivs[0].id).insert({before: timeLineDivs[c-1]});
	$(timeLineTextDivs[0].id).insert({before: timeLineTextDivs[c-1]});
	
	timeLineDivs = $('timeline').childElements()
	
	if(!timeLineDivs[0].style.backgroundImage)
		timeLineDivs[0].style.backgroundImage = "url(.."+$(timeLineDivs[0].id+"_background").innerHTML+")";
	
	setTimelineStyle();
}

// Fügt am Ende der Liste das erste Element hinzu
function moveElementsRight(){
	
	timeLineDivs = $('timeline').childElements()
	timeLineTextDivs = $('timeline_text').childElements()
	
	
	
	$(timeLineDivs[c-1].id).insert({after: timeLineDivs[0]});
	$(timeLineTextDivs[c-1].id).insert({after: timeLineTextDivs[0]});
	
	timeLineDivs = $('timeline').childElements()
	
	if(!timeLineDivs[2].style.backgroundImage)
		timeLineDivs[2].style.backgroundImage = "url(.."+$(timeLineDivs[2].id+"_background").innerHTML+")";
	
	setTimelineStyle();
}
	
// Setzt die Positionsdaten neu, da der Move Effekt nur zur Darstellung dient und nicht zur Positions-
// verschiebung
function setTimelineStyle(){
	
	$('timeline').style.position="relative";
	$('timeline').style.left= -timeLineWidth+"px";
	$('timeline').style.top="0px";
	
	$('timeline_text').style.position="relative";
	$('timeline_text').style.left= -timeLineTextWidth+"px";
	$('timeline_text').style.top="0px";
}
	
// Schließe die Referenzen
function closeWindow(){
	new Ajax.Request('index.php?closeWindow=true', {
	  onSuccess: function(response) {
	  }
	});
}

// Öffne die Referenzen
function openWindow(){
	new Ajax.Request('index.php?openWindow=true', {
	  onSuccess: function(response) {			    
	  }
	});
}

// Wenn der rechte Button gedrückt wurde, wird die Position der Timeline nach links geschoben 
function moveright(){		
	
	deactivateButtons();
	
	
	new Effect.Move($('timeline'), { x: -timeLineWidth, y: 0 });		
	new Effect.Move($('timeline_text'), { x: -timeLineTextWidth, y: 0 });		
	co++;

	
	setTimeout('activateButtons()', 700);
	setTimeout('moveElementsRight()', 700);
	
	return;	
}

// Wenn der linke Button gedrückt wurde, wird die Position der Timeline nach rechts geschoben 
function moveleft(){		
	
	deactivateButtons();
	
	
	new Effect.Move($('timeline'), { x: timeLineWidth, y: 0 });		
	new Effect.Move($('timeline_text'), { x: timeLineTextWidth, y: 0 });		
	co--;
	
	setTimeout('activateButtons()', 700);
	setTimeout('moveElementsLeft()', 700);
	
	return;		
}	
	
// Bewege die Referenzen nach oben und blende sie aus
function moveup(){		
	
	new Effect.BlindUp($('innerTop'), { duration: 1.0 });		
	new Effect.BlindUp($('timelineButtons'), { duration: 0.4 } );		
	
	setTimeout('openmoveDownButton()', 900);		
	
	closeWindow();
	
	return;		
}		

// blende die Referenzen ein und bewege Sie nach unten
function movedown(){		
	
	new Effect.BlindDown($('innerTop'), { duration: 1.0 });	
	setTimeout('openTimelineButtons()', 900);		

	new Effect.Puff($('moveDown'), { duration: 0.4 } );

	
	openWindow();
	
	
	return;		
}		
// Wenn die Buttons eongeblendet werden. sollten diese erst kommen wenn
// Das Fenster offen ist.
function openTimelineButtons(){
	new Effect.Appear($('timelineButtons'), { duration: 0.4 } );
}

function openmoveDownButton(){
	
	new Effect.Appear($('moveDown'), { duration: 0.4 } );
}