var val;    // Variable f�rs Interval

var item; // Array mit den Werten f�r die Animation
var ticker = 0; //Z�hler der Frames bei der Animation
var deltaT = 0.3; 
var proSek = 30; 
var index = -1;// Variablen f�r Grafik Elemente
var z = null; // Ziel zwischenspeicher
var maxL = 765-135;
var minR = 220;
var sichtbar = 0.6;  // Wie stark der Hintergrund abgedunkelt wird
var ortInfo = false;
var liste = new Array();

function init(ziel){
 if(ziel!=null && ziel!="undefined" && ziel.length>0) {
  z = ziel;
 }

 /** Adress Leiste auswerten */
 var link = window.location.href;
 link = link.substring(link.indexOf("index"),link.indexOf(".php"));
 var GET =getParam();

 if(link=="index" ){ 
  reset(ELEM('grow'));  
  
  if((GET[0][0]=="?k" || GET[0][0]=="?ortID") && z!=null){  
   setListe();
   setImages();        
   try{   
    if(GET[0][0]=="?k"){
     index = INT(GET[0][1]); 
     item = liste[index]; 	 
    }else if(GET[0][0]=="?ortID"){
     ortInfo = true;
     if(index<0)index = INT(GET[1][1]);   
     item = liste[index];	 
     scale_done();
    }
    var neu = new Image();
    neu.src = "images/big/"+liste[index].file+".gif";
    var grow = ELEM('grow');
    grow.src = neu.src;
   }catch(e){alert(e);}   
    /** Zur�ck */
    if(!window.addEventListener) ELEM('zurueck').attachEvent('onclick',back);
    else ELEM('zurueck').addEventListener('click',back,false);	
  } else{  // wenn nicht Kategorie oder Ort anzeige
   index= -1;
  }
 }
}
/** gibt die GET Parameter in einem Array zur�ck */
function getParam(){
  var GET = window.location.search.split("&");
  for(var b=0;b<GET.length;b++) GET[b]= GET[b].split("=");
  return GET; 
}
/** Handelt den Zur�ck Button*/
function back(){
  if(z!=null){  //http://darktrotter.de/sandbox/beta/index.php?k=4&ziel=L%FCbeck
   if(ortInfo){
      var GET = getParam();
      document.location.href = "index.php?k="+GET[1][1]+"&ziel="+z;
   }
   else document.location.href = "index.php?ziel="+z;
  }else alert("Ziel ist nicht bekannt");
}

/*** Parameter f&#65533;r die Animation ****************************************************/
function setListe(){
 try{              
  liste[0] = {id:'kult',file:'kultur',W:150,H:277,w:144,h:267,t:234,l:628,T:140,L:200};//
  liste[1] = {id:'part',file:'party', W:110,H:296,w:106,h:288,t:162,l:543,T:130,L:220};
  liste[2] = {id:'plac',file:'places',W:110,H:360,w:120,h:390,t:10,l:437,T:80,L:218};//
  liste[3] = {id:'gast',file:'gastro',W:200,H:210,w:181,h:184,t:340,l:433,T:135,L:150};//
  liste[4] = {id:'shop',file:'shops' ,W:162,H:293,w:133,h:240,t:299,l:303,T:130,L:170};//
  liste[5] = {id:'hote',file:'hotel' ,W:182,H:270,w:237,h:350,t:123,l:198,T:140,L:145}; // 
 }catch(e){alert("Liste konnte nicht belegt werden \n"+e);setListe();} 
}

function setImages(){  
 try{
 bgImage("seite","traeger");
 bgImage("links","traeger");
 bgImage("oben","traeger-H");
 bgImage("unten","traeger-H"); 
 bgImage("wall","wall");
 bgImage("zurueck","zurueck");
 
 }catch(e){alert("setImages() \n"+e);}
}
function bgImage(obj,datei){
  try{
    STYLE(obj,{'#img':'images/'+datei+'.gif'}); 
  }catch(e){alert('images/'+datei+'.gif macht Probleme\n'+e);}
}

