var pages = new Array();
IMGfile = new Array('animation_painting.jpg','projektion_ne.20091116-1.jpg','projektion_ne20091116-2.jpg','eul.endless_painting1.jpg','eul.endless_painting1_detail.jpg','animation_painting.jpg','bildgenerator.2.1.jpg','eul.24678.jpg','kant.jpg','walter-eul-2.0.jpg','eul-detroit.jpg','eul_green3.jpg','eul-aeon.jpg','eul-whitch.jpg','eul-crawler.jpg','eul-brooklyn.jpg','eul-fulton.jpg','eul-grand-central.jpg','eul-painted-structures.jpg','eul-generated-structures.jpg','EUL-60x30_oel_mischt_lw.jpg','eul-mandala.jpg','eul-spam.jpg','eul-spall.jpg','eul-thread.jpg','eul-nightwalk.jpg','eul_organic.jpg','eul.green.jpg','eul-flammable.jpg','eul_sphere.jpg');
var IMG = new Array();
for(i=0;i<IMGfile.length;i++){
	IMG[i] = new Image();
	IMG[i].src = '/pics/thumbs/'+IMGfile[i];
}
pages[0] = 30;pages[1] = 9;pages[2] = 1;
	var dataID = 0;
	var cID = 0;
	var anzPages = pages[dataID];
	
	var layW = 974;
	var layH = 580;
	var yDir = -1;
	var xDir = 1;
	
	var contentHTML = '';
	var store = new Array();
	var oldAOBJ=null;
	
	//	neue Vars
	var actLayID = 2;	//	aktueller Layer
	var newLay = null;
	var isActive = false;

//	Hilfsfunktion liefert Referenz auf ein DIV-Element
	function OBJ(name){
		var ret = document.getElementById(name) ? document.getElementById(name) : null;
		return ret;
	}

//	Hilfsfunktion liefert x oder y Koordinate als Zahl
	function retXYVal(val){
		var TMP = val.split('px');
		return Math.round(TMP[0]);
	}

//	neue Inhalte laden

	function newContent(newCID,newDataID){
		out();
		xDir = 0;
		yDir = 0;
		newLay = actLayID==2 ? OBJ('lay1') : OBJ('lay2');
		if(newDataID != dataID){
			//	Kapitel wechsel
			yDir = newDataID > dataID ? -1 : 1;
			newLay.style.top = (layH * yDir * -1)+'px';
			newLay.style.left= '0px';
		}else{
			//	Seitenwechsel
			xDir = newCID > cID ? -1 : 1;
			newLay.style.top = '0px';
			newLay.style.left = (layW * xDir * -1)+'px';
		}
		newLay.style.display = 'block';
		//	neuen Inhalt in Ziel-Layer
		cID = newCID;
		dataID = newDataID;
		request ('/getcontent.php', 'GET', {contentID:cID,dataID:dataID}, contentLoaded);
	}

//	Neuer Content geladen -> Animation starten
	function contentLoaded(http){
		contentHTML =  (http.status == 200)? http.responseText : 'Request failed.';
		newLay.innerHTML = contentHTML;
		setTimeout('moveLay()',150);
	}

//	Animation
	function moveLay(){
		var aniStop = false;
		var moveObj = OBJ('moveContent');
		if(xDir != 0){
			//	x-Achse
			var endPos = xDir <0 ? -layW : layW;
			var x = retXYVal(moveObj.style.left);
			var newX = x+Math.round( xDir * speed(endPos,x));
			if(xDir <0 && newX <= endPos){ 	aniStop = true;}
			if(xDir >0 && newX >= endPos){ 	aniStop = true;}
			if(!aniStop){ moveObj.style.left = newX + 'px';}
			else{ moveObj.style.left = endPos + 'px';}
		}
		if(yDir != 0){
			//	y-Achse
				endPos = yDir <0 ? -layH : layH;
			var y = retXYVal(moveObj.style.top);
			var newY = y+Math.round( yDir * speed(endPos,y));
			if(yDir <0 && newY <= endPos){ 	aniStop = true;}
			if(yDir >0 && newY >= endPos){ 	aniStop = true;}
			if(!aniStop){ moveObj.style.top = newY + 'px';}
			else{ moveObj.style.top = endPos + 'px';}
		}
		if(! aniStop){
			window.setTimeout('moveLay()',15);
		}else{
			//	Inhalt übertragen
			setNav();
			var oldLay = OBJ('lay'+actLayID);
				oldLay.style.display = 'none';
				actLayID = actLayID==1 ? 2 : 1;
			resetLay();
			isActive = false;
		}
	}
