function gallery (ident){
	this.ident = ident;
	this.sticky = false;
	this.Alben = new Array();
	this.Thumbs = new Array();
	this.dirList = new Array("<b style=\"cursor: pointer;\" onClick=\"//"+this.ident+".drawfirst();\">Home</b>");
	this.Album = new Album ('', '', '', '');
	this.dir = "";


	this.clearAlbenList = function () {
					while(this.Alben.length>0){
									this.Alben.pop();
					}
					return true;
	}
	this.clearThumbList = function () {
					while(this.Thumbs.length>0){
									this.Thumbs.pop();
					}
					return true;
	}	

	this.loadListe = function (dir){
		ajaxpage('module/gallerie.php',this.ident+'GalleryLoading','=d&thiss='+encodeURIComponent(this.ident)+'&dir='+encodeURIComponent(dir),'',true);

		document.getElementById(this.ident+'Pfad').innerHTML='&nbsp;'+this.drawDirList();
//		MainBox.newTitel(this.drawDirList());
	}

	this.cutDirList = function (Stellen) {
		while (this.dirList.length> Stellen){
						this.dirList.pop();
		}
	}

	this.drawDirList = function () {
					return this.dirList.join(' -> ');
	}

	this.addDir = function ( sdir ) {
					this.dir += sdir +"/";
	}

	this.addToDirList = function ( dirs, title ){
					this.dirList.push('<b style="cursor: pointer;" onClick="//'+this.ident+'.drawDir(\''+this.dir+dirs+'\'); '+this.ident+'.cutDirList('+(this.dirList.length+1)+');">'+title+'</b>');
	}

	this.delDir = function () {
		if(!this.sticky){
					var sdir = this.dir.split("/");
					sdir.pop();
					sdir.pop();
					this.dir= sdir.join("/");
					if(sdir.length==1){
									this.dir+="/";
					}
					this.dirList.pop();
		}
	}
	
	this.drawOutPicture = function ( i ) {
		if( i == -1 ){
			i = 0 ;
		}
		if( i == this.Album.anzahl ){
			i = i - 1 ;
		}
		out='';
		out+='<table cellpadding="2" cellspacing="0" border="0" width="100%">';
		out+='	<tr>';
		out+='		<td class="mBoxTitel" style="border-bottom: 0px none; border-right: 0px none;"> ' + this.Album.titel;
		out+='		</td>';
		out+='		<td class="mBoxTitel" width="50px" align="center"> ' + formatNumber( i + 1 , this.Album.anzahl.length);
		out+=' / ' + this.Album.anzahl;
		out+='		</td>';		
		out+='	</tr>';
		out+='	<tr>';
		out+='		<td class="mBoxTitelD" colspan="2" align="center" style="text-align: center; border-top: 0px none;">';
		out+='			<img style="cursor: pointer;" src="gfx/galBack.png" id="'+this.ident+'OutPictureBack" onClick="'+this.ident+'.drawOutPicture('+(i-1)+');" title="Vorheriges Bild Anzeigen">';
		out+='			<img style="cursor: pointer;" src="gfx/galIndex2.png" onClick="'+this.ident+'.drawDir();" title="Zur&uuml;ck zum Album :\n\n\t\t\t'+this.Album.titel+'">';
		out+='			<img style="cursor: pointer;" src="gfx/galFwd.png" id="'+this.ident+'OutPictureFwd" onClick="'+this.ident+'.drawOutPicture('+(i+1)+');" title="N&auml;chstes Bild Anzeigen">';		
		out+='		</td>';
		out+='	</tr>';	
		out+='</table>';
		out+='<table cellpadding="2" cellspacing="0" border="0" width="100%">';		
		out+='	<tr>';
		out+='		<td class="mBoxTitel4" colspan="2" align="center">';
		out+='			<a href="'+this.Thumbs[i].original+'" target="_blank"><img src="gfx/blank55.gif" id="'+this.ident+'OutPicture" title="Hier Klicken zum Vergr&ouml;ssern..."></a>';
		out+='		</td>';
		out+='	</tr>';
		out+='</table>';
		
		document.getElementById(this.ident+'GalleryBack').style.display='none';	
		document.getElementById(this.ident+"GalleryAlben").innerHTML=out;
		document.getElementById(this.ident+"GalleryAlbum").innerHTML='&nbsp;';
		document.getElementById(this.ident+'OutPicture').src=this.Thumbs[i].out.src;
	
		if(i == 0 ) {
			document.getElementById(this.ident+'OutPictureBack').src='gfx/galBackOff.png';
		}
		if(i ==  ( this.Album.anzahl - 1 )) {
			document.getElementById(this.ident+'OutPictureFwd').src='gfx/galFwdOff.png';
		}
	}

	this.drawAlbenOut = function () {
		out='';
		if(document.getElementById(this.ident+'GalleryBack').style.display=='block' && this.Alben.length > 0) {
						out+='<hr>';
		}
 		for(i=0;i<this.Alben.length;i++) {
			out+=	'<table cellpadding="2" cellspacing="0" border="0" style="margin: 3px; float: left;cursor: pointer;" title="'+"Beschreibung : "+this.Alben[i].beschreibung+'"';
		  out+= '	onClick="'+this.ident+'.addToDirList(\''+this.Alben[i].dir+'\',\'' + this.Alben[i].titel + '\'); '+this.ident+'.addDir(\''+this.Alben[i].dir+'\');'+this.ident+'.drawDir(\''+this.dir+this.Alben[i].dir+'\'); "> ';
			out+=	'	<tr> ';
			out+=	' 	<td class="mboxTitel" colspan="2" style="border-bottom: 0px none;"> ' + this.Alben[i].titel + ' </td>';
			out+= '	</tr> ';
			out+= ' <tr>';
			out+=	' 	<td class="mboxTitel4" colspan="2" style="height: 106px; border-bottom: 0px none; border-top: 0px none;"> <img src="' + this.Alben[i].bild+ '"> </td>';
			out+= ' </tr>';
			out+= ' <tr>';				
			out+=	' 	<td class="mboxTitelD" style="border-top: 0px none;"> Bilder </td>';								
			out+=	' 	<td class="mboxTitelD" style="border-left: 0px none; text-align: center;" align="center"> ' + this.Alben[i].anzahl+ ' </td>';				
			out+= ' </tr>';
			out+=	'</table>';			
		}
		document.getElementById(this.ident+'GalleryAlben').innerHTML=out;
		this.sticky=false;
	}

	this.drawAlbum = function ( ) {
		out= '<table cellpadding="2" cellspacing="0" border="0" width="100%">';
		out+='	<tr>';
		out+='		<td class="mBoxtitel"  height="18px" style="height: 18px; border-bottom: 0px none;">';
		out+='			'+ this.Album.titel;
		out+='		</td>';
		out+='		<td class="mBoxTitel" width="25px" align="center" title="Anzahl Bilder in diesem Album."> ';
		out+='  ' + this.Album.anzahl;
		out+='		</td>';			
		out+='	</tr>';
		out+='	<tr>';		
		out+='		<td class="mBoxtitel4"  height="18px" style="height: 18px; border-top: 0px none;" colspan="2">';
		out+='			'+ this.Album.beschreibung;
		out+='		</td>';
		out+='	</tr>';
		out+='	<tr>';
		out+='		<td valign="top" class="mBoxTitel5" colspan="2">';
		for(i=0; i<this.Thumbs.length; i++) {
						out+='<div style="float: left; width: 100px; height: 75px; margin : 3px; text-align: center; vertical-align: middle;">';
						out+='<img style="cursor: pointer;" src="'+this.Thumbs[i].source+'" style="border: 1px solid #000;" onClick="'+this.ident+'.drawOutPicture('+i+');" title="Klicken zum vergr&ouml;ssern."></div>';

		}
		out+='		&nbsp;</td>';		
		out+='	</tr>';
		out+='	<tr>';
		out+='		<td class="mBoxtitelD" valign="top" colspan="2">';
		out+='			No Comments...';
		out+='		</td>';
		out+='	</tr>';		
		out+='</table>';

		document.getElementById(this.ident+'GalleryAlbum').innerHTML=out;

	}

	this.drawGallery = function () {
		out2='<table cellpadding="2" cellspacing="0" border="0" width="100%"><tr>';
		out2+='<td class="mBoxtitel6" width="75px" style="width: 75px;" onClick=" '+this.ident+'.delDir();'+this.ident+'.drawDir(\''+this.dir+'\');">Zur&uuml;ck</td><td class="mBoxTitel4" id="'+this.ident+'Pfad">&nbsp;</td></tr></table>';	
		out=	'<div id="'+this.ident+'GalleryLoading" style="display: block;">&nbsp;</div>';	
		out+= '<table width="100%" cellpadding="0" cellspacing="0" width="100%"><tr><td width="100%">';
		out+=	'<div id="'+this.ident+'GalleryBack" style="display: none; width: 100%;">'+out2+'</div>';
		out+=	'<div id="'+this.ident+'GalleryAlben">&nbsp;</div>';
		out+='</td></tr><tr><td>';
		out+=	'<hr><div id="'+this.ident+'GalleryAlbum">&nbsp;</div>';
		out+='</td></tr><tr><td>';		
		
		out+='</td></tr></table>';

		return out;
	}




	this.drawDir = function (dirs) {
		if(!this.sticky){
			this.sticky=true;
			this.drawGallery();
			this.clearAlbenList();
			this.clearThumbList();
			this.loadListe("data/gallery/"+this.dir);		
			if(this.dir!='') { 		
				document.getElementById(this.ident+'GalleryBack').style.display='block';
			}
			else {
				document.getElementById(this.ident+'GalleryBack').style.display='none';	
			}
		}
		else { 
			alert(' Bitte Warten ...');
		}
	}

	this.drawfirst = function () {
			this.dir='';
			this.cutDirList(1);
		if(!this.sticky){	
			this.sticky=true;		
			this.drawGallery();
			this.clearAlbenList();
			this.clearThumbList();
			this.loadListe("data/gallery");		
			document.getElementById(this.ident+'GalleryBack').style.display='none';		
		}
		else { 
			alert(' Bitte Warten ...');
		}		
	}

}

function Album (titel, bild, beschreibung, anzahl, dir){
				this.titel = titel;
				this.bild = bild;
				this.beschreibung = beschreibung;
				this.anzahl = anzahl;
				this.dir=dir;
}

function bild ( source, outsource, original ) {
	this.source = source;
	this.outsource = outsource;
	this.out = new Image();
	this.out.src=outsource;
	this.original = original;
}

var gallerie = new gallery('gallerie');