// JavaScript Document
window.addEvent('domready', function() {
	if ($('headlines')) {
		var headlines = new Slideshow(('.headlinePanel'), {
			previous: 'previousPanel',
			pause: 'pausePanel',
			next: 'nextPanel',
			progressButton: true,
			onInit: function(slides, index) {
				slides[index].retrieve('button').setStyle('background-position', 'bottom');
				slides.each(function(slide, i) {
					slide.retrieve('button').addEvents({
						'click': function(event) {
							event.preventDefault();
							headlines.display(false, i, true);
						},
						'mouseover': function() {
							if (i !== headlines.index) slide.retrieve('button').setStyle('background-position', 'bottom');
						},
						'mouseout': function() {
							if (i !== headlines.index) slide.retrieve('button').setStyle('background-position', 'top');
						}
					});
				});
			},
			onHide: function(slides) {
				for (var i = 0, l = slides.length; i < l; i += 1) slides[i].retrieve('button').setStyle('background-position', 'top');
			},
			onShow: function(slides, index) {
				slides[index].retrieve('button').setStyle('background-position', 'bottom');
			}
		});
	}
});

var Slideshow = new Class({
	Implements: [Options, Events, Chain],
	options: {
		// onInit: $empty,
		// onHide: $empty,
		// onShow: $empty,
		start: 0,
		delay: 14000,
		duration: 1200,
		hideClass: 'hideSlide',
		showClass: 'showSlide',
		opacity: true,
		progressButton: false,
		progressPanel: 'panelProgress',
		previous: null,
		pause: null,
		next: null
	},
	initialize: function(slides, options) {
		var progress = $(this.options.progressPanel);
		this.setOptions(options);
		this.slides = $$(slides);
		this.index = this.options.start;
		if (this.options.opacity) {
			for (var i = 0, l = this.slides.length; i < l; i += 1) {
				if (this.options.progressButton) this.slides[i].store('button', new Element('a').inject(progress));
				if (i !== this.index) this.slides[i].setStyle('opacity', '0');
				this.slides[i].set('tween', {
					duration: this.options.duration,
					onComplete: function() {
						this.callChain();
					}.bind(this)
				});
			}
		}
		this.timer = setInterval(function() {
			this.display(true);
		}.bind(this), this.options.delay);
		this.setControls(this.options.previous, this.options.pause, this.options.next);
		this.fireEvent('onInit', [this.slides, this.index]);
	},
	display: function(effects, show, pause) {
		this.hideSlide(this.slides[this.index], effects);
		if ($type(show) === 'number') {
			this.index = show;
		} else if (show === 'previous') {
			this.index = this.index === 0 ? this.slides.length - 1: this.index - 1;
		} else {
			this.index = this.index === this.slides.length - 1 ? 0: this.index + 1;
		}
		this.showSlide(this.slides[this.index], effects);
		if (pause) clearTimeout(this.timer);
	},
	hideSlide: function(slide, effects) {
		this.chain(
			function() {
				if (effects) {
					slide.tween('opacity', '0');
				} else {
					slide.setStyle('opacity', '1');
					this.callChain();
				}
			},
			function() { slide.removeClass(this.options.showClass).addClass(this.options.hideClass); this.callChain(); },
			function() {
				this.fireEvent('onHide', [this.slides, this.index]);
				this.callChain();
			}
		);
	},
	showSlide: function(slide, effects) {
		this.chain(
			function() {
				this.fireEvent('onShow', [this.slides, this.index]);
				this.callChain();
			},
			function() { slide.removeClass(this.options.hideClass).addClass(this.options.showClass); this.callChain(); },
			function() {
				if (effects) {
					slide.tween('opacity', '1');
				} else {
					slide.setStyle('opacity', '1');
					this.callChain();
				}
			}
		);
		this.callChain();
	},
	setControls: function(prevLink, pauseLink, nextLink) {
		if (prevLink) {
			$(prevLink).addEvent('click', function(event) {
				event.preventDefault();
				this.display(false, 'previous', true);
			}.bind(this));
		}
		if (nextLink) {
			$(nextLink).addEvent('click', function(event) {
				event.preventDefault();
				this.display(false, 'next', true);
			}.bind(this));
		}
		if(pauseLink) {
			$(pauseLink).addEvent('click', function(event) { 
				event.preventDefault(); clearTimeout(this.timer);
			}.bind(this));
		}
	}
});