function weiter (k){
  if(z!=null)document.location.href = "index.php?k="+k+"&ziel="+z;
  else alert("Ziel ist nicht bekannt");
}
function goToStart(){
  document.location.href = "index.php?start=neu";
}
/*** Wachsen Animation ***********************************/
function scale(){
  if(index>=0){
   if(ortInfo){
    scale_done();
   }else if(z!=null) {  
    STYLE('grow',{'#top':item.t,'#left':item.l-135,'width':item.w,'height':item.h});
    scale_init();
    val = window.setInterval("wachsen()",Math.round(1000/proSek));
    }
  }
}
/*** Vorbereiten f&#65533;r das Wachsen ***************************************/
function scale_init(){
  reset(ELEM('grow'));
  STYLE('bilder',{'#left':135,'#width':706,'#height':600});
  STYLE('black',{'#top':108.,'#left':minR,'#bg-color':'#000000','#height':483-108-22});
  STYLE('oben',{'#top':getPX('black','#top')-11,'#left':getPX('black','#left')-22,'#height':22});
  STYLE('unten',{'#top':getPX('black','#top')+getPX('black','#height')-11,'#left':getPX('black','#left')-22,'#height':22});
  STYLE('fade1',{'#top':102,'#width':705,'#height':498,'#bg-color':'#000000'});
  STYLE('fade2',{'#left':288,'#width':200,'#height':102,'#bg-color':'#000000'});
  STYLE('wall',{'#width':706,'#height':450}); 
}
/*** Animation auf Endposition setzen************************************/
function scale_done(){
  scale_init();
  STYLE('black',{'#width':maxL-minR,'#height':483-130});
  STYLE('oben',{'#width':getPX('black','#width')+22*2});
  STYLE('unten',{'#width':getPX('black','#width')+22*2});
  STYLE('grow',{'#width':item.W,'#height':item.H,'#top':item.T,'#left':item.L});
  STYLE('fade1',{'#opacity':sichtbar});
  STYLE('fade2',{'#opacity':sichtbar});
  content_init(); 
}

function content_init(){ 
  STYLE('seite',{'#top':getPX('black','#top')-22,'#left':getPX('black','#left')+getPX('black','#width')-11,
		  '#width':22,'#height':getPX('black','#height')+22*2});
  STYLE('links',{'#top':getPX('seite','#top'),'#left':getPX('black','#left')-11,'#width':22,'#height':getPX('seite','#height')}); 
  STYLE('container',{'#top':getPX('oben','#top')+22,'#left':getPX('links','#left')+22*2});
  STYLE('jScroll',{'#width':getPX('seite','#left')-getPX('container','#left')+22,'#height':getPX('unten','#top')-getPX('oben','#top')-22});
  STYLE('zurueck',{'#top':getPX('unten','#top'),'#cursor':'pointer','#left':getPX('container','#left')+10,'#width':64.,'#height':23});
  STYLE('content',{'#width':getPX('seite','#left')-getPX('links','#left')+11});
}

function wachsen(){
  if(ticker/proSek<deltaT){
    ticker++;
    STYLE('grow',{'#top':fkt(item.t,item.T),'#left':fkt(item.l,item.L),'#width':fkt(item.w,item.W),'#height':fkt(item.h,item.H)});
    STYLE('fade1',{'#opacity':sichtbar*ticker/(proSek*deltaT)});
    STYLE('fade2',{'#opacity':sichtbar*ticker/(proSek*deltaT)});
  }else{
     window.clearInterval(val);
     val = window.setInterval("einschieben()",Math.round(1000/proSek));
     STYLE('links',{'#top':getPX('black','#top')-22,'#left':getPX('black','#left')-11,'#width':22,'#height':getPX('black','#height')+22*2}); 
     ticker=0;
   }
}
function einschieben(){
  if(ticker/proSek<deltaT){
    ticker++;
    STYLE('black',{'#width':fkt_weite(minR,maxL)});
    STYLE('oben',{'#width':fkt_weite(minR,maxL+22*2)});
    STYLE('unten',{'#width':fkt_weite(minR,maxL+22*2)});
  }else{
     window.clearInterval(val);
     content_init();
     ticker=0;
  }
}

/***** Funktionsberechnung ******/
function fkt_weite(start,ende){return erg = ((INT(ende)-INT(start))/deltaT*(ticker/proSek));} /** Gr��e */
function fkt(start,ende){ return erg = start+((INT(ende)-INT(start))/deltaT*(ticker/proSek));}/** Position */

