// JavaScript Document

var seitennummer	= 1;
var containername_1	= 'container1_' + seitennummer;
var containername_2 = 'container2_' + seitennummer;
var n;

function start()
{
 	seitennummer	= 1;
	var inhalt = '<div style="width: 15px; float: left;">&nbsp;</div>';
	
    for (var i = 1; i <= max_elements; i++)
	{
		inhalt = inhalt + '<div id="seiten_n' + i + '" style="width: 40px; float: left;"><a href="javaScript:ch_s(' + i + ');" class="seiten_n">' + i + '</a></div> ';
	}
	
	document.getElementById("seiten").innerHTML = inhalt;
		
	document.getElementById ('footery').style.top = '700px';
	
	
	document.getElementById('inhalt_js').style.visibility = 'visible';	
	document.getElementById('arrow_l').innerHTML = '<a href="#" style="color:#FF9900; text-decoration:none; font-weight:bold;">Zur&uuml;ck</a>';
	
	start_ani(1);
}

function start_ani(d)
{	
 	containername_1	= 'container1_' + seitennummer;
	containername_2 = 'container2_' + seitennummer;
	
	document.getElementById("seiten_n" + seitennummer).innerHTML = '[<a href="javaScript:ch_s(' + seitennummer + ');" class="seiten_n">' + seitennummer + '</a>]';
	
	document.getElementById (containername_1).style.visibility = 'visible';
	document.getElementById (containername_2).style.visibility = 'visible';
	
	if (d == 1 || d == 2) //vorwärts
	{
	 	document.getElementById(containername_1).style.top = -5 + 'px';
	 	document.getElementById(containername_2).style.top = 70 + 'px';
	 	
		animate(get_pos(1), 1, 6, 50, d, 5, false);
		animate(get_pos(2), 2, -6, 25, d, 5, false);
	}
	else //Rückwärts
	{
	 	document.getElementById (containername_1).style.top = 70 + 'px';
	 	document.getElementById (containername_2).style.top = -5 + 'px';
	 	
		animate(get_pos(1), 1, -6, 25, d, 5, false);
		animate(get_pos(2), 2, 6, 25, d, 5, false);
	}
	
	
}

function get_pos (container_id)
{
	//var y_pos_1 = '';
	
	if (container_id == 1)
	{
		return document.getElementById (containername_1).style.top.replace(/px/g, "");
	}
	else
	{
		return document.getElementById (containername_2).style.top.replace(/px/g, "");
	}
}

function animate (y_pos, container_id, step, end, d, time, v_end)
{
	if (container_id == 1)
	{
		var y_pos_1 = parseInt(y_pos);		
		
		if (d == 1)
		{
			time = Math.round(time + 0.002 * time * (80 - time));	
		}
		else if (d == 3)
		{
			time = Math.round(time + 0.002 * time * (80 - time));
		}
		
		y_pos_1 += step;
		
		if (v_end)
		{
			
			if (y_pos_1 < v_end && d <= 2 || y_pos_1 > v_end && d >= 3)
			{
			
			}
			else
			{
				document.getElementById(containername_1).style.visibility = 'hidden';
				
			}
		}
		
		if (y_pos_1 < end && d <= 2 || y_pos_1 > end && d >= 3) //100
		{
			document.getElementById (containername_1).style.top = y_pos_1 + 'px';
			
			if (d == 2)
			{
				document.getElementById(containername_1).style.height = '100px';
			}
			
			
			window.setTimeout("animate(get_pos(1), 1, " + step + ", " + end + ", " + d +", " + time + ", " + v_end + ")", time);
		}
		else
		{
			if (d == 2) //vorwärts ausblenden
			{
				document.getElementById(containername_1).style.visibility = 'hidden';
				seitennummer = n;							
				start_ani(1);
			}
			else if (d == 4) //Rückwärts ausblenden
			{
				document.getElementById(containername_1).style.visibility = 'hidden';
				seitennummer = n;
				start_ani(3);
			}			
		}
	}
	else
	{
		var y_pos_2 = parseInt(y_pos);		
		
		if (d == 1)
		{
			time = Math.round(time + 0.002 * time * (80 - time));	
		}
		else if (d == 3)
		{
			time = Math.round(time + 0.002 * time * (80 - time));
		}
		
		
		y_pos_2 += step; 
		
		/*if (v_end)
		{
			//document.getElementById ('seiten').innerHTML = y_pos_2;
			if (y_pos_2 > v_end && d <= 2 || y_pos_2 < v_end && d >= 3) //100
			{
				
			}
			else
			{
				document.getElementById(containername_2).style.visibility = 'hidden';
				
			}
		}*/
		
	
		
		if (y_pos_2 > end && d <= 2 || y_pos_2 < end && d >= 3) //100
		{
			document.getElementById (containername_2).style.top = y_pos_2 + 'px';
			window.setTimeout("animate(get_pos(2), 2, " + step + ", " + end + ", " + d +", " + time + ", " + v_end + ")", time);
		}
		else
		{
			if (d == 2 || d == 4) //vorwärts
			{
				document.getElementById(containername_2).style.visibility = 'hidden';
			}
		}
	}
}

function forward (ch_s)
{
	document.getElementById('arrow_l').innerHTML = '<a href="javaScript:backward(false);" style="color:#FF9900; text-decoration:none; font-weight:bold;">Zur&uuml;ck</a>';
	document.getElementById("seiten_n" + seitennummer).innerHTML = '<a href="javaScript:ch_s(' + seitennummer + ');" class="seiten_n">' + seitennummer + '</a>';
	//container 1 nach unten
	//container 2 nach oben
		
	animate(get_pos(1), 1, 6, 350, 2, 5, 120);
	animate(get_pos(2), 2, -6, -2, 2, 5, 2);
	
	if (!ch_s)
	{
		n = seitennummer + 1;
	}
	
	if (n == max_elements)
	{
		document.getElementById('arrow_r').innerHTML = '<a href="#" style="color: rgb(255, 153, 0); text-decoration: none; font-weight: bold;">Vor</a>';
	}
}

function backward (ch_s)
{
	document.getElementById('arrow_r').innerHTML = '<a href="javaScript:forward(false);" style="color:#FF9900; text-decoration:none; font-weight:bold;">Vor</a>';
	document.getElementById("seiten_n" + seitennummer).innerHTML = '<a href="javaScript:ch_s(' + seitennummer + ');" class="seiten_n">' + seitennummer + '</a>';
	//container 1 nach oben
	//container 2 nach unten
	
	animate(get_pos(1), 1, -6, -250, 4, 5, 2);
	animate(get_pos(2), 2, 6, 80, 4, 5, 26);
	
	if (!ch_s)
	{
		n = seitennummer - 1;
	}
	
	
	if (n == 1)
	{
		document.getElementById('arrow_l').innerHTML = '<a href="#" style="color:#FF9900; text-decoration:none; font-weight:bold;">Zur&uuml;ck</a>';
	}
}

function ch_s (sn)
{
	if (sn > seitennummer)
	{
		n = sn;
		forward(true);
	}
	else if (sn < seitennummer)
	{
		n = sn;
		backward(true);
	}
}