// Globale Variablen
var cPage            = "";
var cSection         = "startup";
var bOnVeranstaltung = true;
var oXmlhttp;
var bPreload         = false;

window.onload = function () {						
	/* Check */			
	if ( $('logo_title') ) {																					
		new Effect.Scale("logo_title",100,
		                 {scaleFrom:0,
		                 	scaleFromCenter: true,
		                 	scaleMode: { originalHeight: 459, originalWidth: 609 },
		                  beforeStart: function(effect){ $('logo_title').show();} });																								                
  } else if ($('start_kasten_links')) {
  	new Effect.Parallel([new Effect.Scale("start_kasten_links", 100,
		                                      {scaleFrom:0,
		                 	                     duration: .75,
		                 	                     scaleFromCenter: true,
		                 	                     sync: true,
		                 	                     scaleMode: { originalHeight: 331, originalWidth: 355 }}),
		                 	   new Effect.Appear("start_kasten_links", {sync: true})],
		                 	   {duration: 1});
  	
  	new Effect.Parallel([new Effect.Scale("start_kasten_rechts", 100,
		                                      {scaleFrom:0,
		                 	                     duration: .75,
		                 	                     scaleFromCenter: true,
		                 	                     sync: true,
		                 	                     scaleMode: { originalHeight: 298, originalWidth: 351 }}),
		                 	   new Effect.Appear("start_kasten_rechts", {sync: true})],
		                 	   {duration: 1, delay: .25});
		
		new Effect.Parallel([new Effect.Move("start_pfeil_links",{x: -317, y:0, sync: true, mode: 'relative'}),
		                     new Effect.Move("start_pfeil_rechts",{x: 317, y:0, sync: true, mode: 'relative'})],
		                     {duration: .5, delay: 1}); 		                 	     	  							                  	                  	  	
  }        
}

function createBookmark() {	
	if (!$('bookmark')) {		
	  var oLinkDiv = document.createElement("div");	
		oLinkDiv.appendChild(document.createElement("style"));
		Element.extend(oLinkDiv);			
		oLinkDiv.id = "bookmark";			
		var oLink  = document.createElement("a");
		oLink.href = "vlg_tutgut.html";		
		oLink.id   = "bookmark_link";		
		oLink.onclick = function() {return false;};
		oLink.title = "Literatur Quickie";
		var oLinkImg = document.createElement("img");
		oLinkImg.src = "../img/abo_normal.png";		
		oLink.appendChild(oLinkImg);
		oLinkDiv.appendChild(oLink);	
		
		$('main_title').appendChild(oLinkDiv);
  }
}

function changeSection(nFrom, nTo) {			
	if (nFrom == 1 && nTo == 2) {
		new Effect.Parallel([new Effect.Move("start_pfeil_links", {sync: true, x: -350, y:0, mode: 'relative'}),
		                     new Effect.Appear("start_pfeil_links", {sync: true, from: 1, to: 0})],
		                    {duration: .25,
		                    afterFinish: function(element) { var oNewImage = document.createElement("img");		
																												 oNewImage.id  = "content";				
																												 oNewImage.src = "../img/content.png";																														 
																												 $('main_title').appendChild(oNewImage); 
																												 oNewImage = document.createElement("img");		
																												 oNewImage.id  = "content_vlg";																																 
																												 oNewImage.src = "../img/content_grey.png";																														 
																												 Element.extend(oNewImage);
																												 oNewImage.setAttribute("visibility", "hidden");																												 
																												 $('main_title').appendChild(oNewImage); 			                    	                               
		                    	                               $('start_kasten_links').hide();
		                    	                               $('start_kasten_rechts').hide();
		                    	                               createVeranstaltungsseite();
		                    	                               } });
	} else if (nFrom == 1 && nTo == 3) {
		new Effect.Parallel([new Effect.Move("start_pfeil_rechts", {sync: true, x: 350, y:0, mode: 'relative'}),
		                     new Effect.Appear("start_pfeil_rechts", {sync: true, from: 1, to: 0})],
		                    {duration: .25,
		                    afterFinish: function(element) { var oNewImage = document.createElement("img");		
																												 oNewImage.id  = "content";				
																												 oNewImage.src = "../img/content.png";																														 
																												 $('main_title').appendChild(oNewImage); 	
																												 oNewImage = document.createElement("img");		
																												 oNewImage.id  = "content_vlg";																																 
																												 oNewImage.src = "../img/content_grey.png";		
																												 Element.extend(oNewImage);																															 
																												 $('main_title').appendChild(oNewImage); 	                    	                               
		                    	                               $('start_kasten_links').hide();
		                    	                               $('start_kasten_rechts').hide();
		                    	                               createVerlagsseite();
		                    	                               } });						
	} else if (nFrom == 3 && nTo == 2) {		
		new Effect.Move("abo", {duration: .25, 
			                      x: -300,
			                      mode: 'relative',
			                      afterFinish: function() {$('main_title').removeChild($('abo'))} })			                      		
		
		new Effect.Move("veranstaltung", {duration: .25, 
			                                x: -800,
			                                y: -50,
			                                mode: 'relative',
			                                afterFinish: function() {$('main_title').removeChild($('veranstaltung'))} })			                      					                      	
		
		new Effect.Appear("booklits", {duration: .25, 
			                             from: 1, 
			                             to: 0,
			                             afterFinish: function() {$('main_title').removeChild($('booklits'))} })			                      					                      	
			 
		// new Effect.Appear("quickie_buecher", {duration: .25, from: .5, to: 1})                               			                                	
		new Effect.Parallel([new Effect.Move("vlg_titel",    {sync: true, y: 46, mode: 'relative'}),
		                     new Effect.Move("vlg_team",     {sync: true, y: 46, mode: 'relative'}),
		                     new Effect.Move("vlg_tragend",  {sync: true, y: 46, mode: 'relative'}),
							 new Effect.Move("vlg_tutgut",   {sync: true, y: 46, mode: 'relative'}),		                     
		                     new Effect.Move("vlg_tacheles", {sync: true, y: 46, mode: 'relative'}),		                     
		                     new Effect.Move("vlg_tach",     {sync: true, y: 46, mode: 'relative'}),
		                     new Effect.Move("vlg_touch",    {sync: true, y: 46, mode: 'relative'})],
		                    {duration: .25,
		                     delay: .1,
		                     afterFinish: function() {
		                     	         			           $('main_title').removeChild($('vlg_titel'));
		                     	         			           $('main_title').removeChild($('vlg_team'));
		                     	         			           $('main_title').removeChild($('vlg_tragend'));
															   $('main_title').removeChild($('vlg_tutgut'));	
		                     	         			           $('main_title').removeChild($('vlg_tacheles'));		                     	         			           
		                     	         			           $('main_title').removeChild($('vlg_tach'));
		                     	         			           $('main_title').removeChild($('vlg_touch'));
		                     	         			           createVeranstaltungsseite();
		                     	                       }});
	} else if (nFrom == 2 && nTo == 3) {
		new Effect.Move("termine", {duration: .25, 
			                          x: -350,
			                          mode: 'relative',
			                          afterFinish: function() {$('main_title').removeChild($('termine'))} })	                    	                     
		
		new Effect.Move("zumverlag", {duration: .25, 
			                            x: -800,
			                            y: -50,
			                            mode: 'relative',
			                            afterFinish: function() {$('main_title').removeChild($('zumverlag'))} })				                          	
		
		new Effect.Appear("adr_main", {duration: .25, 
			                             from: 1, 
			                             to: 0,
			                             afterFinish: function() {$('main_title').removeChild($('adr_main'))} })		
		
		new Effect.Appear("arrow", {duration: .25, 
			                          from: 1, 
			                          to: 0,
			                          afterFinish: function() {$('main_title').removeChild($('arrow'))} })	
		
		// new Effect.Appear("quickie_buecher", {duration: .25, from: 1, to: .5}) 
		
		new Effect.Parallel([new Effect.Move("button_tube",   {sync: true, y: 46, mode: 'relative'}),
		                     new Effect.Move("button_text",   {sync: true, y: 46, mode: 'relative'}),
		                     new Effect.Move("button_touch",  {sync: true, y: 46, mode: 'relative'}),		                  
		                     new Effect.Move("button_tach",   {sync: true, y: 46, mode: 'relative'}),   
		                     new Effect.Move("button_tipp",   {sync: true, y: 46, mode: 'relative'})],
		                    {duration: .25,
		                     delay: .1,
		                     afterFinish: function() {
		                     	         			           $('main_title').removeChild($('button_tube'));
		                     	         			           $('main_title').removeChild($('button_text'));
		                     	         			           $('main_title').removeChild($('button_touch'));		                     	         			           
		                     	         			           $('main_title').removeChild($('button_tach'));		                     	         			           
		                     	         			           $('main_title').removeChild($('button_tipp'));
		                     	         			           createVerlagsseite();
		                     	                       }});      			                          					                             				                            	
	}	
	return false;
}

