/**
 * @author Bruno Bornsztein <bruno@missingmethod.com>
 * @copyright 2007 Curbly LLC
 * @package Glider
 * @license MIT
 * @url original on http://www.missingmethod.com/projects/glider/
 * @version 0.0.3
 * @dependencies prototype.js 1.5.1+, effects.js
 * @changed by Felix Mallek
 */

/*
 * Thanks to Andrew Dupont for refactoring help and code cleanup -
 * http://andrewdupont.net/
 */

GalleryFader = Class.create();
Object.extend(Object.extend(GalleryFader.prototype, Abstract.prototype), {
	initialize : function(wrapper, options) {
		this.scrolling = false;
		this.wrapper = $(wrapper);
		this.scroller = this.wrapper.down('div.fader');
		this.sections = this.wrapper.getElementsBySelector('div.section');
		this.options = Object.extend( {
			duration : 1.0,
			frequency : 3
		}, options || {});

		this.sections.each(function(section, index) {
			if (index != 0) {
				section.hide();
			}
			section._index = index;
		});

//		this.events = {
//			click : this.click.bind(this)
//		};

//		this.addObservers();
		if (this.options.initialSection)
			this.showElement(this.options.initialSection, this.scroller, {
				duration : this.options.duration
			}); // initialSection should be the id of
		// the section you want to show up on
		// load
		if (this.options.autoGlide)
			this.start();
	},

	addObservers : function() {
		var controls = this.wrapper.getElementsBySelector('div.controls a');
		controls.invoke('observe', 'click', this.events.click);

		new Event.observe($("playback_control"), 'click', this.click
				.bindAsEventListener(this));
	},

	click : function(event) {
		var element = Event.findElement(event, 'a');
		if (this.scrolling)
			this.scrolling.cancel();
		var string = element.href.split("#")[1];

		if (string == "play") {
			this.start();
		} else if (string == "pause") {
			this.stop();
		} else if (string == "next") {
			this.stop();
			this.next();
		} else if (string == "prev") {
			this.stop();
			this.previous();
			
		} else {
			this.stop();
			this.showElement(string);
		}
		Event.stop(event);
	},

	showElement : function(element, options) {
		this.current = element;
		$(element).hide();
		Effect.Appear(element, {
			duration : 1,
			queue : 'front'
		});
		$(element).siblings().each(function(section, index) {
			if (section.visible()) {
				Effect.Fade(section, {
					duration : 1,
					queue : 'front'
				});
			}
		});

		return false;
	},

	next : function() {
		if (this.current) {
			var currentIndex = this.current._index;
			var nextIndex = (this.sections.length - 1 == currentIndex) ? 0
					: currentIndex + 1;
		} else
			var nextIndex = 1;

		this.showElement(this.sections[nextIndex], this.scroller, {
			duration : this.options.duration
		});
	},

	previous : function() {
		if (this.current) {
			var currentIndex = this.current._index;
			var prevIndex = (currentIndex == 0) ? this.sections.length - 1
					: currentIndex - 1;
		} else
			var prevIndex = this.sections.length - 1;

		this.showElement(this.sections[prevIndex], this.scroller, {
			duration : this.options.duration
		});
	},

	stop : function() {
		clearTimeout(this.timer);
		if ($$('a[href="#pause"]')[0].visible()) {
			$$('a[href="#pause"]')[0].hide();
		}
		if (!$$('a[href="#play"]')[0].visible()) {
			$$('a[href="#play"]')[0].show();
		}
	},

	start : function() {
		this.periodicallyUpdate();
//		if ($$('a[href="#play"]')[0].visible()) {
//			$$('a[href="#play"]')[0].hide();
//		}
//		if (!$$('a[href="#pause"]')[0].visible()) {
//			$$('a[href="#pause"]')[0].show();
//		}
	},

	periodicallyUpdate : function() {
		if (this.timer != null) {
			clearTimeout(this.timer);
			this.next();
		}
		this.timer = setTimeout(this.periodicallyUpdate.bind(this),
				this.options.frequency * 1000);
	}

});