//	Geschwindigkeit
	function speed(endPos,val){
		var dist= Math.abs(endPos)-Math.abs(val);
		var sp 	= Math.abs(dist/6);
		if(sp < 3){ sp=3;}
		return sp;
	}

//	Layer zurück setzen
	function resetLay(){
		var l = new Array('moveContent','lay1','lay2');
		for(var n=0; n<l.length; n++){
			var obj = OBJ(l[n]);
			obj.style.top = '0px';
			obj.style.left ='0px';
		}
	}

//	Navigation setzen
	function setNav(){
		if(oldAOBJ!=null){
			var css = oldAOBJ.getAttribute('class');
			css = css.split('Active');
			oldAOBJ.setAttribute('class',css[0]);
		}
		var aOBJ = OBJ('a'+dataID);
		css = aOBJ.getAttribute('class');
		if(css.substr(css.length-6)!='Active'){	css = css +'Active';}
		aOBJ.setAttribute('class',css);
		oldAOBJ = aOBJ;
		var subNav = OBJ('subnav');
		var subNavHTML = '';
		if(pages[dataID]>1){
			for(var n=0; n<pages[dataID]; n++){
				if(n==cID){
					subNavHTML += '<li><a href="javascript:void()" class="active">'+(n+1)+'</a></li>';
				}else{
					subNavHTML += '<li><a href="javascript:newContent('+n+','+dataID+')" onmouseout="out()" onmouseover="showThumb('+n+')">'+(n+1)+'</a></li>';
				}
			}
		}
		subNavHTML = '<ul>'+subNavHTML+'</ul>';
		subNav.innerHTML = subNavHTML;
		setIndex();
	}

//	Index setzen
	function setIndex(){
		var lOBJ = OBJ('butl');
		var rOBJ = OBJ('butr');
		var nOBJ = OBJ('nav');
		if(pages[dataID]==1){
			store[0] = lOBJ.innerHTML;
			store[1] = rOBJ.innerHTML;
			lOBJ.innerHTML = "";
			rOBJ.innerHTML = '<img src="/pics/common/no.gif" width="33" height="1"/>';
			nOBJ.style.background = "url(/pics/common/bg.nav.inactive.gif) no-repeat";
		}else{
			if(store[0] !='' && typeof(store[0])!='undefined' ){lOBJ.innerHTML = store[0]};
			if(store[1] !='' && typeof(store[1])!='undefined' ){rOBJ.innerHTML = store[1]};
			nOBJ.style.background = "url(/pics/common/bg.nav.gif) no-repeat";
		}
		var iOBJ = OBJ('pageIndex');
		iOBJ.innerHTML = (cID+1)+'/'+pages[dataID];
	}

//	Vorwaerts - Rueckwaerts
	function stepTo(dir){
		if(!isActive){
			isActive = true;
			var newCID = cID+dir;
			if(newCID < 0){ newCID = pages[dataID]-1;}
			if(newCID >= pages[dataID]){ newCID = 0;}
			newContent(newCID,dataID);
		}
	}

//	Kapitelwechsel
	function chgMenu(which){
		if(!isActive){
			isActive = true;
			newContent(0,which);
		}
	}

//	init
	function init(){
		var nav = OBJ('nav');
			nav.innerHTML = '<ul><li class="left" id="butl"><a class="back" href="javascript:stepTo(-1)" id="back"><span>&lt;</span></a></li><li class="right" id="butr"><a class="next" href="javascript:stepTo(1)" id="next"><span>&gt;</span></a></li></ul><ul class="sub"><li id="subnav"></li></ul><ul class="main"><li><a href="javascript:chgMenu(0);" class="home" title="Home" id="a0"><span>Home</span></a></li><li><a href="javascript:chgMenu(1);" class="archiv" title="Archiv" id="a1"><span>Archiv</span></a></li><li><a href="javascript:chgMenu(2);" class="kontakt" title="Kontakt" id="a2"><span>Kontakt</span></a></li></ul><hr/><div class="clearLeft"></div>';
		setNav();
	}
	
//	Thumbnails
	function showThumb(xpos){
		if(dataID==0){
		var thumb = OBJ('thumb');
			document.images['imgThumb'].src = IMG[xpos].src;
			thumb.style.left = (document.body.clientWidth-layW)/2 + 40 + (xpos*17)+ 'px';
			thumb.style.visibility ='visible';
		}
	}
	
	function out(){
		var thumb = OBJ('thumb');
		thumb.style.visibility ='hidden';
	}