/**
 *	Basic Slideshow App
 *
 *	Plagerised from Tom Doyle by Isotope Communications Ltd, Dec 2008
 *	http://www.tomdoyletalk.com/2008/10/28/simple-image-gallery-slideshow-with-scriptaculous-and-prototype/
 *
 *	Published [16/12/08]:
 *	http://www.icommunicate.co.uk/articles/all/simple_slide_show_for_prototype_scriptaculous_38/
 *
 *	Changes: Basically made it an object so that you can run multiple instances and so that
 *			 it doesn't get interfered with by other scripts on the page.
 *
 *			 Have also added a few things, like "Captions" and the option of changing the
 *			 effects..
 *
 *	Example:
 *			Event.observe(window, 'load', function(){
 *				oMySlides = new iSlideShow({
 *					autostart 	: true		// optional, boolean (default:true)
 *					start		: 0,	 	// optional, slides[start] (default:0)
 *					wait 		: 4000, 	// optional, milliseconds (default:4s)
 *					slides 		: [
 *						'image-div-a',
 *						'image-div-b',
 *						'image-div-c',
 *						'image-div-d'
 *					],
 *					counter		: 'counter-div-id', // optional...
 *					caption 	: 'caption-div-id', // optional...
 *					playButton	: 'PlayButton', 	// optional (default:playButton)
 *					pauseButton	: 'PauseButton', 	// optional (default:PauseButton)
 *				});
 *				oMySlides.startSlideShow();
 *			});
 *
 *			To start the slideshow:
 *				oMySlides.startSlideShow();
 *
 *			To skip forward, back, stop:
 *				oMySlides.goNext();
 *				oMySlides.goPrevious();
 *				oMySlides.stop();
 */

var iSlideShow = new Class.create();

iSlideShow.prototype = {

	initialize : function (oArgs){
		this.wait 			= oArgs.wait ? oArgs.wait : 4000;
		this.start 			= oArgs.start ? oArgs.start : 0;
		this.duration		= oArgs.duration ? oArgs.duration : 0.9;
		this.autostart	= (typeof(oArgs.autostart)=='undefined') ? true : oArgs.autostart;
		this.mode				= oArgs.mode ? oArgs.mode : 'slide';

		if (this.autostart) {
			this.startSlideShow();
		}
	},

	// The Fade Function
	nextImage: function () {
		var active;

		$$('#slides .slide-img').each(function (el, index) {
			if ($(el).hasClassName('slide-active')) {
				active = el;
			} else {
				//$(el).down('img').hide();
				//$(el).hide();
			}
		});

		var next;

		if ($(active).next()) {
			next = $(active).next();
		} else {
			next = $('slides').down('.slide-img');
		}

		$(active).removeClassName('slide-active');
		$(next).addClassName('slide-active');

		if (this.mode == 'switch') {
			new Effect.Fade(active, {
					duration: this.duration,
					afterFinish: function() {
						new Effect.Appear(next, { duration: this.duration });
					}
			});
		} else if (this.mode == 'slide') {
			new Effect.Appear(next, { duration: this.duration });
			new Effect.Fade(active, { duration: this.duration });
		} else if (this.mode == 'direct') {
			$(active).hide();
			$(next).show();
		}
	},

	// the onload event handler that starts the fading.
	startSlideShow: function () {
		setInterval(this.play.bind(this), this.wait);
	},

	play: function () {
		this.nextImage();
	}
}