function createVerlagsseite() {
	// Content-Area einfügen		
	insertTextarea();
	
	// Button: Abo	
	var oAbo = document.createElement("div");	
	oAbo.appendChild(document.createElement("style"));
	Element.extend(oAbo);			
	oAbo.id = "abo";	
	oAbo.style.left = "-110px";
	var oAboLink  = document.createElement("a");
	oAboLink.href = "vlg_tutgut.html";		
	oAboLink.title = "Abo";
	oAboLink.onclick = function() {return loadPage('vlg_tutgut.html');};
	var oAboImg = document.createElement("img");
	oAboImg.src = "../img/abo_normal.png";
	oAboImg.alt = "Literatur Quickie: Tut Gut";
	oAboImg.onmouseover = function () {replaceImage(oAboImg, true)};
	oAboImg.onmouseout  = function () {replaceImage(oAboImg, false)};
	oAboLink.appendChild(oAboImg);
	oAbo.appendChild(oAboLink);	
	$('main_title').appendChild(oAbo);
	
	// Button: Zur Veranstaltung
	var oVeranstaltung = document.createElement("div");	
	oVeranstaltung.appendChild(document.createElement("style"));
	Element.extend(oVeranstaltung);			
	oVeranstaltung.id = "veranstaltung";	
	oVeranstaltung.style.left = "980px";
	var oVeranstaltungLink  = document.createElement("a");
	oVeranstaltungLink.href = "main.html";		
	oVeranstaltungLink.title = "Veranstaltung";
	oVeranstaltungLink.onclick = function() {return changeSection(3,2);};
	var oVeranstaltungImg = document.createElement("img");
	oVeranstaltungImg.src = "../img/zur_veranstaltung_normal.png";
	oVeranstaltungImg.alt = "Veranstaltung";
	oVeranstaltungImg.onmouseover = function () {replaceImage(oVeranstaltungImg, true)};
	oVeranstaltungImg.onmouseout  = function () {replaceImage(oVeranstaltungImg, false)};
	oVeranstaltungLink.appendChild(oVeranstaltungImg);
	oVeranstaltung.appendChild(oVeranstaltungLink);	
	$('main_title').appendChild(oVeranstaltung);
	
	// Button: Booklits
	var oBooklits = document.createElement("div");	
	oBooklits.appendChild(document.createElement("style"));
	Element.extend(oBooklits);			
	oBooklits.id = "booklits";		
	var oBooklitsLink  = document.createElement("a");
	oBooklitsLink.href = "blg_titel.html";		
	oBooklitsLink.title = "Booklits";
	oBooklitsLink.onclick = function() {return loadPage('vlg_titel.html');};
	var oBooklitsImg = document.createElement("img");
	oBooklitsImg.src = "../img/booklits_normal.png";
	oBooklitsImg.alt = "Literatur Quickie: Titel";
	oBooklitsImg.onmouseover = function () {replaceImage(oBooklitsImg, true)};
	oBooklitsImg.onmouseout  = function () {replaceImage(oBooklitsImg, false)};
	oBooklitsLink.appendChild(oBooklitsImg);
	oBooklits.appendChild(oBooklitsLink);	
	oBooklits.setOpacity(0);
	$('main_title').appendChild(oBooklits);
	
	// Button: Tach
	var oVlgNavTach = document.createElement("div");	
	oVlgNavTach.appendChild(document.createElement("style"));
	Element.extend(oVlgNavTitel);			
	oVlgNavTach.id = "vlg_tach";	
	oVlgNavTach.onmouseover = function () {moveButton(oVlgNavTach, true)};
	oVlgNavTach.onmouseout  = function () {moveButton(oVlgNavTach, false)};	
	oVlgNavTach.style.top = "600px";
	var oVlgNavTachLink  = document.createElement("a");
	oVlgNavTachLink.href = "vlg_start.html";		
	oVlgNavTachLink.title = "Literatur Quickie Verlag: Startseite";
	oVlgNavTachLink.onclick = function() {return loadPage('vlg_start.html');};
	var oVlgNavTachImg = document.createElement("img");
	oVlgNavTachImg.src = "../img/button_vlg_tach.png";
	oVlgNavTachImg.alt = "Literatur Quickie Verlag: Startseite";	
	oVlgNavTachLink.appendChild(oVlgNavTachImg);
	oVlgNavTach.appendChild(oVlgNavTachLink);		
	$('main_title').appendChild(oVlgNavTach);
	
	// Button: Titel
	var oVlgNavTitel = document.createElement("div");	
	oVlgNavTitel.appendChild(document.createElement("style"));
	Element.extend(oVlgNavTitel);			
	oVlgNavTitel.id = "vlg_titel";	
	oVlgNavTitel.onmouseover = function () {moveButton(oVlgNavTitel, true)};
	oVlgNavTitel.onmouseout  = function () {moveButton(oVlgNavTitel, false)};	
	oVlgNavTitel.style.top = "600px";
	var oVlgNavTitelLink  = document.createElement("a");
	oVlgNavTitelLink.href = "vlg_titel.html";		
	oVlgNavTitelLink.title = "Titel";
	oVlgNavTitelLink.onclick = function() {return loadPage('vlg_titel.html');};
	var oVlgNavTitelImg = document.createElement("img");
	oVlgNavTitelImg.src = "../img/button_vlg_titel.png";
	oVlgNavTitelImg.alt = "Literatur Quickie: Titel";	
	oVlgNavTitelLink.appendChild(oVlgNavTitelImg);
	oVlgNavTitel.appendChild(oVlgNavTitelLink);		
	$('main_title').appendChild(oVlgNavTitel);
	
	// Button: Team
	var oVlgNavTeam = document.createElement("div");	
	oVlgNavTeam.appendChild(document.createElement("style"));
	Element.extend(oVlgNavTeam);			
	oVlgNavTeam.id = "vlg_team";	
	oVlgNavTeam.onmouseover = function () {moveButton(oVlgNavTeam, true)};
	oVlgNavTeam.onmouseout  = function () {moveButton(oVlgNavTeam, false)};	
	oVlgNavTeam.style.top = "600px";
	var oVlgNavTeamLink  = document.createElement("a");
	oVlgNavTeamLink.href = "vlg_team.html";		
	oVlgNavTeamLink.title = "Team";
	oVlgNavTeamLink.onclick = function() {return loadPage('vlg_team.html');};
	var oVlgNavTeamImg = document.createElement("img");
	oVlgNavTeamImg.src = "../img/button_vlg_team.png";
	oVlgNavTeamImg.alt = "Literatur Quickie: Team";	
	oVlgNavTeamLink.appendChild(oVlgNavTeamImg);
	oVlgNavTeam.appendChild(oVlgNavTeamLink);		
	$('main_title').appendChild(oVlgNavTeam);
	
	// Button: Tragend
	var oVlgNavTragend = document.createElement("div");	
	oVlgNavTragend.appendChild(document.createElement("style"));
	Element.extend(oVlgNavTragend);			
	oVlgNavTragend.id = "vlg_tragend";	
	oVlgNavTragend.onmouseover = function () {moveButton(oVlgNavTragend, true)};
	oVlgNavTragend.onmouseout  = function () {moveButton(oVlgNavTragend, false)};	
	oVlgNavTragend.style.top = "600px";
	var oVlgNavTragendLink  = document.createElement("a");
	oVlgNavTragendLink.href = "vlg_tragend.html";		
	oVlgNavTragendLink.title = "Tragend";
	oVlgNavTragendLink.onclick = function() {return loadPage('vlg_tragend.html');};
	var oVlgNavTragendImg = document.createElement("img");
	oVlgNavTragendImg.src = "../img/button_vlg_tragend.png";
	oVlgNavTragendImg.alt = "Literatur Quickie: Tragend";	
	oVlgNavTragendLink.appendChild(oVlgNavTragendImg);
	oVlgNavTragend.appendChild(oVlgNavTragendLink);		
	$('main_title').appendChild(oVlgNavTragend);
	
	// Button: Tut gut	
	var oVlgNavTutgut = document.createElement("div");	
	oVlgNavTutgut.appendChild(document.createElement("style"));
	Element.extend(oVlgNavTutgut);			
	oVlgNavTutgut.id = "vlg_tutgut";	
	oVlgNavTutgut.onmouseover = function () {moveButton(oVlgNavTutgut, true)};
	oVlgNavTutgut.onmouseout  = function () {moveButton(oVlgNavTutgut, false)};	
	oVlgNavTutgut.style.top = "600px";
	var oVlgNavTutgutLink  = document.createElement("a");
	oVlgNavTutgutLink.href = "vlg_tutgut.html";		
	oVlgNavTutgutLink.title = "TutGut";
	oVlgNavTutgutLink.onclick = function() {return loadPage('vlg_tutgut.html');};
	var oVlgNavTutgutImg = document.createElement("img");
	oVlgNavTutgutImg.src = "../img/button_vlg_tutgut.png";
	oVlgNavTutgutImg.alt = "Literatur Quickie: Tut gut";	
	oVlgNavTutgutLink.appendChild(oVlgNavTutgutImg);
	oVlgNavTutgut.appendChild(oVlgNavTutgutLink);		
	$('main_title').appendChild(oVlgNavTutgut);
	
	// Button: Tacheles
	var oVlgNavTacheles = document.createElement("div");	
	oVlgNavTacheles.appendChild(document.createElement("style"));
	Element.extend(oVlgNavTacheles);			
	oVlgNavTacheles.id = "vlg_tacheles";	
	oVlgNavTacheles.onmouseover = function () {moveButton(oVlgNavTacheles, true)};
	oVlgNavTacheles.onmouseout  = function () {moveButton(oVlgNavTacheles, false)};	
	oVlgNavTacheles.style.top = "600px";
	var oVlgNavTachelesLink  = document.createElement("a");
	oVlgNavTachelesLink.href = "vlg_tacheles.html";		
	oVlgNavTachelesLink.title = "Tragend";
	oVlgNavTachelesLink.onclick = function() {return loadPage('vlg_tacheles.html');};
	var oVlgNavTachelesImg = document.createElement("img");
	oVlgNavTachelesImg.src = "../img/button_vlg_tacheles.png";
	oVlgNavTachelesImg.alt = "Literatur Quickie: Tacheles";	
	oVlgNavTachelesLink.appendChild(oVlgNavTachelesImg);
	oVlgNavTacheles.appendChild(oVlgNavTachelesLink);		
	$('main_title').appendChild(oVlgNavTacheles);
	
	// Button: Touch
	var oVlgNavTouch = document.createElement("div");	
	oVlgNavTouch.appendChild(document.createElement("style"));
	Element.extend(oVlgNavTouch);			
	oVlgNavTouch.id = "vlg_touch";	
	oVlgNavTouch.onmouseover = function () {moveButton(oVlgNavTouch, true)};
	oVlgNavTouch.onmouseout  = function () {moveButton(oVlgNavTouch, false)};	
	oVlgNavTouch.style.top = "600px";
	var oVlgNavTouchLink  = document.createElement("a");
	oVlgNavTouchLink.href = "vlg_touch.html";		
	oVlgNavTouchLink.title = "Tragend";
	oVlgNavTouchLink.onclick = function() {return loadPage('vlg_touch.html');};
	var oVlgNavTouchImg = document.createElement("img");
	oVlgNavTouchImg.src = "../img/button_vlg_touch.png";
	oVlgNavTouchImg.alt = "Literatur Quickie: Touch(Verlag)";	
	oVlgNavTouchLink.appendChild(oVlgNavTouchImg);
	oVlgNavTouch.appendChild(oVlgNavTouchLink);		
	$('main_title').appendChild(oVlgNavTouch);
	
	// Einblenden	
	new Effect.Parallel([new Effect.Move("abo", {sync: true, x: 122, y:440, mode: 'absolute'})],		                    
		                    {duration: .5});
	
	new Effect.Parallel([new Effect.Move("veranstaltung", {sync: true, x: 557, y:72, mode: 'absolute'})],		                    
		                    {duration: .5});
	
	new Effect.Appear("booklits",        {duration: .5});
			
	if (bOnVeranstaltung) {		
		new Effect.Appear("quickie_buecher", {duration: .5, from: 1, to: .5});
		new Effect.Appear("vlg_plane",  {duration: .25, delay: 0, from: 0, to: .25});									
		bOnVeranstaltung = false;
	}
	
	$("content_vlg").style.visibility = "visible";	
	new Effect.Move("vlg_tach",     {duration: .2, delay: 0,  x: 180, y: 571, mode: 'absolute'});
	new Effect.Move("vlg_titel",    {duration: .2, delay: .1, x: 265, y: 571, mode: 'absolute'});
	new Effect.Move("vlg_team",     {duration: .2, delay: .2, x: 350, y: 571, mode: 'absolute'});
	new Effect.Move("vlg_tragend",  {duration: .2, delay: .3, x: 435, y: 571, mode: 'absolute'});
	new Effect.Move("vlg_tutgut",   {duration: .2, delay: .4, x: 520, y: 571, mode: 'absolute'});
	new Effect.Move("vlg_tacheles", {duration: .2, delay: .5, x: 605, y: 571, mode: 'absolute'});
	new Effect.Move("vlg_touch",    {duration: .2, delay: .6, x: 690, y: 571, mode: 'absolute'});
						
	// Hauptseite laden
	loadPage("vlg_start.html");
}

