clickSlider=function(parent,maxTbW,maxTbH,bgColor,width,height,imagePadding,maxOverlayW,maxOverlayH,arrowWidth,arrowHeight,withArrows,selfRun)
{
	this.iL=0;
	this.navWrapper=new Element("div",{styles: {/*position: "relative",*/top: 0,zIndex: 100,width: width,height: height,backgroundColor: bgColor}});
	this.wrapper=new Element("div",{styles: {float: "left",position: "relative",overflow: "hidden",display: "none",height: height}});
	this.el=new Element("div",{id: "slider",styles: {height: height,position: "absolute",visibility: "hidden",left: 0,zIndex: 2}});
	this.parentEl=parent;
	this.data=new Array();
	this.maxTbW=maxTbW;
	this.maxTbH=maxTbH;
	this.completeWidth=0;
	this.sectionCount=8;
	this.imagePadding=imagePadding;
	this.halfPadding=Math.round(this.imagePadding/2);
	this.height=height;
	this.width=width;
	this.slideEffekt;
	this.effektConstant={width: 180,duration: 200};
	this.effektIsRunning=false;
	this.maxOverlayW=maxOverlayW;
	this.maxOverlayH=maxOverlayH;
	this.loadCount=0;
	this.loadInfo=new Element("span");
	this.imageCount=0;
	this.stopSelfRun=false;
	this.isShowDesc=false;
	this.standardSelfRunSpeed=2;
	this.startSelfRun=selfRun;
	this.selfRunSpeed=this.standardSelfRunSpeed;
	this.mouseIsIn=false;
	this.runSelfDirection=-this.selfRunSpeed;
	this.withArrows=withArrows;
	this.isDestroyed=false;
	
	this.updateLoadCount=function(img)
	{
		this.loadCount++;
		this.updateLoadInfo();
	}
	
	this.updateLoadInfo=function()
	{
		this.loadInfo.set("text","Lade Bild "+this.loadCount+" von "+this.iL.getCount());
	}
	
	this.destroy=function()
	{
		this.navWrapper.destroy();
		this.isDestroyed=true;
	}
	
	this.initLoadInfo=function()
	{
		var el=new Element("div");
		el.setStyles({
			margin: "0 auto",
			width: 150,
			textAlign: "center",
			color: "#fff"
		});
		el.adopt(new Element("br"));
		el.adopt(this.loadInfo);
		this.updateLoadInfo();
		this.navWrapper.adopt(el);		
		this.parentEl.adopt(this.navWrapper);
		el.setStyle("paddingTop",Math.round((this.navWrapper.getCoordinates().height.toInt()-el.getCoordinates().height.toInt())/2));
	}
	
	this.loadImages=function(imgs,path)
	{
		var img;
		this.iL=new imageList(this.loadImagesComplete.bind(this),this.updateLoadCount.bind(this));		
		for(var i=0;i<imgs.length;i++)
		{
			img=this.iL.newImage();
			img.src=path+imgs[i].src;
			img.setStyles({
			float: "left",
			display: "block",
			padding: this.imagePadding
			});
			this.el.adopt(img);
			this.data[i]={el: img,desc: imgs[i].desc, file: imgs[i].src};
			img.addEvent("click",this.showDescription.bind(this,i));
			img.setStyle("cursor","pointer");
		}
		$(document.body).adopt(this.el);
		
		this.initLoadInfo();
	}
	
	this.overlay;
	this.showDescription=function(index)
	{
		var el=new Element("div");
		el.setStyles({
		padding: 15,
		cursor: "pointer"
		});
		this.isShowDesc=true;
		this.overlay=new overlay();
		el.addEvent("click",function(e){this.overlay.closeOverlay();this.stopSelfRun=false;this.isShowDesc=false;}.bind(this));
		var desc=new Element("div");
		
		if(this.data[index].desc!=this.data[index].file && this.data[index].desc!="") desc.set("html",this.data[index].desc);
		desc.setStyles({
			paddingTop: 15,
			color: "#fff"
		});
		var img=$(new Image());
		img.src=this.data[index].el.src;
		var r=resize(this.data[index].origWidth,this.data[index].origHeight,this.maxOverlayW,this.maxOverlayH);
		img.width=r.width;
		img.height=r.height;
		img.setStyles({
			padding: 0,
			float: "none",
			border: "1px solid #fff"
		});
		el.adopt(img);
		el.adopt(desc);
		
		this.stopSelfRun=true;
		
		this.overlay.addOverlay(el);
		$("closeOverlayDivA").parentNode.removeChild($("closeOverlayDivA"));
		
	}
	
	this.getMaxWidth=function()
	{
		return this.completeWidth-this.wrapper.getCoordinates().width;
	}
	
	this.getCurrentFirstPic=function(left)
	{
		var pos;
		left=left*-1;
		for(var i=0;i<this.data.length;i++) 
		{
			pos=this.data[i].el.getPosition(this.data[i].el.parentNode).x;
			if(pos>=left || pos+this.data[i].el.getCoordinates().width>left) return i;
		}
	}
	
	this.forward=function()
	{
		if(this.effektIsRunning===true) 
		{
			setTimeout(this.forward.bind(this),10);
			return false;
		}
		
		var left=$("slider").getStyle("left").toInt();
		var cP=this.getCurrentFirstPic(left)+1;
		
		if(cP>=this.data.length) return false;
		var maxW=this.getMaxWidth();
		var size=this.data[cP].el.getPosition(this.data[cP].el.parentNode).x;
		if((left*-1)>=maxW) return false;
		
		this.slideEffektstart(-size);
	}
	
	this.backward=function()
	{
		if(this.effektIsRunning===true) 
		{
			setTimeout(this.backward.bind(this),10);
			return false;
		}
		var left=$("slider").getStyle("left").toInt();
		var cP=this.getCurrentFirstPic(left);
		
		var move;
		if(cP==0) 
		{
			if(left>=0) return false;
			move=0;
		}
		else 
		{
			move=this.data[cP-1].el.getPosition(this.el).x+this.data[cP-1].el.getCoordinates().width;
			if(left*-1==move) move=this.data[cP-1].el.getPosition(this.el).x;
		}
		
		this.slideEffektstart(-move);
	}
	
	this.slideEffektstart=function(left)
	{
		this.effektIsRunning=true;
		
		var delta=left-$("slider").getStyle("left").toInt();
		if(delta<0) delta=delta*-1;
		var duration=Math.round((delta/this.effektConstant.width)*this.effektConstant.duration);
		
		this.slideEffekt.cancel();
		this.slideEffekt.options.duration=duration;
		
		this.slideEffekt.start({left: left});
	}
	
	this.loadImagesComplete=function()
	{
		for(var i=0;i<this.data.length;i++)
		{
			this.data[i].origWidth=this.data[i].el.width.toInt();
			this.data[i].origHeight=this.data[i].el.height.toInt();
			var r=resize(this.data[i].origWidth,this.data[i].origHeight,this.maxTbW,this.maxTbH);
			this.data[i].el.width=r.width;
			this.data[i].el.height=r.height;
			this.data[i].el.setStyle("paddingTop",Math.round((this.maxTbH-r.height)/2)+this.imagePadding);
			this.completeWidth+=r.width+this.data[i].el.getStyle("paddingLeft").toInt()+this.data[i].el.getStyle("paddingRight").toInt();
		}
		this.show();
	}
	
	this.slideComplete=function()
	{
		this.effektIsRunning=false;
	}
	
	this.show=function()
	{
		if(this.withArrows) this.wrapper.setStyles({display:"block",width: this.width-this.imagePadding-this.leftB.getStyle("width").toInt()-this.rightB.getStyle("width").toInt()-this.halfPadding});
		else this.wrapper.setStyles({display:"block",width: this.width});
		
		this.wrapper.adopt(this.el.parentNode.removeChild(this.el));
		this.el.setStyles({width:this.completeWidth,visibility: "visible"});
		this.navWrapper.innerHTML="";
		if(this.withArrows) this.navWrapper.adopt(this.leftB);
		this.navWrapper.adopt(this.wrapper);
		if(this.withArrows) this.navWrapper.adopt(this.rightB);
		
		this.slideEffekt=new Fx.Morph($('slider'), {duration: 600});//, transition: Fx.Transitions.linear});
		this.slideEffekt.onComplete=this.slideComplete.bind(this);
		
		this.navWrapper.addEvent("mouseenter",function(){this.stopSelfRun=true; this.mouseIsIn=true}.bind(this));
		this.navWrapper.addEvent("mouseleave",function(){if(this.isShowDesc===false) this.stopSelfRun=false;this.mouseIsIn=false;if(this.withArrows===false) this.resetSelfRunSpeed();}.bind(this));
		if(this.withArrows===false) this.navWrapper.addEvent("mousemove",function(e){this.mouseIsMoving(e);}.bind(this));
		
		if(this.startSelfRun===true) this.runSelf();
	}
	
	this.mouseIsMoving=function(event)
	{
		var w=event.page.x-this.navWrapper.getPosition(document).x;
		var cSec=this.getCurrentSection(w);
		this.currentSection=cSec;
		if(this.currentSection==1 || this.currentSection==8) this.selfRunSpeed=this.standardSelfRunSpeed*8;
		if(this.currentSection==2 || this.currentSection==7) this.selfRunSpeed=this.standardSelfRunSpeed*4;
		if(this.currentSection==3 || this.currentSection==6) this.selfRunSpeed=this.standardSelfRunSpeed*2;
		if(this.currentSection==4 || this.currentSection==5) this.selfRunSpeed=this.standardSelfRunSpeed;
		if(this.currentSection<5) this.runSelfDirection=this.selfRunSpeed;
		if(this.currentSection>4) this.runSelfDirection=-this.selfRunSpeed;
	}
	
	this.resetSelfRunSpeed=function()
	{
		this.selfRunSpeed=this.standardSelfRunSpeed;
		if(this.runSelfDirection<0) this.runSelfDirection=-this.standardSelfRunSpeed;
		if(this.runSelfDirection>0) this.runSelfDirection=this.standardSelfRunSpeed;
	}
	
	this.runSelf=function()
	{
		if(this.stopSelfRun===true && this.withArrows===true || this.isShowDesc===true) return setTimeout(this.runSelf.bind(this),1000);
		if(this.isDestroyed===true) return false;
		var left=$("slider").getStyle("left").toInt();
		
		if(this.getMaxWidth()<0) return;
		
		if(this.withArrows===true || this.withArrows===false && this.mouseIsIn===false)
		{
			if((left*-1)>=this.getMaxWidth() || left*-1<=0) this.selfRunSpeed=this.standardSelfRunSpeed;
			if((left*-1)>=this.getMaxWidth()) this.runSelfDirection=this.selfRunSpeed;
			if(left*-1<=0) this.runSelfDirection=-this.selfRunSpeed;
		}
		else
		{
			if(((left*-1)>=this.getMaxWidth() && this.runSelfDirection<0) || ((left*-1<=0) && this.runSelfDirection>0))  return setTimeout(this.runSelf.bind(this),50);
		}
		$("slider").setStyle("left",$("slider").getStyle("left").toInt()+this.runSelfDirection);
		setTimeout(this.runSelf.bind(this),50);
	}
	
	this.currentSection=0;
	
	this.getCurrentSection=function(x)
	{
		for(var i=1;i<this.sectionCount+1;i++) if(this.isInSection(i,x)) return i;
	}
	
	this.isInSection=function(section,x)
	{
		if(x>this.getSectionBegin(section) && x<this.getSectionBegin(section+1)) return true;
	}
	
	this.getSectionBegin=function(section)
	{
		return (section-1)/this.sectionCount*this.width;
	}
	
	this.leftB=new Element("div",{
		styles: {
			backgroundImage: "url('assets/templates/arrowLeft.gif')",
			backgroundRepeat: "no-repeat",
			height: height,
			paddingRight: this.imagePadding,
			width: arrowWidth+this.halfPadding,
			backgroundPosition: this.halfPadding+"px "+Math.round((this.height-arrowHeight)/2)+"px",cursor: "pointer",float: "left"
		},
		events: {click: this.backward.bind(this)}
	});
	this.rightB=new Element("div",
	{
		styles: {
			backgroundImage: "url('assets/templates/arrowRight.gif')",
			backgroundRepeat: "no-repeat",
			height: height,
			paddingRight: this.halfPadding,
			width: arrowWidth+this.imagePadding,
			backgroundPosition: this.imagePadding+"px "+Math.round((this.height-arrowHeight)/2)+"px",cursor: "pointer",float: "left"
		},
		events: {click: this.forward.bind(this)}
	});
}