var Fader = new Class({

	Implements: [Events, Options],
	
	options: {
		element: 6000,
		content: 1500,
		transition: 500
	},
	
	initialize: function(container, options){
		this.setOptions(options);
		
		this.i = 0;
		this.n = 0;
		this.fading = false;
		this.paused = false;
		this.element_timeout = false;
		this.content_timeout = false;
		
		this.container = container.setStyles({
			position: 'relative',
			padding: '0'
		});
		
		this.elements = this.container.getElements('.element');
		
		this.elements.each(function(element){
			element.setStyles({
				position: 'absolute',
				left: '0px',
				top: '0px',
				display: 'none'
			}).set('tween', {
				duration: this.options.transition,
				link: 'cancel',
				onComplete : function() {
					this.elements[this.n].setStyles({
						display: 'block',
						zIndex: 2,
						opacity: 1
					});
					this.elements[this.i].setStyles({
						display: 'none',
						zIndex: 1,
						opacity: 1
					});
					this.i = this.n;
					if (!this.paused) {
						this.swap();
					}
					this.fading = false;
				}.bind(this)
			}).getElement('.content').setStyles({
				'opacity': 0.7,
				'cursor': 'pointer'
			}).set('tween', {
				duration: this.options.transition,
				link: 'cancel'
			}).addEvent('click', function(){
				window.location.href = element.getElement('a').getProperty('href');
			});
		}.bind(this));
		
		this.elements[0].setStyles({
			display: 'block',
			zIndex: 2,
			opacity: 1
		});
		
		this.swap();
	},
	
	play: function(){
		this.paused = false;
		if (!this.fading) {
			$clear(this.element_timeout);
			$clear(this.content_timeout);
			this.swap();
		}
	},
	
	pause: function(){
		this.paused = true;
		if (!this.fading) {
			$clear(this.element_timeout);
			$clear(this.content_timeout);
		}
	},
	
	next: function(){
		if (this.fading) {
			this.elements[this.n].get('tween').pause()
			this.elements[this.n].setStyles({
				display: 'block',
				zIndex: 2,
				opacity: 1
			});
			this.elements[this.i].get('tween').pause()
			this.elements[this.i].setStyles({
				display: 'none',
				zIndex: 1,
				opacity: 1
			});
			this.i = this.n;
			this.fading = false;
		}
		$clear(this.element_timeout);
		$clear(this.content_timeout);
		this.fade(1);
	},
	
	previous: function(){
		$clear(this.element_timeout);
		$clear(this.content_timeout);
		this.fade(-1);
	},
	
	swap: function() {
		if (!this.paused) {
			this.element_timeout = (function() { this.fade(1) }.bind(this)).delay(this.options.element);
		}
	},
	
	fade: function(n) {
		this.fading = true;
	
		this.n = this.i+n;
		if (this.n >= this.elements.length) {
			this.n = 0;
		} else if (this.n < 0) {
			this.n = this.elements.length-1;
		}
		
		this.elements[this.n].setStyles({
			display: 'block',
			zIndex: 1,
			opacity: 1
		}).getElement('.content').setStyle('bottom', -this.elements[this.n].getElement('.content').getSize().y);

		this.elements[this.i].tween('opacity', 0);
		this.elements[this.i].getElement('.content').tween('bottom', -this.elements[this.i].getElement('.content').getSize().y);
		
		var bottom = this.elements[this.n].getSize().y - this.elements[this.n].getElement('img').getSize().y
		
		this.content_timeout = (function() { this.elements[this.n].getElement('.content').tween('bottom', bottom) }.bind(this)).delay(this.options.content);
	}
	
});