function createVeranstaltungsseite() {
	// Content-Area einfügen		
	insertTextarea();
	
	// Button: Termine
	var oTermine = document.createElement("div");	
	oTermine.appendChild(document.createElement("style"));
	Element.extend(oTermine);			
	oTermine.id = "termine";	
	oTermine.style.left = "-205px";
	var oTermineLink  = document.createElement("a");
	oTermineLink.href = "termine.html";		
	oTermineLink.title = "Termine";
	oTermineLink.onclick = function() {return loadPage('termine.html');};
	var oTermineImg = document.createElement("img");
	oTermineImg.src = "../img/termine_normal.png";
	oTermineImg.alt = "Literatur Quickie: Termine";
	oTermineImg.onmouseover = function () {replaceImage(oTermineImg, true)};
	oTermineImg.onmouseout  = function () {replaceImage(oTermineImg, false)};
	oTermineLink.appendChild(oTermineImg);
	oTermine.appendChild(oTermineLink);	
	$('main_title').appendChild(oTermine);
	
	// Button: 439 Adresse
	var oAdr = document.createElement("div");
	Element.extend(oAdr);			
	oAdr.appendChild(document.createElement("style"));
	oAdr.id = "adr_main";	
	oAdr.style.left = "1000px";
	var oAdrLink  = document.createElement("a");
	oAdrLink.href = "adresse.html";		
	oAdrLink.title = "439 Adresse";
	oAdrLink.onclick = function() {return loadPage('adresse.html');};
	var oAdrImg = document.createElement("img");
	oAdrImg.src = "../img/adr_main_normal.png";
	oAdrImg.alt = "Literatur Quickie: 439";
	oAdrImg.onmouseover = function () {replaceImage(oAdrImg, true)};
	oAdrImg.onmouseout  = function () {replaceImage(oAdrImg, false)};
	oAdrLink.appendChild(oAdrImg);
	oAdr.appendChild(oAdrLink);	
	$('main_title').appendChild(oAdr);
	
	// Pfeil
	var oArrow = document.createElement("div");
	Element.extend(oArrow);			
	oArrow.appendChild(document.createElement("style"));
	oArrow.id = "arrow";	
	oArrow.style.top = "-200px";
	var oArrowImg = document.createElement("img");
	oArrowImg.src = "../img/arrow_click.png";
	oArrowImg.alt = "Pfeil";
	oArrow.appendChild(oArrowImg);
	$('main_title').appendChild(oArrow);
	
	// Button: Zum Verlag
	var oVerlag = document.createElement("div");	
	oVerlag.appendChild(document.createElement("style"));
	Element.extend(oVerlag);			
	oVerlag.id = "zumverlag";			
	var oVerlagLink  = document.createElement("a");
	oVerlagLink.href = "vlg_start.html";		
	oVerlagLink.title = "Verlag";
	oVerlagLink.onclick = function() {return changeSection(2,3);};
	var oVerlagImg = document.createElement("img");
	oVerlagImg.src = "../img/zum_verlag_normal.png";
	oVerlagImg.alt = "Literatur Quickie: Verlag";
	oVerlagImg.onmouseover = function () {replaceImage(oVerlagImg, true)};
	oVerlagImg.onmouseout  = function () {replaceImage(oVerlagImg, false)};
	oVerlagLink.appendChild(oVerlagImg);
	oVerlag.appendChild(oVerlagLink);	
	oVerlag.setOpacity(0);
	$('main_title').appendChild(oVerlag);
	
	// Buttons: Startseite
	var oNavStart = document.createElement("div");
	Element.extend(oNavStart);			
	oNavStart.appendChild(document.createElement("style"));
	oNavStart.id = "button_tach";		
	oNavStart.onmouseover = function () {moveButton(oNavStart, true)};
	oNavStart.onmouseout  = function () {moveButton(oNavStart, false)};
	oNavStart.style.top = "600px";
	var oNavStartLink  = document.createElement("a");
	oNavStartLink.href = "main.html";		
	oNavStartLink.title = "Tach";
	oNavStartLink.onclick = function() {return loadPage('main.html');};
	var oNavStartImg = document.createElement("img");
	oNavStartImg.src = "../img/button_tach.png";
	oNavStartImg.alt = "Literatur Quickie";	
	oNavStartLink.appendChild(oNavStartImg);
	oNavStart.appendChild(oNavStartLink);	
	$('main_title').appendChild(oNavStart);
	
	// Buttons: Tube
	var oNavTube = document.createElement("div");
	Element.extend(oNavTube);			
	oNavTube.appendChild(document.createElement("style"));
	oNavTube.id = "button_tube";		
	oNavTube.onmouseover = function () {moveButton(oNavTube, true)};
	oNavTube.onmouseout  = function () {moveButton(oNavTube, false)};
	oNavTube.style.top = "600px";
	var oNavTubeLink  = document.createElement("a");
	oNavTubeLink.href = "tube.html";		
	oNavTubeLink.title = "Tube";
	oNavTubeLink.onclick = function() {return loadPage('tube.html');};
	var oNavTubeImg = document.createElement("img");
	oNavTubeImg.src = "../img/button_tube.png";
	oNavTubeImg.alt = "Literatur Quickie: Tube";	
	oNavTubeLink.appendChild(oNavTubeImg);
	oNavTube.appendChild(oNavTubeLink);	
	$('main_title').appendChild(oNavTube);
	
	// Buttons: Text
	var oNavText = document.createElement("div");
	Element.extend(oNavText);			
	oNavText.appendChild(document.createElement("style"));
	oNavText.id = "button_text";		
	oNavText.onmouseover = function () {moveButton(oNavText, true)};
	oNavText.onmouseout  = function () {moveButton(oNavText, false)};
	oNavText.style.top = "600px";
	var oNavTextLink  = document.createElement("a");
	oNavTextLink.href = "text.html";		
	oNavTextLink.title = "Text";
	oNavTextLink.onclick = function() {return loadPage('text.html');};
	var oNavTextImg = document.createElement("img");
	oNavTextImg.src = "../img/button_text.png";
	oNavTextImg.alt = "Literatur Quickie: Text";	
	oNavTextLink.appendChild(oNavTextImg);
	oNavText.appendChild(oNavTextLink);	
	$('main_title').appendChild(oNavText);
	
	// Buttons: Touch
	var oNavTouch = document.createElement("div");
	Element.extend(oNavTouch);			
	oNavTouch.appendChild(document.createElement("style"));
	oNavTouch.id = "button_touch";		
	oNavTouch.onmouseover = function () {moveButton(oNavTouch, true)};
	oNavTouch.onmouseout  = function () {moveButton(oNavTouch, false)};
	oNavTouch.style.top = "600px";
	var oNavTouchLink  = document.createElement("a");
	oNavTouchLink.href = "text.html";		
	oNavTouchLink.title = "Touch";
	oNavTouchLink.onclick = function() {return loadPage('touch.html');};
	var oNavTouchImg = document.createElement("img");
	oNavTouchImg.src = "../img/button_touch.png";
	oNavTouchImg.alt = "Literatur Quickie: Touch";	
	oNavTouchLink.appendChild(oNavTouchImg);
	oNavTouch.appendChild(oNavTouchLink);	
	$('main_title').appendChild(oNavTouch);
	
	// Buttons: Tipp
	var oNavTipp = document.createElement("div");
	Element.extend(oNavTipp);			
	oNavTipp.appendChild(document.createElement("style"));
	oNavTipp.id = "button_tipp";		
	oNavTipp.onmouseover = function () {moveButton(oNavTipp, true)};
	oNavTipp.onmouseout  = function () {moveButton(oNavTipp, false)};
	oNavTipp.style.top = "600px";
	var oNavTippLink  = document.createElement("a");
	oNavTippLink.href = "tipp.html";		
	oNavTippLink.title = "Tipp";
	oNavTippLink.onclick = function() {return loadPage('tipp.html');};
	var oNavTippImg = document.createElement("img");
	oNavTippImg.src = "../img/button_tipp.png";
	oNavTippImg.alt = "Literatur Quickie: Tipp";	
	oNavTippLink.appendChild(oNavTippImg);
	oNavTipp.appendChild(oNavTippLink);	
	$('main_title').appendChild(oNavTipp);
	
	// Einblenden
	new Effect.Parallel([new Effect.Move("termine", {sync: true, x: 120, y:435, mode: 'absolute'})],		                     
		                    {duration: .5});
	
	new Effect.Parallel([new Effect.Move("adr_main", {sync: true, x: 777, y:425, mode: 'absolute'})],		                    
		                    {duration: .5});
	
	new Effect.Appear("zumverlag", {duration: .5});
			
	new Effect.Parallel([new Effect.Move("arrow", {sync: true, x: 840, y:310, mode: 'absolute'})],		                     
		                    {duration: .5});
		
  if (!bOnVeranstaltung) {
		new Effect.Appear("quickie_buecher", {duration: .5, from: .5, to: 1});
		new Effect.Appear("vlg_plane",  {duration: .25, delay: 0, from: .25, to: 0});		
		bOnVeranstaltung = true;
	}
	
	$("content_vlg").style.visibility = "hidden";
	new Effect.Move("button_tach",  {duration: .2, delay: .1, x: 230, y: 571, mode: 'absolute'});
	new Effect.Move("button_tube",  {duration: .2, delay: .2, x: 315, y: 571, mode: 'absolute'});
	new Effect.Move("button_text",  {duration: .2, delay: .3, x: 390, y: 571, mode: 'absolute'});
	new Effect.Move("button_touch", {duration: .2, delay: .4, x: 468, y: 571, mode: 'absolute'});
	new Effect.Move("button_tipp",  {duration: .2, delay: .5, x: 547, y: 571, mode: 'absolute'});
			
	// Hauptseite laden
	loadPage("main.html");
}

