/**
 * NetGroup Coverflow for Mootools
 */

var NGFlow = new Class({
	Implements: [Options, Events],
	options: {
		items		: [],
		startIndex	: 0,
		wrap		: true,
		transition	: Fx.Transitions.Sine.easeInOut,
		duration	: 500,
		autorun		: 0
		//onShow	: $empty
	},
	initialize: function(options){
		this.setOptions(options);
		this.addItems(this.options.items);
		this.timeout = null;
		this.interval = null;
		if(this.items.length){
			this.moveTo(this.options.startIndex);
			this.startTimeout();
		}
	},
	items: [],
	transition: Fx.Transitions.Sine.easeInOut,
	duration: 1000,
	startTimeout: function(){
		this.timeout = setTimeout(this.startInterval.bind(this), 5000);
	},
	stopTimeout: function(){
		if(this.timeout != null){
			clearTimeout(this.timeout);
			this.timeout = null;
		}
	},
	startInterval: function(){
		this.duration = 1500;
		this.transition = Fx.Transitions.Sine.easeInOut;
		this.interval = setInterval(this.moveNext.bind(this), 5000);
	},
	stopInterval: function(){
		if (this.interval != null){
			clearInterval(this.interval);
			this.interval = null;
			this.duration = 1000;
			this.transition = Fx.Transitions.Sine.easeInOut;
		} 
	},
	addItems: function(items){
		$$(items).each(function(item){
			this.items.include($(item));
			item.addEvent('click', this.clickItem.bind(this, item));
		}, this);
		this.count = this.items.length;
		this.half = Math.floor(this.count / 2);
	},
	addItem: function(item){
		this.addItems(Array.from($(item)));
	},
	clickItem: function(item){
		this.stopTimeout();
		this.stopInterval();
		index = this.items.indexOf(item);
		this.moveTo(index);
		this.startTimeout();
	},
	clickNext: function(item){
		this.stopTimeout();
		this.stopInterval();
		this.moveNext();
		this.startTimeout();
	},
	clickPrev: function(item){
		this.stopTimeout();
		this.stopInterval();
		this.movePrev();
		this.startTimeout();
	},
	moveNext: function(){
		index = (this.now + 1) % this.count;
		this.moveTo(index);
	},
	movePrev: function(){
		index = (this.now + this.count - 1) % this.count;
		this.moveTo(index);
	},
	moveTo: function(position){
		Array.each(this.items, function(item, index){
			offset = index - position;
			left_old = item.getStyle('left').toInt();
			if(offset == 0){
				left = 500;
				width = 184;
				height = 250;
			} else {
				if(offset < -(this.half)){
					offset += this.count;
				} else if(offset > this.half){
					offset -= this.count;
				}
				left = (offset < 0) ? 460 + 180 * offset : 540 + 180 * offset;
				width = 144;
				height = 194;
			}
			// Wrap-Around Items verstecken
			distance = Math.abs(left_old - left);
			if (distance > 1000) {
				item.setStyle('display', 'none');
			} else {
				item.setStyle('display', 'block');
			}

			// Item verschieben
			var myEffect = new Fx.Morph(item, {
				link		: 'chain',
				transition	: this.transition,
				duration	: this.duration
			});
			if(offset == 0){
				myEffect.addEvent('complete', function(){
					this.getChildren('.links').setStyle('display', 'block');
					//this.getChildren('.links').fade('in');
					this.getChildren('.title').setStyle('display', 'block');
					//this.getChildren('.title').fade('in');
				}.bind(item));
			} else {
				myEffect.addEvent('start', function(){
					this.getChildren('.links').setStyle('display', 'none');
					//this.getChildren('.links').fade('out');
					this.getChildren('.title').setStyle('display', 'none');
					//this.getChildren('.title').fade('out');
				}.bind(item));
			}
			myEffect.start({
				//'opacity'		: (left < 0 || left > 1000) ? 0 : 1,
				'width'			: width,
				'height'		: height,
				'left'			: left,
				'margin-left'	: -Math.floor(width / 2)
			});
		}.bind(this));
		this.now = position;
	}
});