var started = false;

var FM_TeaserControl = new Class({

	init: function(itemContainer){

		this.itemContainer = itemContainer;
		this.fadeinfx = null;
		this.fadeoutfx = null;
		this.options = {
			zIndex 		: 200,
			duration 	: 2500,
			interval 	: 6000
		};
		this.teaserItems = this.getTeaserItems();

		if(this.teaserItems.length > 1) {
			this.timer = this.showNextItem.periodical(this.options.interval, this);
		}
	},

	getTeaserItems : function(){

		var tempItems = [];
		$A($(this.itemContainer).getElements('div')).each(function(el,index){
			if(el.hasClass('teaser_karussell_item')){
				tempItems.push(el);

				if(el.getStyle('visibility') != 'hidden'){
					this.currentItem = index;
				}
			}
		}, this);

		return tempItems;

	},

	showNextItem : function(){
		this.showItemNumber((this.currentItem+1) % this.teaserItems.length);
	},

	showPrevItem : function(){
		this.showItemNumber((this.currentItem-1 + this.teaserItems.length) % this.teaserItems.length);
	},

	forward : function(){
		if(started) {
			return;
		}
		this.stopIntervall();
		this.showNextItem();
		this.startIntervall();
//		started = true;
//
//		$clear(this.timer);
//		this.timer = null;
//
//		this.showItemNumber((this.currentItem+1) % this.teaserItems.length);
//
//		this.timer = this.showNextItem.bind(this).periodical(this.options.interval);
	},

	backward : function(){
		if(started) {
			return;
		}
	    //this.stopEffect();
		started = true;

		$clear(this.timer);
		this.timer = null;
		if(this.currentItem == 0) {
			var itemNum = this.teaserItems.length;
		} else {
			var itemNum = this.currentItem;
		}
		this.showItemNumber((itemNum-1) % this.teaserItems.length);

		this.timer = this.showNextItem.bind(this).periodical(this.options.interval);
	},

	clickShowItem : function(event, nextItem){
		this.stopEffect();

		$clear(this.timer);
		this.timer = null;

		this.showItemNumber(nextItem);

		this.timer = this.showNextItem.bind(this).periodical(this.options.interval);
	},

	showItemNumber : function (nextItem) {
		//this.stopEffect();

		var e1 = this.teaserItems[this.currentItem];
		var e2 = this.teaserItems[nextItem];
		var to1 = 0;
		var to2 = 1;


		this.fadeoutfx = new Fx.Tween(e1, {
			duration: this.options.duration,
			property: 'opacity',
			wait: true,
			fps:16,
			transition: Fx.Transitions.linear,
			onComplete: function() {
				started = false;
			}
		});
		this.fadeinfx = new Fx.Tween(e2, {
			duration: this.options.duration,
			property: 'opacity',
			wait: true,
			fps:16,
			transition: Fx.Transitions.linear,
			onComplete: function() {
				started = false;
				$('forward').setStyle('visibility','visible');
			}
		});

		if (this.currentItem == 0) {
			e1.setStyle("z-index",200);
		}

		e2.setStyle("z-index",(e1.getStyle("z-index")-1));
		e2.setStyle('visibility','visible');
		e1.setStyle("opacity",to2);
		e2.setStyle("opacity",to1);
		$('forward').setStyle('visibility','hidden');
		this.fadeoutfx.start(to1);
		this.fadeinfx.start(to2);
		this.currentItem = nextItem;
	},

	stopEffect : function(){
		if(this.fadeoutfx){
			this.fadeoutfx.cancel();
		}

		if(this.fadeinfx){
			this.fadeinfx.cancel();
		}
	},


	startIntervall : function() {
		this.timer = this.showNextItem.bind(this).periodical(this.options.interval);
	},

	stopIntervall : function() {
		this.stopEffect();
		$clear(this.timer);
		this.timer = null;
	}
});

window.addEvent('domready', function() {

	var header = $$('div.teaser_karussell_inner');

	header.each(function(el){

		el.fm_teaserControl = new FM_TeaserControl()
		el.fm_teaserControl.init(el);

		var forward = $('forward');
		var backward = $('backward');

		if(forward) {
			forward.addEvent('click',function(e){
				e.stop();
				this.forward();

			}.bindWithEvent(el.fm_teaserControl));
		}

		if(backward) {
			backward.addEvent('click',function(e){
				e.stop();
				this.backward();

			}.bindWithEvent(el.fm_teaserControl));
		}
	});

});