function insertTextarea() {
	if (!$("text")) {		
		var oText = document.createElement("div")
		oText.appendChild(document.createElement("style"));		
		
		// Eigenschaften		
		oText.id                    = "text";
		oText.style.position        = "absolute";
		oText.style.top             = "160px";
		oText.style.left            = "180px";
		oText.style.width           = "637px";
		oText.style.height          = "275px";
		oText.style.zIndex          = "20";
		oText.style.color           = "#fff";	
		oText.style.backgroundColor = "transparent";
		oText.style.overflow        = "visible";
		oText.style.padding         = "0"
		oText.style.lineHeight      = "1.2em";
		oText.style.font            = "12px Verdana";
									
		$('main_title').appendChild(oText); 								
	}
}

function gotoMain() {
	new Effect.Fade("main_title",
	                {duration: .3,
	                afterFinish: function(element) { loadPage('main.html') } });	
	return false;
}

function clickIt(cPage) {
	
	return false;
}

function loadPage(cUrl) {
	// Page
	cPage = cUrl;
	
	// Http Objekt erschaffen ODER Anfrage abbrechen
	if (!oXmlhttp) {
		oXmlhttp = zXmlHttp.createRequest();			
	} else if (oXmlhttp.readyState != 0) {
		oXmlhttp.abort();
	}
			
	// Senden
	oXmlhttp.open("get",cUrl,true);
		oXmlhttp.onreadystatechange = function () {						
			if (oXmlhttp.readyState == 4) {				  				
					if (oXmlhttp.status == 200) {
					  // Einfaches austauschen					  
					  insertPage(oXmlhttp);					  					  
					  
					  // Bookmark anpassen
					  if ($('bookmark_link')) {
					  	$('bookmark_link').setAttribute("href", cUrl);					  				  
					  }
					} else {
						alert("Es gab einen Fehler beim holen der Seitendaten!\n\nFehlernummer: "+oXmlhttp.status );						
					}  					
			}										
		}				
		oXmlhttp.send(null);	1
		
		return false;
}

function insertPage(oXml) {											  
	if (false && cPage=="main.html" && $('main_title')) {		
		var cHtml = oXml.responseText.substring(oXml.responseText.indexOf('<body>')+6);
	  cHtml     = cHtml.substr(0,cHtml.indexOf('</body>'));						
	  /*
		$$('body')[0].hide()
		document.getElementsByTagName('body')[0].innerHTML = cHtml;							
		// $('main_content').hide();
		$$('body')[0].show()
		
		// Buttons "runterdrücken"
		$('button_tube').style.top  = "601px";
		$('button_text').style.top  = "601px";
		$('button_touch').style.top = "601px";
		$('button_tipp').style.top  = "601px";
		$('arrow').style.top  = "-120px";
		
		// new Effect.Appear("main_content",{duration: .3});
		
		new Effect.Move("button_tube",{y:-30})
		new Effect.Move("button_text",{y:-30, delay: .2})
		new Effect.Move("button_touch",{y:-30, delay: .4})
		new Effect.Move("button_tipp",{y:-30, delay: .6})
		
		new Effect.Move("arrow",{y:425, delay: .6, duration: .5})
		*/
	} else {
		var cHtml = oXml.responseText.substring(oXml.responseText.indexOf('<div id="text">')+15);
	  cHtml     = cHtml.substr(0,cHtml.lastIndexOf('</div>',cHtml.lastIndexOf('</div>')-1));		  	  	  
	  document.getElementById("text").innerHTML = cHtml;	  	  		  	     	  
	}
}

function replaceImage(oImage, lIn) {
	if (lIn) {
		oImage.src = oImage.src.replace("normal","over");			
	} else {
		oImage.src = oImage.src.replace("over","normal");		
	}
}

function moveButton(oButton,lIn) {
		
	if (lIn) {
		if (oButton.getAttribute("id") == "adr_main" 				
		    || oButton.getAttribute("id") == "termine") {			
			
			var img = oButton.getElementsByTagName("img")[0];						
			img.src = img.src.replace("normal","over");			
		} else {
			new Effect.Move(oButton,{duration: .1, y: -10, queue: {scope: oButton.getAttribute("id"), position: 'end'}});
		}
	} else {
		if (oButton.getAttribute("id") == "adr_main" || oButton.getAttribute("id") == "termine") {			
			var img = oButton.getElementsByTagName("img")[0];						
			img.src = img.src.replace("over","normal");	                            
		} else {
			new Effect.Move(oButton,{duration: .1,
				                       y: +10,
				                       afterFinish: function() {oButton.style.top = "571px"},
				                       queue: {scope: oButton.getAttribute("id"), position: 'end'}});
		}
	}
}

/*************************************************************************************************************************/

function foto_over(oFoto,lIn) {
	if (lIn) {
		new Effect.Opacity(oFoto,{from: 1, to: .75, queue: {scope: oFoto.src, position: 'end'}, duration: .1});
	} else {
		new Effect.Opacity(oFoto,{from: .75, to: 1, queue: {scope: oFoto.src, position: 'end'}, duration: .1});
	}
	
	oFoto.style.cursor = 'pointer';
}

function foto_click(oFoto) {
	prepareFotoPlane( (oFoto) ? oFoto.src : undefined, "katalog.xml" );    
}

function booklit_click(oBooklit) {	
	prepareFotoPlane( "../img/fotos/booklits/booklits.png", "booklits.xml", oBooklit.src.substr(0, oBooklit.src.lastIndexOf("_front.jpg")) + ".jpg");    
}

/*************************************************************************************************************************/

function prepareFotoPlane(cStartNode, cKatalog, cShowPic) {	
	
	// Startknoten
	cStartNode = (cStartNode) ? "../img/fotos" + cStartNode.substr(cStartNode.lastIndexOf("/",cStartNode.lastIndexOf("/")-1)) : undefined;
	
	// Fläche für den Viewer erschaffen
	var oPlane = document.createElement("div");
	var oStyle  = document.createElement("style");                            
	var oBody   = Element.extend(document.getElementsByTagName("body")[0]);
	
	oPlane.appendChild(oStyle);
	oPlane.style.position        = 'absolute';
	oPlane.style.width           = oBody.getWidth()+"px";
	oPlane.style.height          = oBody.getHeight()+"px";
	oPlane.style.top             = '0px';
	oPlane.style.left            = '0px';
	oPlane.style.zIndex          = '110';
	oPlane.style.backgroundColor = '#000';
	oPlane.style.overflow        = 'hidden';
	oPlane.style.filter          = 'alpha(opacity=0)';
	oPlane.id                    = 'viewer_plane';
	
	oPlane.onclick = end_viewer;
		          			
	// Um Protype Eigenschaften erweitern & an den Body anhängen
	Element.extend(oPlane);			
	oPlane.setOpacity(0);			
	oBody.appendChild(oPlane);
	
	// Erscheinen lassen	
	new Effect.Opacity(oPlane,{from: 0, to: .95, duration: .5, queue: {scope: 'plane', position: 'end'}});		
		
	// Navigationelement erschaffen
	var oMainNav = document.createElement("div");
	var oStyle   = document.createElement("style")      
	oMainNav.appendChild(oStyle);
	oMainNav.style.position         = 'absolute';
	oMainNav.style.width            = "925px";
	oMainNav.style.height           = "100px";
	oMainNav.style.top              = '-100px';
	oMainNav.style.zIndex           = '111';
	oMainNav.style.left             = ((oBody.getWidth() / 2) - 450) + "px";
	oMainNav.style.backgroundColor  = 'transparent';	
	oMainNav.style.backgroundRepeat = 'no-repeat';
	oMainNav.id                     = 'main_navigation';
	
	var oBrowser = new ImageBrowser(cKatalog,	 
	                               {size : [885,100],
	                               	boxBackgroundImage : "../img/imageBrowse_boxback.png",	                    
	                               	parentObject: oMainNav,
	                               	startNode   : cStartNode,
	                               	showPic     : cShowPic,
	                                viewer: new ImageViewer({id: "img_viewer",
	                                	                       minTop: 115}) });
	
	// Buttons
	var oButtons = document.createElement("div")
	var oImg;
	oButtons.appendChild(document.createElement("style"));
	
	oButtons.style.position        = 'absolute';
	oButtons.style.width           = '20px';
	oButtons.style.height          = '95px';
	oButtons.style.top             = '5px';
	oButtons.style.left            = '900px';
	oButtons.style.backgroundColor = 'transparent';	
	
	oImg = document.createElement("img")
	oImg.src = "../img/galerie_button_close_normal.png";
	oImg.style.cursor = "pointer";	
	oImg.style.paddingBottom = "5px";
	
	Event.observe(oImg,"mouseover",function(ev) { ev.target.src="../img/galerie_button_close_over.png" });
	Event.observe(oImg,"mouseout", function(ev) { ev.target.src="../img/galerie_button_close_normal.png" });
	Event.observe(oImg,"click",end_viewer);
	oButtons.appendChild(oImg);
	
	oImg = document.createElement("img")
	Event.observe(oImg,"mouseover",function(ev) { ev.target.src="../img/galerie_button_back_over.png" });
	Event.observe(oImg,"mouseout", function(ev) { ev.target.src="../img/galerie_button_back_normal.png" });
	Event.observe(oImg,"click",function() { oBrowser.oViewer.gotoColumn(1) });
	oImg.src = "../img/galerie_button_back_normal.png";
	oImg.style.paddingBottom = "5px";
	oImg.style.cursor = "pointer";	
	oButtons.appendChild(oImg);
		
	oImg = document.createElement("img")
	Event.observe(oImg,"mouseover",function(ev) { ev.target.src="../img/galerie_button_help_over.png" });
	Event.observe(oImg,"mouseout", function(ev) { ev.target.src="../img/galerie_button_help_normal.png"
		                                            if ($('__help__')) {
		                                            	 $('main_navigation').removeChild($('__help__'));
		                                            } });
	Event.observe(oImg,"click",openHelp);
	oImg.src = "../img/galerie_button_help_normal.png";
	oImg.style.cursor = "pointer";	
	oButtons.appendChild(oImg);	
	
	oMainNav.appendChild(oButtons);
	
	oBody.appendChild(oMainNav);
	new Effect.Move(oMainNav,{y: 105, duration: .5, mode: 'relative', queue: {scope: 'plane', position: 'end'}});					
}

