/**
 *	Basic Slideshow App
 *	
 *	Plagerised from Tom Doyle by Isotope Communications Ltd, Dec 2008
 *
 * Edited By: Traviss 4.12.2010
 *	-added jumpTo function
 *	-removed some code
 *	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 : 3500;
		this.start 	= oArgs.start ? oArgs.start : 0;
		this.duration = oArgs.duration ? oArgs.duration : 0.25;
		this.slides = $(oArgs.slideDiv).childElements('.slide');
		this.counter = oArgs.counter;
		this.caption = oArgs.caption;
		this.playButton	= oArgs.playButton ? oArgs.playButton : 'PlayButton';
		this.pauseButton = oArgs.pauseButton ? oArgs.pauseButton : 'PauseButton';
		this.iImageId = this.start;
		this.numOfImages = this.slides.length;
		
		if ( this.slides.length > 1 ) {
			//make the jumpnav
			var jNav = this.generateNavigation();
			
			if (jNav) {
				//listen to see if the nav is clicked
				var jumptoNav =  this.jumpTo.bindAsEventListener(this);
       			$('jumpNav').observe('click', jumptoNav);
       		}

		}
        else {
            $('navWrapper').hide();
        }
	
	},

    imageLoader: function() {

   			for (i = 1; i < this.numOfImages; i++) {
                if( $(this.slides[i]).down('img.imageLoader') ) {
                    $(this.slides[i]).down('img.imageLoader').removeClassName('imageLoader');
   			    }
   			}
    
    },
	
	// The Fade Function
	swapImage: function (x,y) {	

        if( $(this.slides[x]).down('img.imageLoader') ) {
            $(this.slides[x]).down('img.imageLoader').removeClassName('imageLoader');
        }
	
		$(this.slides[y]) && $(this.slides[y]).fade({duration: this.duration });
		$(this.slides[x]) && $(this.slides[x]).appear({ duration: this.duration });

	},
	
	// the onload event handler that starts the fading.
	startSlideShow: function () {

		if ( this.slides.length > 1 ) {

    		this.playId = setInterval(this.play.bind(this),this.wait);
	    	this.updateLocation();
        }
        
	},
	
	play: function () {
		
		var imageShow, imageHide;
	
		imageShow = this.iImageId+1;
		imageHide = this.iImageId;
		
		if (imageShow == this.numOfImages) {
			this.swapImage(0,imageHide);	
			this.iImageId = 0;					
		} else {
			this.swapImage(imageShow,imageHide);			
			this.iImageId++;
		}
		this.updateLocation();
		
		
	},
	
	stop: function  () {
		clearInterval(this.playId);				
		$(this.playButton).appear({ duration: 0});
		$(this.pauseButton).hide();
	},
	
	goNext: function () {
		clearInterval(this.playId);
		
		var imageShow, imageHide;
	
		imageShow = this.iImageId+1;
		imageHide = this.iImageId;
		
		if (imageShow == this.numOfImages) {
			this.swapImage(0,imageHide);	
			this.iImageId = 0;					
		} else {
			this.swapImage(imageShow, imageHide);			
			this.iImageId++;
		}
		this.updateLocation();
		
	},
	jumpTo: function (e) {
		clearInterval(this.playId);
        var btnRelAttr = e.findElement('a').readAttribute('rel');
	
		if (!btnRelAttr) {//clicking the bar will start the show again
			this.startSlideShow();
		} else {
			var imgPos = (parseInt(btnRelAttr)	 - 1);
		
			if (btnRelAttr == "prev") {
				this.goPrevious();
			} else if (btnRelAttr == "next") {
				this.goNext();
			} else {
				//only jump if destination image is not the current image
				if (imgPos !== this.iImageId) {
					this.swapImage(imgPos, this.iImageId);
					this.iImageId = imgPos;
					this.updateLocation();
				}
			}
		}
		
  	},
	goPrevious: function () {
		clearInterval(this.play);
	
		var imageShow, imageHide;
					
		imageShow = this.iImageId - 1;
		imageHide = this.iImageId;
		
		if (this.iImageId == 0) {
			this.swapImage(this.numOfImages-1,imageHide);	
			this.iImageId = this.numOfImages-1;		
			
						
		} else {
			this.swapImage(imageShow,imageHide);			
			this.iImageId--;
			
		}
		this.updateLocation();
		
	},
	generateNavigation: function () {
		var jumpNav = $('jumpNav');
		if (!$('prev')) {//make sure we never can create two navigations
        	$(jumpNav).insert('<li><a href="javascript:" class="carousel-control reverse" rel="prev" id="prev"><img src="/topimg/carousel/reverse_off_state.png"></a></li>');
   			var i;
   			//generate the jump buttons
   			for (i = 1; i <= this.numOfImages; i++) {
   				$(jumpNav).insert('<li><a href="javascript:" class="carousel-jumper list" id="list' + i + '" rel="' + i + '">' + '<img src="/topimg/carousel/off_state.png">' + '</a></li>');
   			}
			$(jumpNav).insert('<li><a href="javascript:" class="carousel-control forward" rel="next" id="next"><img src="/topimg/carousel/forward_off_state.png"></a></li>');
			return true;
		}
	},
	updateLocation: function () {
		var listLocId = "list" + (this.iImageId + 1);
		var listEle = $(listLocId);
		$$('a.carousel-jumper ').each (function (li) {
			$(li).removeClassName('current');
		});
		$(listEle).addClassName('current');
	}
	
	
}