var MoeFade = new Class({

	options: {
		btn_previous:		null,
		btn_pause:		null,
		btn_next:		null,
		play_phrase:		'',
		pause_phrase:		'',
		container_height:	200,					// Height for the Container Div
		container_width:	500,					// Width for the Container Div
		heightunit:		'px',
		widthunit:		'px',
		duration:		500,					// Duration for Transition
		el_container:		null,					// The container div that houses the UL
		classsfx:		'',
		pauseable:		false,
		pausetime:		2000					// Pause time after transition
	},

	btn_previous:		null,
	btn_pause:		null,
	btn_next:		null,
	curslide:		0,
	prevslide:		0,
	numbers:		Array,
	el_debug:		null,
	el_container:		null,
	el_items:		null,
	paused:			false,
	paused2:		false,
	timer:			null,

	initialize: function(options){
		this.setOptions(options);
		this.btn_previous	= $(this.options.btn_previous);
		this.btn_pause		= $(this.options.btn_pause);
		this.btn_next		= $(this.options.btn_next);
		this.el_container	= $(this.options.el_container);
		this.el_items		= $$('#'+this.options.el_container+' div.mditem'+this.options.classsfx);

		this.el_container.setStyle('height', this.options.container_height+this.options.heightunit);
		this.el_container.setStyle('width', this.options.container_width+this.options.widthunit);

		var container_width     = this.el_container.getSize().size.x;
		var container_height    = this.el_container.getSize().size.y;

		this.numbers = new Array();

		this.el_items.each( function(item,i) {
			item.setStyles({
				position: 'absolute',
				left: 0,
				top: 0,
				width: parseFloat(container_width)+'px',
				height: parseFloat(container_height)+'px',
				opacity: 0
			});

/*
			tmp = new Element('div', {styles: {
					'position':	'absolute',
					'bottom':	'20px',
					'left':		i*40,
					'border':	'solid 1px #c1c1c1',
					'text-align':	'center',
					'padding-top':	'4px',
					'width':	'20px',
					'height':	'20px',
					'color':	'#c1c1c1'
				}}).setText(i).injectInside(this.el_container);

			tmp.addEvent('mouseover', function() { this.setStyles({'border': '1px solid blue', 'color': 'blue'}); });
			tmp.addEvent('mouseout', function() { this.setStyles({'border': '1px solid #c1c1c1', 'color': '#c1c1c1'}); });
			tmp.addEvent('click', function() { this.prevslide = this.curslide; this.curslide = i; this.move(); }.bind(this));

			this.numbers.include(tmp);
*/

		}.bind(this));

		if (($type(this.btn_pause) == 'element') && (this.btn_pause != null)) {
			this.btn_pause.setStyle('z-index', 99);
			this.btn_pause.addEvent('click', function(event) { this.pauseFader2(); }.bind(this));
		}

		if (($type(this.btn_next) == 'element')  && (this.btn_next != null)) {
			this.btn_next.setStyle('z-index', 99);
			this.btn_next.addEvent('click', function(event) { this.moveNext(); }.bind(this));
		}

		if (($type(this.btn_previous) == 'element') && (this.btn_previous != null)) {
			this.btn_previous.setStyle('z-index', 99);
			this.btn_previous.addEvent('click', (function(event) { this.movePrevious(); }.bind(this)));
		}

		if (this.options.pauseable) {
			this.el_container.addEvent('mouseover', function(event) { if (!this.paused2) this.pauseFader();   }.bind(this));
			this.el_container.addEvent('mouseout',  function(event) { if (!this.paused2) this.startFader(); }.bind(this));
		}

		this.curslide = 0;
		this.prevslide = 0;
		this.el_items[this.curslide].effect('opacity', {duration: this.options.duration}).start(1);
//		this.highlightNumber();
		this.repeater.delay(this.options.pausetime+this.options.duration, this);
	},

	pauseFader:	function() { if (this.paused && !this.paused2) this.startFader(); else this.stopFader(); },
	startFader:	function() { if ($(this.options.btn_pause) != null) $(this.options.btn_pause).innerHTML = this.options.pause_phrase; this.paused = false; this.timer = this.repeater.delay(this.options.duration+this.options.pausetime, this); },
	stopFader:	function() { if ($(this.options.btn_pause) != null) $(this.options.btn_pause).innerHTML = this.options.play_phrase;  this.paused = true; $clear(this.timer); $clear(this.repeater); },

	pauseFader2:	function() { if (this.paused2) this.startFader2(); else this.stopFader2(); },
	startFader2:	function() { if ($(this.options.btn_pause) != null) $(this.options.btn_pause).innerHTML = this.options.pause_phrase; this.paused2 = false; this.timer = this.repeater.delay(this.options.duration+this.options.pausetime, this); },
	stopFader2:	function() { if ($(this.options.btn_pause) != null) $(this.options.btn_pause).innerHTML = this.options.play_phrase;  this.paused2 = true; $clear(this.timer); $clear(this.repeater); },

	repeater: function() {
		this.moveNext();
	},

	moveNext: function() {
		if (!this.paused && !this.paused2) {
			this.prevslide = this.curslide;
			this.curslide += 1;
			if (this.curslide >= this.el_items.length) this.curslide = 0;
			this.move();
		}
		$clear(this.timer);
		$clear(this.repeater);
		this.timer = this.repeater.delay((this.options.pausetime+(this.options.duration*2)), this);
//		this.highlightNumber();
	},

	movePrevious: function() {
		if (!this.paused && !this.paused2) {
			this.prevslide = this.curslide;
			this.curslide -= 1;
			if (this.curslide <= 0) this.curslide = this.el_items.length - 1;
			this.move();
		}

		$clear(this.timer);
		$clear(this.repeater);
		this.timer = this.repeater.delay((this.options.pausetime+(this.options.duration*2)), this);
	},

	move: function() {
		if(this.el_items[this.prevslide].fx) this.el_items[this.prevslide].fx.stop();
		if(this.el_items[this.curslide].fx)  this.el_items[this.curslide].fx.stop();
		this.el_items[this.prevslide].fx = this.el_items[this.prevslide].effect('opacity', {duration: this.options.duration}).start(0);
		this.el_items[this.curslide].fx = this.el_items[this.curslide].effect('opacity', {duration: this.options.duration}).start(1);
//		this.highlightNumber();
	},

	highlightNumber: function() {
		var fx = new Fx.Styles(this.numbers[this.curslide], {duration: this.options.duration, wait: false});
		fx.start({
			'border-color': '#000',
			'color':  '#000'
		});

		var fx2 = new Fx.Styles(this.numbers[this.prevslide], {duration: this.options.duration, wait: false});
		fx2.start({
			'border-color': '#c1c1c1',
			'color':  '#c1c1c1'
		});
	}
});

MoeFade.implement(new Options, Chain);