function openHelp() {
	if (! $('__help__')) {
		var oHelp = document.createElement("div");
		oHelp.appendChild(document.createElement("style"));
		Element.extend(oHelp);
		
		oHelp.id                    = '__help__';
		oHelp.style.position        = 'absolute';
		oHelp.style.right           = '5px';
		oHelp.style.top             = '110px';
		oHelp.style.width           = '300px';		
		oHelp.style.zIndex          = '101';
		oHelp.style.border          = '1px solid #909090';
		oHelp.style.padding         = '10px';
		oHelp.style.backgroundColor = 'rgb(230,230,190)';		
		oHelp.style.font            = '10px Verdana';
		oHelp.style.color           = '#000000';
		oHelp.style.zIndex          = '999';
		
		// Inhalt
		oHelp.innerHTML = "<img src='../img/galerie_button_close_normal.png' /> Fotogalerie schlie&szlig;en <br /><br />" + 
		                  "<img src='../img/galerie_button_back_normal.png' /> Zur Galerieauswahl gehen <br /><br />" +
		                  "Um die Galerieleiste nach links/rechts zu verschieben (wenn m&ouml;glich): Maustaste auf Ihr gedrückt halten und die Maus in die entsprechende Richtung bewegen."
			
		$('main_navigation').appendChild(oHelp);	
	}
}

function end_viewer() {
	var oBody   = Element.extend(document.getElementsByTagName("body")[0]);
	
	// Element entfernen und 'Flow' wiederherstellen
	if ($("viewer_plane")) {
		oBody.removeChild($("viewer_plane"));
	}
	
	if ($("main_navigation")) {
		oBody.removeChild($("main_navigation"));	
	}
	
	if ($("img_viewer")) {
		oBody.removeChild($("img_viewer"));
	}
	
	if ($("lade_bild")) {
		oBody.removeChild($("lade_bild"));
	}
}

/************************************************************************************************************/

/* Dies ist die ImageViewer Klasse  */

function ImageViewer(oParameter) {
	this.oViewPlane;             // Hier "drinnen" werden die Fotos angezeigt
	this.oParameter;             // Parameter
	this.mutex;
	
	// Parameter 
	oParameter                 = (oParameter) ? oParameter : {};
	this.oParameter            = oParameter;	
	oParameter.backgroundColor = (oParameter.backgroundColor) ? oParameter.backgroundColor : "#f0f0f0";
	oParameter.border          = (oParameter.border) ? oParameter.border : "1px dotted black";
	oParameter.padding         = (oParameter.padding) ? oParameter.padding : 10;
	oParameter.parentObject    = (oParameter.parentObject) ? oParameter.parentObject : document.getElementsByTagName("body")[0];
	oParameter.minTop          = (oParameter.minTop)  ? oParameter.minTop  : 0;
	oParameter.minLeft         = (oParameter.minLeft) ? oParameter.minLeft : 0;
	oParameter.zIndex          = (oParameter.zIndex) ? oParameter.zIndex : "150";
	oParameter.id              = (oParameter.id) ? oParameter.id : "__ImageViewer__";
	
	// Methodem zum Anzeigen //////////////////////////////////////////////////////////////////////////////////
	this.buildViewer = function() {
		var oImage;
				
		this.oViewPlane = document.createElement("div");
		this.oViewPlane.appendChild(document.createElement("style"));
		Element.extend(this.oViewPlane);
		
		// Konfigurieren	
		this.oViewPlane.style.backgroundColor = this.oParameter.backgroundColor;
		this.oViewPlane.style.border          = this.oParameter.border;					
		this.oViewPlane.style.position        = "absolute";
		this.oViewPlane.style.filter          = "alpha(opacity=0)";
		this.oViewPlane.style.zIndex          = this.oParameter.zIndex;
		
		// Erstmal vollständig transparent machen
		this.oViewPlane.setStyle({opacity: 0});
		
		// Anfügen
		this.oParameter.parentObject.appendChild(this.oViewPlane);
	}
	
	this.showImage = function(oImage) {
		var oBody        = document.getElementsByTagName("body")[0];
	  var aScreenSize  = [window.innerWidth  || document.documentElement.clientWidth,window.innerHeight || document.documentElement.clientHeight];		
		var aSize        = [oImage.width + 2*this.oParameter.padding,oImage.height + 2*this.oParameter.padding];
		var aPos         = [Math.max((aScreenSize[0]/2) - (aSize[0]/2),this.oParameter.minLeft),
		                    Math.max((aScreenSize[1]/2) - (aSize[1]/2),this.oParameter.minTop)];
		var boundRef     = this;			
				
		// Erstmal ... Viewer bauen		
		if (this.oViewPlane == undefined) {			
			this.oParameter.parentObject.removeChild($("lade_bild"));
			
			this.buildViewer();						
			this.oViewPlane.appendChild(oImage);												
			
			this.oViewPlane.style.width  = aSize[0] + "px";
			this.oViewPlane.style.height = aSize[1] + "px";
			this.oViewPlane.style.left   = aPos[0]  + "px";
			this.oViewPlane.style.zIndex = "200";
			this.oViewPlane.style.top    = aPos[1]  + "px";						
			this.oViewPlane.id           = this.oParameter.id;
									
			oImage.style.top  = ((this.oViewPlane.getHeight()/2) - (oImage.getHeight()/2)) + "px";
			oImage.style.left = ((this.oViewPlane.getWidth()/2) - (oImage.getWidth()/2)) + "px";
						
			new Effect.Opacity(this.oViewPlane,{duration: .5,
				                                  start   : 0,
				                                  end     : 1,
				                                  afterFinish: function() { boundRef.mutex = true;} });					
		} else {									
			// LadeNachricht
			this.oViewPlane.removeChild($("lade_bild"));
			
			if (oImage.width == this.oViewPlane.childNodes[1].width && oImage.height == this.oViewPlane.childNodes[1].height) {
				oImage.style.top     = (aSize[1]/2 - oImage.height/2) + "px";
			  oImage.style.left    = (aSize[0]/2 - oImage.width/2) + "px"; 		
			  oImage.style.opacity = 0;			  
			  oImage.style.filter  = 'alpha(opacity=0)';
			  this.oViewPlane.appendChild(oImage);				
				new Effect.Opacity(oImage, {duration: .5,
					                          start   : 0,
					                          end     : 1,
					                          afterFinish: function() { boundRef.oViewPlane.removeChild(boundRef.oViewPlane.childNodes[1]),
					                          	                        boundRef.mutex = true } });												
				this.mutex = true;
			} else {
				this.oViewPlane.removeChild(this.oViewPlane.childNodes[1]);												
				// Größe ändern									
				new Effect.Morph(this.oViewPlane,{ duration : .5, 
					                                 style: {width: aSize[0]+'px', height: aSize[1]+'px', top: aPos[1]+'px', left: aPos[0]+'px'},
					                                 afterFinish: function() { oImage.style.top  = (aSize[1]/2 - oImage.height/2) + "px";
					                                 	                         oImage.style.left = (aSize[0]/2 - oImage.width/2) + "px";  
					                                 	                         boundRef.oViewPlane.appendChild(oImage),
					                                 	                         boundRef.mutex = true; },
					                                 queue: 'end' });						
		  }
		}						
	}
			
	this.viewImage = function(cUrl) {
		var oNewImage;
		var oLoad;
		var bindRef = this;
		
		if (this.mutex) {				
			this.mutex = false;
			
			// Ladebildschirm										
			oLoad = document.createElement("div");
			oLoad.appendChild(document.createElement("style"));
								
			oLoad.id                    = "lade_bild";
			oLoad.style.position        = "absolute";
			if (this.oViewPlane) {									
				oLoad.style.top             = "15px";
				oLoad.style.left            = "15px";
			} else {				
				oLoad.style.left             = (this.oParameter.parentObject.getWidth()/2 - 20) + "px";
				oLoad.style.top             = (this.oParameter.parentObject.getHeight()/2 - 20) + "px";
			}
			oLoad.style.color           = "#000000";
			oLoad.style.backgroundColor = "#ffffff";
			oLoad.style.border          = "1px solid #000000";
			oLoad.style.padding         = "5px";
			oLoad.style.opacity         = ".8";		
			oLoad.style.zIndex          = "999";
			oLoad.style.filter          = "alpha(opacity=90)";
			oLoad.appendChild(document.createTextNode("Lade Bild..."));
							
			if (this.oViewPlane) {					
				this.oViewPlane.appendChild(oLoad);
			} else {
				this.oParameter.parentObject.appendChild(oLoad);
			}
			
			// Neues Bild "machen"
			oNewImage = document.createElement("img");		
			oNewImage.style.position = "absolute";
			oNewImage.style.zIndex   = "200";
			Element.extend(oNewImage);				
			oNewImage.onload = function() { bindRef.showImage(oNewImage)};
			oNewImage.src = cUrl;						
		}
	}		
	
	// Vorbelegen
	this.mutex = true;
}

