var Coverflow = Class.create();
Coverflow.prototype = {
	initialize: function(coverflow, duree, secExecution, hasNavigation){
		this.coverflow = coverflow;
		this.duree = duree;
		this.secExecution = secExecution;
		this.hasNavigation = hasNavigation;
		this.nCell = 0;
		this.id = 1;
		this.po = 0;	
		this.f = $$('div#'+this.coverflow+' ul li');
		this.coverflowWidth = $(this.coverflow).getWidth();
		this.coverflowHeight = $(this.coverflow).getHeight();
		this.start();
	},
	start: function(){		
				this.mover = $(this.coverflow).firstDescendant();	
				this.nCell = this.f.length;	
				for(i=0;i!=this.nCell;i++){
					this.f[i].setStyle({
					  width: this.coverflowWidth+'px',
					  height: (this.coverflowHeight-40)+'px',
					  float: 'left'
					  });	
				}
				$(this.coverflow).setStyle({
					overflow:'hidden',
					position: 'relative'
					});
				
				$(this.coverflow).firstDescendant().setStyle({
					width:(this.coverflowWidth*this.nCell)+'px'
					});	
				
				if(this.hasNavigation){	
						// die Navigation wir gebaut
						$(this.coverflow).insert({bottom:'<div id="coverflow_navigation" class="xCoverflowNaviBackground"></div>'});
						this.coverflow_navigation = $(this.coverflow).firstDescendant().next();
						
						// der Zurück-Button
						$(this.coverflow_navigation).insert({bottom:'<div class="coverflow_button_zurueck coverflow_button_invisible"></div>'});
						this.buttonZurueck = $(this.coverflow_navigation).firstDescendant();
						$(this.buttonZurueck).insert({bottom:'<div><a class="xCoverflowIconZurueck"></a></div>'});
						
						// der Weiter-Button
						$(this.coverflow_navigation).insert({bottom:'<div class="coverflow_button_weiter coverflow_button_invisible"></div>'});
						this.buttonWeiter = $(this.buttonZurueck).next();
						$(this.buttonWeiter).insert({bottom:'<div><a class="xCoverflowIconWeiter"></a></div>'});

						// die Button-Leiste für die einzelnen Bilder
						$(this.coverflow).insert({bottom:'<ul class="picture_navigation" id="picture_navigation"></ul>'});
						this.picture_navigation  = $(this.coverflow_navigation).next();
						this.width = Math.floor(this.f.length*17);
						$(this.picture_navigation).setStyle({
							width: this.width+'px'
							});
						for(i=1;i!=(this.f.length+1);i++){
							$(this.picture_navigation).insert({bottom:'<li><a id="'+i+'" class="xCoverflowIconInaktiv coverflowIcon"></a></li>'});
						}
						$(this.picture_navigation).childElements()[0].childElements()[0].removeClassName('xCoverflowIconInaktiv');
						$(this.picture_navigation).childElements()[0].childElements()[0].addClassName('xCoverflowIconAktiv');

						this.startObserveNavigation();
				}
				this.startCoverflow();

				Event.observe($(this.coverflow),"mouseout", this.startCoverflow.bind(this));
				Event.observe($(this.coverflow),"mouseover", this.stopCoverflow.bind(this));								
	},
	startObserveNavigation: function(){
	Event.observe($(this.picture_navigation),"click", this.moveP.bind(this));
		
	// Klick auf den Zurück-Button
	Event.observe($(this.buttonZurueck),"click", this.moveBack.bind(this));
	
	// Klick auf den Weiter-Button
	Event.observe($(this.buttonWeiter),"click", this.moveForward.bind(this));
	
	// Ein-/ausblenden der Vor-/Zurück-Buttons
	Event.observe($(this.coverflow_navigation), "mouseover", this.fadeInNavigation.bind(this));
	Event.observe($(this.coverflow_navigation), "mouseout", this.fadeOutNavigation.bind(this));
	},
	startCoverflow: function(){
	this.periodik = new PeriodicalExecuter(this.Pe.bind(this),this.secExecution);	
	},
	stopCoverflow: function(){
	this.periodik.stop();
	},
	fadeInNavigation: function() {
		$(this.buttonZurueck).removeClassName('coverflow_button_invisible');
		$(this.buttonWeiter).removeClassName('coverflow_button_invisible');
	},
	fadeOutNavigation: function() {
		$(this.buttonZurueck).addClassName('coverflow_button_invisible');
		$(this.buttonWeiter).addClassName('coverflow_button_invisible');
	},
	effaceP: function(mop){
		this.mop = mop;
		if(this.hasNavigation) {
			if (this.mop < 1) {
				$(this.picture_navigation).childElements()[this.nCell-1].childElements()[0].removeClassName('xCoverflowIconAktiv');
				$(this.picture_navigation).childElements()[this.nCell-1].childElements()[0].addClassName('xCoverflowIconInaktiv');
			} else {
				if (this.mop == 1) {
					$(this.picture_navigation).childElements()[0].childElements()[0].removeClassName('xCoverflowIconAktiv');
					$(this.picture_navigation).childElements()[0].childElements()[0].addClassName('xCoverflowIconInaktiv');
					$(this.picture_navigation).childElements()[this.nCell-1].childElements()[0].removeClassName('xCoverflowIconAktiv');
					$(this.picture_navigation).childElements()[this.nCell-1].childElements()[0].addClassName('xCoverflowIconInaktiv');
				} else {
					$(this.picture_navigation).childElements()[this.mop-1].childElements()[0].removeClassName('xCoverflowIconAktiv');
					$(this.picture_navigation).childElements()[this.mop-1].childElements()[0].addClassName('xCoverflowIconInaktiv');
				}
			}
		}
	},
	effaceBack: function(mop){
		this.mop = mop;
		if(this.hasNavigation) {
			if (this.mop < this.nCell) {
				if (this.mop == 0) {
					$(this.picture_navigation).childElements()[0].childElements()[0].removeClassName('xCoverflowIconAktiv');
					$(this.picture_navigation).childElements()[0].childElements()[0].addClassName('xCoverflowIconInaktiv');
				} else {
					$(this.picture_navigation).childElements()[this.mop-1].childElements()[0].removeClassName('xCoverflowIconAktiv');
					$(this.picture_navigation).childElements()[this.mop-1].childElements()[0].addClassName('xCoverflowIconInaktiv');
				}
			} else {
				$(this.picture_navigation).childElements()[0].childElements()[0].removeClassName('xCoverflowIconAktiv');
				$(this.picture_navigation).childElements()[0].childElements()[0].addClassName('xCoverflowIconInaktiv');
				$(this.picture_navigation).childElements()[this.nCell-1].childElements()[0].removeClassName('xCoverflowIconAktiv');
				$(this.picture_navigation).childElements()[this.nCell-1].childElements()[0].addClassName('xCoverflowIconInaktiv');
			}
		}
	},
	effaceForward: function(mop){
		this.mop = mop;
		if(this.hasNavigation) {
			$(this.picture_navigation).childElements()[this.mop-1].childElements()[0].removeClassName('xCoverflowIconAktiv');
			$(this.picture_navigation).childElements()[this.mop-1].childElements()[0].addClassName('xCoverflowIconInaktiv');
		}
	},
	move: function(xp){
		this.xp = xp;
		new Effect.Move(this.mover, { 
					x: this.xp, 
					y: 0,
					mode:'absolute',
					duration: this.duree,
					transition: Effect.Transitions.sinoidal
				});
				if(this.hasNavigation){
					$(this.picture_navigation).childElements()[this.id-1].childElements()[0].addClassName('xCoverflowIconAktiv');
					$(this.picture_navigation).childElements()[this.id-1].childElements()[0].removeClassName('xCoverflowIconInaktiv');
				}	
	},	
	Pe: function(){
					if(this.id<this.nCell){
							this.po=this.po-this.coverflowWidth;
							this.effaceP(this.id);
							this.id=this.id+1;
							this.move(this.po);
						}else{
							this.po=0;
							this.firstRound = false;
							this.id=1;
							this.effaceP(this.id);
							this.move(this.po);
						}
	},
	moveP: function(evt){
		var child = Event.element(evt);
		this.occ = parseInt(child.readAttribute('id'));
		if(this.id>this.occ){
			this.diff= this.id-this.occ;
			this.po=this.po+(this.coverflowWidth*this.diff);
			this.effaceP(this.id);
			this.id=this.occ;
			this.move(this.po);
		}else if(this.id<this.occ){
			this.diff= this.occ-this.id;
			this.po=this.po-(this.coverflowWidth*this.diff);
			this.effaceP(this.id);
			this.id=this.occ;
			this.move(this.po);
		}
	},
	moveBack: function(evt){
			if (this.id == 1) {
				this.po=this.po-(this.coverflowWidth*(this.f.length-1));
				this.effaceBack(this.nCell);
				this.id=this.nCell;
				this.move(this.po);
			} else {
				this.po=this.po+this.coverflowWidth;
				this.effaceBack(this.id);
				this.id=this.id-1;
				this.move(this.po);
			}
	},
	moveForward: function(evt){
		if (this.id == this.nCell) {
			this.po=this.po+(this.coverflowWidth*(this.f.length-1));
			this.effaceForward(this.id);
			this.id=1;
			this.move(this.po);
		} else {
			this.po=this.po-this.coverflowWidth;
			this.effaceForward(this.id);
			this.id=this.id+1;
			this.move(this.po);
		}
	},
	stopEvent:function(pE)
	{
	   if (!pE)
		 if (window.event)
		   pE = window.event;
		 else
		   return;
	  if (pE.cancelBubble != null)
		 pE.cancelBubble = true;
	  if (pE.stopPropagation)
		 pE.stopPropagation();
	  if (pE.preventDefault)
		 pE.preventDefault();
	} 
};