var  TeaserFader = Class.create({

	initialize: function(divid, skipautoheight) {
		
		/* -- config --*/
		
		this.fadeTime = 6;
		
		/*------------*/
		
		this.teaserDivItems = Array();
		this.isMouseover = false;
		this.lastElement;
		this.i = 0; // var for counter
		this.divid = divid;
	
		this.teaserDivItems = $$('#' + divid + ' div.teaseritems');
		this.maxheight = 0;
		
		//if height is not definet -> get highest item in array
		if (!skipautoheight) {
			this.setTeaserItemsAutoHeight();
		}
		
		// get last element
		this.lastElement = this.teaserDivItems.first();
		// set currentTeaser
		this.currentTeaser = this.teaserDivItems.first();
		
		// if only 1 teaser is defined in HTML
		if(this.teaserDivItems.length <= 1){
			// hide borwsicons
			element = $$('#' + divid + ' div.blocktitle-browse');
			for (n=0; n<element.length; n++) {
				element[n].hide();
			}
			
		}
		else{
			//start anim
			window.setTimeout(this.initTeaserAnim.bind(this), this.fadeTime*1000); 
			
			// observe event on browseicons
			buttons = $$('#' + divid + ' a.browse-foreward');
			for (n=0; n<buttons.length; n++) {
				buttons[n].observe('click', this.teaserSwitch.bindAsEventListener(this, 'foreward'));
			}
			
			buttons = $$('#' + divid + ' a.browse-back');
			for (n=0; n<buttons.length; n++) {
				buttons[n].observe('click', this.teaserSwitch.bindAsEventListener(this, 'back'));
			}
			
			// observe event on Teaser stop/start
			$(divid).observe('mouseover',this.stopTeaserAnim.bind(this));
			$(divid).observe('mouseout',this.startTeaserAnim.bind(this));
		}

	}, 
	
	// get the highest element in the Array -> set height
	setTeaserItemsAutoHeight: function() {
		for (n=0; n< this.teaserDivItems.length; n++) {
			this.maxheight = Math.max(this.maxheight, this.teaserDivItems[n].getHeight());
		}
		$(this.divid).style.height = this.maxheight + 'px';
	},

	stopTeaserAnim: function(){
		this.isMouseover = true;
	},
	startTeaserAnim: function(){	
		this.isMouseover = false;
	},
	
	initTeaserAnim: function(){
		if(this.isMouseover==true){
			this.checkTeaserStart();	
		}
		else{
			this.fadeTeaserIn('forward', 1);
			window.setTimeout(this.initTeaserAnim.bind(this), this.fadeTime*1000); 
			
		}
	},

	// delay to restart after mouseout
	checkTeaserStart: function(){
		if(this.isMouseover==true){
			window.setTimeout(this.checkTeaserStart.bind(this), this.fadeTime*1000); 
		}
		else{
			window.setTimeout(this.initTeaserAnim.bind(this), this.fadeTime*1000); 
		}
	},

	fadeTeaserIn: function(mode, duration){
		// set currentTeaser
		this.setCurrentTeaser(mode);
		new Effect.Parallel([
			new Effect.Fade(this.lastElement,{sync: true}),
			new Effect.Appear(this.currentTeaser,{sync: true})
		], { 
			duration: duration
		});

	},

	// function called by the browse icons
	teaserSwitch: function(event, mode){
		this.fadeTeaserIn(mode, 0);
	},
	
	//setCurrentTeaser + / -
	setCurrentTeaser: function(mode){
		if(mode=="back"){
			this.i<=0 ? this.i = (this.teaserDivItems.length-1) : this.i--;
		}
		else{
			this.i = this.teaserDivItems.indexOf(this.currentTeaser);
		
			this.i >= (this.teaserDivItems.length-1) ? this.i = 0 : this.i++;
		}

		this.lastElement = this.currentTeaser;
		this.currentTeaser = $$('#' + this.divid + ' ' + 'div.teaseritems')[this.i];
		//current teaser ->
	}
	
});