/************************************************************************************************************/

/* Dies ist die ImageBrowser Klasse */ 

function ImageBrowser(cXmlUri,oParameter) {		
	this.oXmlTree;               // Der XML Baum		     
	this.oCurrentNode            // Aktueller Katalog	
	this.oParameter              // Parameter 
	this.oViewer                 // Viewer
	
	// Parameter
	this.oParameter     = oParameter;		
	oParameter.fillColumns = (oParameter.fillColumns != undefined) ? oParameter.fillColumns : true;		
	
	// Viewer erstellen
	this.oViewer = new ScrollPane(oParameter);
					 			
	// Methoden zur XML Kommunikation, Manipulation & Navigation /////////////////////////////////////////////
	
	// Gibt die Tiefe eines Knotens zurück		
	this.getNodeDepth = function(oNode) {
		var nIndex = 0;
		oNode = (oNode) ? oNode : this.oCurrentNode;
		
	  while (oNode.parentNode) {
	  	nIndex++;
	  	oNode = oNode.parentNode;
	  }
	  
	  return nIndex;
	}
	
	this.getRootNode = function() {
		if (this.oXmlTree) {
			
			for (var index=0; index<this.oXmlTree.childNodes.length; index++) {
				if (this.oXmlTree.childNodes[index].nodeName.toLowerCase() == "katalog") {					
					return (this.oXmlTree.childNodes[index]);		
				}
			}									
			return undefined;
		}
	}
	
	this.getPathForNode = function(oNode) {
		var aPath = [];
		if (this.oXmlTree) {			
			while (oNode) {				
				aPath.push(oNode);
				oNode = oNode.parentNode;
			}
			// ROOT Element entfernen
			aPath.pop();
		}				
		return aPath;
	}
	
	this.onSamePathToRoot = function(oStart,oNode) {
		if (this.oXmlTree) {			
			while (!(oStart == oNode) && oStart.parentNode) {
				oStart = oStart.parentNode;
			}			
			return oStart == oNode;
		}
	}
	
	// Findet einen Knoten im Gesamtkatalog
	this.findInXml = function(cId,oNode) {						
		if (this.oXmlTree && cId) {			
			var oFound;		
			oNode = (oNode) ? oNode : this.getRootNode();								
																							
			for(var index = 0; index < oNode.childNodes.length; index++) {								
				if (oNode.childNodes[index].attributes && oNode.childNodes[index].nodeName) {										
					if (oNode.childNodes[index].getAttribute("thumburl") != undefined
					    && oNode.childNodes[index].getAttribute("thumburl").toLowerCase() == cId.toLowerCase()) {
												
						// Knoten gefunden					
						return oNode.childNodes[index];
					} else if (oNode.childNodes[index].nodeName.toLowerCase() == "katalog") {
						if (oFound = this.findInXml(cId,oNode.childNodes[index])) {
							// Gefunden
							return oFound;
						}
					}				
				}
			}					
		}
	}
	
	// Baut den Viewer in Bezug auf einen Knoten auf/um
	this.gotoNode = function(xNode, oParameter) {
		if (this.oXmlTree) {
			var aNodePath;       // Für die Knotenkette
			var aCurrentPath;
			var index;		
			var columns;         // Zähler für Spalten										
			var nCommonNode      // Gemeinsamer Knoten auf Pfad
			var xTemp;															
									
			// Knoten eventuell suchen 
			xNode = (typeof xNode == "object") ? xNode : this.findInXml(xNode);																	
																						
			// Knoten vorhanden
			if (xNode) {																
				// Auf den Katalog Knoten gehen
			  if (xNode.nodeName.toLowerCase() == "image") {				
				  xNode = xNode.parentNode;
			  }							  			  
																	  
			  // Knoten == Aktueller Knoten -> nix tun
			  if (xNode == this.oCurrentNode && this.getNodeDepth(xNode) == this.oViewer.getColumnNumber(this.oViewer.getCurrentColumn())) {
			  	return;
			  }			 				 	
			  			  			  			  			  
			  // Knotenpfade holen und eventuell gemeinsamen Knoten ermitteln
		   	aNodePath = this.getPathForNode(xNode);		   			   	   	
		   			   			   	
		   	if (this.oCurrentNode) {		   				   		
		   		aCurrentPath = this.getPathForNode(this.oCurrentNode);		   		
		   		for (index=0;index < aCurrentPath.length;index++) {		   					   			
		   			if ((nCommonNode = aNodePath.indexOf(aCurrentPath[index])) > -1) {
		   				// Gemeinsamen Knoten gefunden
		   				break;
		   			}		   			
		   		}				 		   		
		   	}				
																
				// Spalten entfernen				
				if (nCommonNode != undefined && aNodePath[nCommonNode] != aCurrentPath[0]) {					
					xTemp = this.getNodeDepth(this.oCurrentNode) - (aNodePath.length - nCommonNode);					
					for (index = 0; index<xTemp; index++) {
						this.oViewer.removeColumn(this.oViewer.getColumnCount());
					}
				}															
				
				// Spalten hinzufügen				
				nCommonNode = (nCommonNode == undefined) ? aNodePath.length-1 : nCommonNode-1;												
				for (columns = nCommonNode; columns > -1; columns--) {										
					this.oViewer.addColumn();																																																										
															
					for (index = 0; index < aNodePath[columns].childNodes.length; index++) {																														
						if (aNodePath[columns].childNodes[index].attributes && aNodePath[columns].childNodes[index].getAttribute("thumburl")) {														
							this.oViewer.addElement(aNodePath[columns].childNodes[index].getAttribute("thumburl"),this.oViewer.getColumnCount(),undefined,aNodePath[columns].childNodes[index].getAttribute("title"));
						}						
					}	
					
					// Column füllen
					if (this.oParameter.fillColumns) {
				  	this.oViewer.fillColumn(this.oViewer.getColumnCount());
				  }
				}						  																
				
				// Gebaut .. derzeitigen Knoten setzen 
				this.oCurrentNode = aNodePath[0];
				this.oViewer.gotoColumn(this.oViewer.getColumnCount(),oParameter);												
			}						
		}
	}
	
	// Initalisierung, nachdem die XML Datei geladen wurde
	this.initViewer = function() {			
		this.gotoNode((this.findInXml(this.oParameter.startNode)) ? (this.findInXml(this.oParameter.startNode)) : this.getRootNode(), {noScrolling : true});																		
		// Erstes Bild anzeigen
		if (this.oParameter.showPic != undefined) {
			this.showImage(this.oParameter.showPic);
		}
	}
	
	// Eventhandling ///////////////////////////////////////////////////////////////////////////////////////		
	
	this.showImage = function() {
		
	}
	
	// Bindung
	var bindRef = this;
	
	// Select
	this.oViewer.onItemSelect = function(oEvent) {
			var oTarget;
			var oNode			
																	
			// Herausfinden, ob auf einen Katalog Knoten oder ein Image geclickt wurde			
			oNode = bindRef.findInXml(bindRef.oViewer.getLastClicked().getAttribute("imageUrl"));								
			if (oNode != undefined) {			
				if (oNode.nodeName.toLowerCase() == "katalog") {
					// Katalog Knoten -> Katalog öffnen									
					bindRef.gotoNode(oNode);				
				} else {
					// Image Knoten ... View Event feuern								
					bindRef.showImage(oNode.getAttribute("imageurl"));
				}
			}		
		}
				  								
	// Initialisierung /////////////////////////////////////////////////////////////////////////////////////					
	var oXmlhttp = zXmlHttp.createRequest();
							
	// Senden
	oXmlhttp.open("get",cXmlUri,true);
	oXmlhttp.onreadystatechange = function () {						
		if (oXmlhttp.readyState == 4) {				  				
				if (oXmlhttp.status == 200) {
				  // Einfaches austauschen					  
				  bindRef.oXmlTree = oXmlhttp.responseXML;				  
				  bindRef.initViewer();				  					  					  				  
				} else {
					alert("Es gab einen Fehler beim holen der Katalogdaten!\n\nFehler: "+oXmlhttp.statusText );						
				}  					
		}										
	}				
	oXmlhttp.send(null);				
			
	// Viewer gleich mit übergeben?
	if (oParameter.viewer) {
		this.showImage = function(cUrl) {
			oParameter.viewer.viewImage(cUrl);
		}
	}		
}

/************************************************************************************************************/

/* Dies ist die ScrollPane Klasse 

ParameterHash
-------------

parentObject       : Elternobjekt
position           : Position im Elternobjekt
size               : Größe des ScrollPanes
scroll             : 'vertical'|'horizontal'[S]
visibility         : 'hidden'|'visible'[S]
opacity            : Opazität
boxSize            : Ausdehung einer ScollBox
boxMargin          : Abstand von Box zu Box
boxBackgroundImage : Hintergrund einer Box
boxBackgroundColor : Hintergrundfarbe einer Box
*/