function reset(obj){
  STYLE(obj,{'#top':0,'#left':0,'#width':0,'#height':0});
}
function STYLE(elem,property){
  if(typeof elem == 'string') elem = ELEM(elem);
  for(var item in property){
    switch(item){
	case 'id': elem.id = property[item];break;
	case 'class': elem.className  = property[item];break;
	case 'name': elem.name  = property[item];break;
	case 'innerHTML': elem.innerHTML = property[item];break;
	case 'width': elem.width = property[item];break;
	case 'height': elem.height = property[item];break;
	case 'type': elem.type = property[item];break;
	case 'rel': elem.rel = property[item];break;
	case 'href': elem.href = property[item];break;
	case 'src': elem.src = property[item];break;
	case '#width': elem.style.width = property[item]+'px';break;
	case '#height': elem.style.height = property[item]+'px';break;
	case '#top': elem.style.marginTop = property[item]+'px';break;
	case '#left': elem.style.marginLeft = property[item]+'px';break;
	case '#margin': elem.style.margin = property[item]+'px';break;
	case '#padding': elem.style.padding = property[item]+'px';break;
	case '#style': elem.style = property[item];;break
	case '#position': elem.style.position = property[item];break;
	case '#align': elem.style.testAlign = property[item];break;
	case '#img': elem.style.backgroundImage = 'url('+property[item]+')';break;
	case '#img-repeat': elem.style.backgroundRepeat = property[item];break;
	case '#bg-color' : elem.style.backgroundColor = property[item];break;
	case '#cursor': elem.style.cursor = property[item];break;
	case '#color': elem.style.color = property[item];break;
	case '#visible': elem.style.visibility = property[item];break;
	case '#opacity': if(elem.style.filter) elem.style.filter  = 'alpha(opacity='+property[item]*100+')';
			 else elem.style.opacity = property[item];break;
	default: alert('STYLE konnte nicht gefunden werden\n Property : '+item);
      }
    } 
}
function getSTYLE(elem,item){
  if(typeof elem == 'string') elem = ELEM(elem);
  return selectProperty(elem,item);
}
function getPX(elem,item){return INT(getSTYLE(elem,item))};

function selectProperty(elem,item){    
   var attr = null;
   try{   
    if(typeof elem !='string'){
      switch(item){
	case 'id': attr = elem.id;break;
	case 'class': attr = elem.className;break;
	case 'name': attr = elem.name;break;
	case 'innerHTML': attr = elem.innerHTML;break;
	case 'width': attr = elem.width;break;
	case 'height': attr = elem.height;break;
	case 'type': attr = elem.type;break;
	case 'rel': attr = elem.rel;break;
	case 'href': attr = elem.href;break;
	case 'src': attr = elem.src;break;
	case '#width': attr = elem.style.width;break;
	case '#height': attr = elem.style.height;break;
	case '#top': attr = elem.style.marginTop;break;
	case '#left': attr = elem.style.marginLeft;break;
	case '#margin': attr = elem.style.margin;break;
	case '#padding': attr = elem.style.padding;break;
	case '#style': attr = elem.style;break;
	case '#position': attr = elem.style.position;break;
	case '#align': attr = elem.style.testAlign;break;
	case '#img': attr = elem.style.backgroundImage;break;
	case '#img-repeat': attr = elem.style.backgroundRepeat;break;
	case '#bg-color' : attr = elem.style.backgroundColor;break;
	case '#cursor': attr = elem.style.cusor;break;
	case '#color': attr = elem.style.color;break;
	case '#visible': attr = elem.style.visibility;break;
	case '#opacity': if(elem.style.filter) {item += '#'; attr = elem.style.filter;}
			 else attr = elem.style.opacity;break;
	default: alert('STYLE konnte nicht gefunden werden\n Property : '+item);
      }
    }
  }catch(e){alert('Fehler beim Ausw�hlen von '+item+'\n'+elem);}
  return attr;  
}
function isValueWithPx(name){
  if(name =='#width' || name =='#height'|| name=='#left'|| name=='#top' || name =='#margin' || name=='#padding')return true; return false;
}
function ELEM(id){
  try{
    var elem =  document.getElementById(id);
  }catch(e){alert(id+' Element konnte nicht gefunden werden');}
  return elem;
}
function INT(obj){return parseInt(obj);}

/**** INFO ABRUFEN *************************************************/
function info(obj){
  alert(obj.id+'\ntop    : '+obj.style.top+'\nleft    : '+obj.style.left+'\nwidth  : '+obj.style.width+'\nheight : '+obj.style.height);
}