function ScrollPane(oParameter)
{	
	// Exemplarvariablen /////////////////////////////////////////////////////////////////////////////////////
	this.PaneContainer;              // Container für das ScrollPane
	this.Pane;                       // Die Scrollebene
	this.Parameter;                  // Das Parameterobjekt wird gemerkt & ergänzt
	this.isVerticalPane              // Art des ScrollPanes
	this.currentColumn               // Derzeitig angezeigte Spalte
	this.mouseMoveFunction           // Hier wird eine MouseMove Funktion gespeichert
	this.mouseUpFunction             // Hier wird eine MouseMove Funktion gespeichert
	this.lastMouseCoordinates        // Hier werden sich Mauskoordinaten gemerkt
	this.isInMovement                // ScrollPane wurd nach MouseDown bewegt
	this.isInColumnMovement          // Spaltenbewegung	
	
	this.test = 0;
	
	// Parameter ergänzen ////////////////////////////////////////////////////////////////////////////////////
	this.Parameter                = oParameter;
	oParameter.size               = (oParameter.size) ? oParameter.size : [0,0];
  oParameter.position           = (oParameter.position) ? oParameter.position : [0,0];
	oParameter.posmethod          = (oParameter.posmethod) ? oParameter.position : "absolute";
	oParameter.border             = (oParameter.border) ? oParameter.border : "";
	oParameter.backgroundColor    = (oParameter.backgroundColor) ? oParameter.backgroundColor : "transparent";
	oParameter.backgroundImage    = (oParameter.backgroundImage) ? oParameter.backgroundImage : undefined;
	oParameter.visibility         = (oParameter.visibility) ? oParameter.visibility : "visible";
	oParameter.columnMargin       = (oParameter.columnMargin) ? oParameter.columnMargin : 0;
	oParameter.boxSize            = (oParameter.boxSize) ? oParameter.boxSize : 100;
	oParameter.boxMargin          = (oParameter.boxMargin) ? oParameter.boxMargin : 0;
	oParameter.boxBackgroundColor = (oParameter.boxBackgroundColor) ? oParameter.boxBackgroundColor : "transparent";
	
	this.isVerticalPane        = oParameter.isVerticalPane;	
	this.currentColumn         = 0;
		
	// Bauen der Hauptelemente ///////////////////////////////////////////////////////////////////////////////
	// 1.Container
	this.PaneContainer = document.createElement("div");
	this.PaneContainer.appendChild(document.createElement("style"));
	Element.extend(this.PaneContainer);
	
	this.PaneContainer.style.position        = oParameter.posmethod;
	this.PaneContainer.style.width           = oParameter.size[0] + "px";
	this.PaneContainer.style.height          = oParameter.size[1] + "px";
	this.PaneContainer.style.top             = oParameter.position[1] + "px";
	this.PaneContainer.style.left            = oParameter.position[0] + "px";
	this.PaneContainer.style.backgroundColor = oParameter.backgroundColor;
	this.PaneContainer.style.backgroundImage = (oParameter.backgroundImage) ? "url('" + oParameter.backgroundImage + "')" : "";
	this.PaneContainer.style.border          = oParameter.border;   
	this.PaneContainer.style.visibility      = oParameter.visibility;
	this.PaneContainer.style.overflow        = "hidden";
	if (oParameter.opacity) {
		 this.PaneContainer.setOpacity(oParameter.opacity)
	}		
	
	// 1.ScrollPane			
	this.Pane = document.createElement("div");
	this.Pane.appendChild(document.createElement("style"));
	Element.extend(this.Pane);
	
	this.Pane.style.position        = "absolute";
	this.Pane.style.left            = "0px";
	this.Pane.style.top             = "0px";
	this.Pane.style.width           = "0px";
	this.Pane.style.height          = "0px";
	this.Pane.style.backgroundColor = "transparent";
	
	// ScrollPane dem Container hizufügen
	this.PaneContainer.appendChild(this.Pane);
	
	// Cotainer dem Parent hinzufügen
	if (oParameter.parentObject) {
		oParameter.parentObject = (oParameter.parentObject instanceof String) ? $(oParameter.parentObject) : oParameter.parentObject;
		oParameter.parentObject.appendChild(this.PaneContainer);
	}
		
	// Methoden zum Aufbau des Scrollpanes  + Hilfsmethoden ////////////////////////////////////////////////////
	this.fillColumn = function(nColumn,oOptions) {
		var oColumn;
		var nCount;
		
		oColumn = (nColumn && nColumn <= this.getColumnCount() && nColumn > 0) ? this.getColumn(nColumn) : this.currentColumn;		
		nCount  = (this.PaneContainer.getWidth() > oColumn.getWidth()) ? parseInt((this.PaneContainer.getWidth() - oColumn.getWidth()) / this.Parameter.boxSize) : -1;
		
		for (var index=0; index<=nCount; index++) {
			this.addElement(undefined,nColumn)
		}
	}
	
	
	this.addElement = function(xElement,nColumn,oOptions,cTitle) {
		// 1.Teil ... prüfen ob die Spalte vorhanden ist, zur Not Spalten bauen
		if (nColumn) {						
			if (nColumn > this.getColumnCount()) {
				// Spalten bauen
				for (var index = nColumn - this.getColumnCount(); index--; index > 0) {
					this.addColumn();
				}
			}
			
			if (! this.currentColumn) {
				this.currentColumn = 1;
			}
		} else if (! this.currentColumn) {
			// Die allererste Spalte wird gebaut
			this.addColumn();
			nColumn = this.currentColumn = 1;
			
		} else {
			nColumn = this.currentColumn;			
		}		
		var oColumn = this.getColumn(nColumn);
		
		// Options
		oOptions = (oOptions) ? oOptions : {};
		oOptions.backgroundImage = (oOptions.backgroundImage) ? oOptions.backgroundImage : this.Parameter.boxBackgroundImage;
		oOptions.backgroundColor = (oOptions.backgroundColor) ? oOptions.backgroundColor : this.Parameter.boxBackgroundColor;
				
		// Neue Box erschaffen
		var oBox = document.createElement("div");
		oBox.appendChild(document.createElement("style"))
		Element.extend(oBox);						
		
		oBox.style.cssFloat           = "left";
		oBox.style.styleFloat         = "left";
		oBox.style.width              = ((this.isVerticalPane) ? this.PaneContainer.getWidth()   : this.Parameter.boxSize) + "px";
		oBox.style.height             = ((this.isVerticalPane) ? this.Parameter.boxSize : this.PaneContainer.getHeight())  + "px";
		oBox.style.marginRight        = ((this.isVerticalPane) ? 0 : this.Parameter.boxMargin) + "px";
		oBox.style.marginBottom       = ((this.isVerticalPane) ? this.Parameter.boxMargin : 0) + "px";
		oBox.style.textAlign          = "center";			
		oBox.style.cursor             = "pointer";
		oBox.style.backgroundImage    = (oOptions.backgroundImage) ? "url('" + oOptions.backgroundImage + "')" : "";
		oBox.style.backgroundRepeat   = "no-repeat";
		oBox.style.backgroundPosition = "50% 50%";		
		oBox.style.backgroundColor    = oOptions.backgroundColor;			
									
		// Click Event
		Event.observe(oBox,'click', this.mouseClick.bindAsEventListener(this));		
		
		// Element bauen	
		if (xElement) {		
			var oImage = document.createElement("div");
			
			oImage.appendChild(document.createElement("style"))
			Element.extend(oImage);
			oImage.style.width              = ((this.isVerticalPane) ? oColumn.getWidth() : this.Parameter.boxSize) + "px";
			oImage.style.height             = ((this.isVerticalPane) ? this.Parameter.boxSize : oColumn.getHeight())   + "px";
			oImage.style.backgroundColor    = "transparent";
			oImage.style.backgroundImage    = "url('" + xElement + "')";
			oImage.style.backgroundRepeat   = "no-repeat";
			oImage.style.backgroundPosition = "50% 50%";				
			oImage.src                      = xElement;		
						
			oImage.setAttribute("title",cTitle);
			// Url speichern
		  oImage.setAttribute("imageUrl",xElement);				
			oBox.appendChild(oImage);							
		} 							
		
		// Der entsprechenden Spalte hinzufügen, inkl. diese vergrößern		
		if (this.isVerticalPane) {
			oColumn.style.height = (oColumn.getHeight() + this.Parameter.boxSize + this.Parameter.boxMargin) + "px";
		} else {
			oColumn.style.width  = (oColumn.getWidth()  + this.Parameter.boxSize + this.Parameter.boxMargin) + "px";
		}
		oColumn.appendChild(oBox);								
	}
	
	// Fügt eine neue Spalte hinzu
	this.addColumn = function() {
		var nColumns = this.getColumnCount();
		var oColumn  = document.createElement("div");
		oColumn.appendChild(document.createElement("style"));
		Element.extend(oColumn);
		
		oColumn.style.position = "absolute";
		oColumn.style.top      = ((this.isVerticalPane) ? 0 : (nColumns * (this.Parameter.boxSize + this.Parameter.columnMargin))) + "px";
		oColumn.style.left     = ((this.isVerticalPane) ? (nColumns * (this.Parameter.boxSize + this.Parameter.columnMargin)) : 0) + "px";
		oColumn.style.width    = ((this.isVerticalPane) ? this.PaneContainer.getWidth() : 0) + "px";
		oColumn.style.height   = ((this.isVerticalPane) ? 0 : this.PaneContainer.getHeight()) + "px";
		oColumn.style.backgroundColor = "transparent";
		
		// Dem ScrollPane hinzufügen
		if (this.isVerticalPane) {
			this.Pane.width  = (this.Pane.getWidth()  + ((nColumns > 0) ? this.Parameter.columnMargin : 20) + this.PaneContainer.getWidth())  + "px";	
		} else {
			this.Pane.Height = (this.Pane.getHeight() + ((nColumns > 0) ? this.Parameter.columnMargin : 20) + this.PaneContainer.getHeight()) + "px";	
		}
		this.Pane.appendChild(oColumn);								
	}
	
	// Löscht alle Elemente aus einer Spalte
	this.removeElementsFromColumn = function(column) {
		column = (column) ? column : this.currentColumn
		
		if (column) {			
			var oColumn = this.getColumn(column)
			 
			for (var index=0; index<oColumn.childNodes.length; index++) {								
				if (oColumn.childNodes[index].nodeName == "DIV") {
					// Spalte entfernen & Index verringern
					oColumn.removeChild(oColumn.childNodes[index]);
					index--;
				}
			}
			
			// Größe anpassen
			if (this.isVerticalPane) {
				oColumn.style.height = "0px";
				oColumn.style.top    = "0px";
			} else {
				oColumn.style.width = "0px";
				oColumn.style.left  = "0px";
			}
		}
	}
	
	// Liefert die Anzahl der angezeigten Spalten
	this.getColumnCount = function() {
		for (var index=0, count=0; index<this.Pane.childNodes.length;index++) {
			count += (this.Pane.childNodes[index].nodeName == "DIV") ? 1 : 0;			
		}
		return count;
	}							
	
	// Liefert das Spaltenobjekt der aktuellen Spalte
	this.getCurrentColumn = function() {
		if (this.currentColumn) {
			return this.getColumn(this.currentColumn);
		} else {
			return undefined;
		}
	}
	
	// Holte eine bestimmte Spalte nach Nummer
	this.getColumn = function(nColumn) {
		for (var index=0, count=0; index<this.Pane.childNodes.length;index++) {
			count += (this.Pane.childNodes[index].nodeName == "DIV") ? 1 : 0;			
			// Spalte gefunden
			if (count == nColumn) {
				return this.Pane.childNodes[index];
			}
		}
		// Spalte nicht vorhanden		
		return undefined;
	}
	
	// Holt zu einer Spalte die Nummer
	this.getColumnNumber = function(oColumn) {
		for (var index=0, count=0; index<this.Pane.childNodes.length;index++) {
			count += (this.Pane.childNodes[index].nodeName == "DIV") ? 1 : 0;	
			// Spalte gefunden
			if (oColumn == this.Pane.childNodes[index]) {
				return count;
			}
		}
		return undefined;
	}
	
	// Entfernt eine Spalte auf dem ScrollPane
	this.removeColumn = function(nColumn) {		
		// Nur entfernen, wenn es Sie auch gibt ... irgendwie logisch ;)
		if (nColumn > 0 && nColumn <= this.getColumnCount()) {			
			var oColumn  = this.Pane.removeChild(this.getColumn(nColumn));
			var count    = this.getColumnCount();			
			var index;
			
			// Alle Spalten "nach" der entfernten werden in Ihrer Position korrigiert			
			for (index = nColumn; index <= count; index++) {				
				if (this.isVerticalPane) {
					this.getColumn(index).style.left = (parseInt(this.getColumn(index).style.left) - (this.Parameter.boxSize + this.Parameter.columnMargin)) + "px";
				} else {
					this.getColumn(index).style.top  = (parseInt(this.getColumn(index).style.top)  - (this.Parameter.boxSize + this.Parameter.columnMargin)) + "px";
				}
			}
									
			// Pane & aktuelle Spalte korriegieren				
			if (this.currentColumn > nColumn || (this.currentColumn > 1 && this.currentColumn == nColumn && nColumn == this.getColumnCount()+1)) {								
				if (this.isVerticalPane) {
					this.Pane.style.left = (parseInt(this.Pane.style.left) + (this.Parameter.boxSize + this.Parameter.columnMargin)) + "px";
				} else {										
					this.Pane.style.top  = (parseInt(this.Pane.style.top)  + (this.Parameter.boxSize + this.Parameter.columnMargin)) + "px";					
				}
			}						
											
			if (this.currentColumn == nColumn) {
				 this.currentColumn = (nColumn > this.getColumnCount()) ? this.getColumnCount() : nColumn;						
			} else if (this.currentColumn > nColumn) {
				 this.currentColumn--;
			} 																																			
		}
	}
	
	// Methoden zur Navigation zwsichen den Spalten /////////////////////////////////////////////////////////
	
	this.nextColumn = function(oParameter) {						
		if (this.currentColumn && this.currentColumn < this.getColumnCount()) {			
			this.gotoColumn(this.currentColumn+1,oParameter);
		}
	}
	
	this.prevColumn = function(oParameter) {		
		if (this.currentColumn && this.currentColumn > 1) {			
			this.gotoColumn(this.currentColumn-1,oParameter);
		}
	}
	
	this.firstColumn = function(oParameter) {
		if (this.currentColumn && this.currentColumn > 1) {
			this.gotoColumn(1,oParameter);
		}
	}
	
	this.lastColumn = function(oParameter) {
		if (this.currentColumn && this.currentColumn < this.getColumnCount()) {
			this.gotoColumn(this.getColumnCount(),oParameter);
		}
	}
	
	this.gotoColumn = function(nColumn,oParameter) {						
		if (this.currentColumn && nColumn && !this.isInColumnMovement) {						
			// Mutex			
			this.isInColumnMovement = true;
			var boundedVar = this;
			
			var startColumn = this.getCurrentColumn();
			var endColumn   = this.getColumn(nColumn);
			
			// Parameter
			oParameter          = (oParameter) ? oParameter : {};
			oParameter.duration = (oParameter.duration) ? oParameter.duration : .5;			
			
			// Berechnung der Anfangs & Endkoordinaten
			var startCoord  = [(this.isVerticalPane) ? parseInt(startColumn.style.left) : 0,
			                   (this.isVerticalPane) ? 0 : parseInt(startColumn.style.top)];
			var endCoord    = [(this.isVerticalPane) ? parseInt(endColumn.style.left) : 0,
			                   (this.isVerticalPane) ? 0 : parseInt(endColumn.style.top)];											
			
			// Derzeitige Spalte umstellen
			this.currentColumn = nColumn
			
			// Bewegung
			if (oParameter.noScrolling) {
				this.Pane.style.top     = -1*endCoord[1] + "px";
				this.Pane.style.left    = -1*endCoord[0] + "px";
				this.isInColumnMovement = false;
			} else {				
				new Effect.Move(this.Pane,{x           : startCoord[0] - endCoord[0],
					                         y           : startCoord[1] - endCoord[1],
					                         duration    : oParameter.duration,
					                         afterFinish : function() { boundedVar.isInColumnMovement = false }}
					              );
			} 								
		}
	}
	
	// Methoden zur Navigation im Scrollpane mit der Maus //////////////////////////////////////////////////
	
	this.mouseDown = function(oEvent) {		
		this.lastMouseCoordinates = [oEvent.screenX,oEvent.screenY];
		this.isInMovement         = false;						
														
		// Das ganze Action Handling nur, wenn es auch eine aktuelle Spalte gibt
		if (this.currentColumn) {						
			// Mausbewegungshandler registrieren
			Event.observe(this.PaneContainer,'mousemove',  this.mouseMoveFunction);					
			Event.observe(document,'mouseup',this.mouseUpFunction, true);	  
		}
	}
	
	this.mouseUp   = function(oEvent) {
		// Mausbewegungen nicht mehr registrieren
		Event.stopObserving(this.PaneContainer,'mousemove',  this.mouseMoveFunction);		
		Event.stopObserving(document,'mouseup',  this.mouseUpFunction, true);												
	}
	
	this.mouseClick = function(oEvent) {				
			var oObject = oEvent.target || oEvent.srcElement																							
									
			// Item Selected Event generieren & feuern, aber nur, wenn die Scrollpane nicht bewegt wurde
			if (!this.isInMovement) {									
				// Objekt setzen		
				this.setLastClicked(oObject);																													
				this.onItemSelect();
				
				// Event feuern
				// var evt = document.createEvent("HTMLEvents");										
				// evt.initEvent("itemselected",true,true);	
				// oObject.dispatchEvent(evt);
			}
	}
	
	this.mouseMove = function(oEvent) {
		var nMovement = (this.isVerticalPane) ? oEvent.screenY - this.lastMouseCoordinates[1] : oEvent.screenX - this.lastMouseCoordinates[0];
		var oColumn   = this.getCurrentColumn()
		
		// Pane wurde bewegt -> kein 'ItemSelect' Ereigniss	
		this.isInMovement = true;
		
		// Bewegung des ScrollPanes
			if (!this.isVerticalPane) {
				nMovement += parseInt(oColumn.style.left);
				if (nMovement > 0) {
					nMovement = 0;
				} else if (nMovement + oColumn.getWidth() < this.PaneContainer.getWidth()) {
					if (oColumn.getWidth() < this.PaneContainer.getWidth()) {
						nMovement = 0;
					} else {
						nMovement = this.PaneContainer.getWidth() - oColumn.getWidth();
					}
				}
				
				oColumn.style.left = nMovement + "px";
			} else {
				nMovement += parseInt(oColumn.style.top);
				if (nMovement > 0) {
					nMovement = 0;
				} else if (nMovement + oColumn.getHeight() < this.PaneContainer.getHeight()) {
					if (oColumn.getHeight() < this.PaneContainer.getHeight()) {
						nMovement = 0;
					} else {
						nMovement = this.PaneContainer.getHeight() - oColumn.getHeight();
					}					
				}
				oColumn.style.top = nMovement + "px";
			}						
						
		// Letzte Koordinaten merken
		this.lastMouseCoordinates = [oEvent.screenX,oEvent.screenY];								
	}
			
	// Eventhandler registrieren ///////////////////////////////////////////////////////////////////////////
	this.mouseMoveFunction = this.mouseMove.bindAsEventListener(this)
	this.mouseUpFunction   = this.mouseUp.bindAsEventListener(this)
	
	// oLastClicked als 'private'
	var oLastClicked	
	this.getLastClicked = function() { return oLastClicked };
	this.setLastClicked = function(oObj) { oLastClicked = oObj };
	
	// Dummy
	this.onItemSelect = function() { alert("Item Selected") };
		
	// Eventhandler
	Event.observe(this.PaneContainer,'mousedown',  this.mouseDown.bindAsEventListener(this));	  
}