/*
 * Left / right slideshow using scriptaculous and prototype
 * Based on idea by http://robertheath.net/2009/07/prototypescriptaculous-slideshow-example/
 * But cleaned up to run seperatly
 * expects to find a container (.slideshow) that contains slide blocks
 */


function processSlideshow() {
	//Gets finds all slideshow parents that have not already been processed
	$$(".slideshowContainer").findAll(
			function(slideshow){return !slideshow.hasClassName("slideshowProcessed");}
		).each(function(slideshow){
			//for each slideshow
			slideshow.timeout 		= 8;
			//Width of slide images : Takes from container
			var dimensions 			= slideshow.getDimensions();
			slideshow.slideWidth 	= dimensions.width;
			slideshow.slideHeight 	= dimensions.height;
			// Internal variables
			slideshow.currentSlide 	= 0;
			slideshow.nextSlide 		= 0;
			slideshow.previousSlide 	= 0;
			slideshow.working 		= false;	
			slideshow.slideCount 	= slideshow.childElements().length;
			
			slideshow.childElements().each(function(slide){
				//for each slide : Set same dims as parent container
				slide.absolutize();
				slide.width = slideshow.slideWidth;
				slide.height	= slideshow.slideHeight;
			});
			
			
			if (!slideshow.childElements()[0].visible()) Effect.Appear(slideshow.childElements()[0]);
			
			/*
			 * Add methods and interface to slideshow container
			 */
			
			// Start/Resume slideshow
			slideshow.play = function(){
				if (!this.childElements()[0].visible()) Effect.Appear(this.childElements()[0]);
				slideshow.updateStatus();
				this.pe = new PeriodicalExecuter(function(pe){
					this.next();
				}.bind(this), this.timeout);
			};
			
			
			// Pause slideshow
			slideshow.pause = function(){
				this.pe.stop();
				this.updateStatus("Paused");
			};
			slideshow.observe("mouseover", function(){slideshow.pause();});
			
			slideshow.observe("mouseout", function(){slideshow.play();});
			
			//next slide
			slideshow.next = function(){
				if (!this.working) {
					this.working = true;
					// Slideshow has just started
					if (this.currentSlide < 0) 
						this.currentSlide = 0;
					// Set next slide, start over if we are at the end
					if (this.currentSlide < this.slideCount - 1) 
						this.nextSlide = this.currentSlide + 1;
					else 
						this.nextSlide = 0;
					this.slideLeft();
					this.previousSlide = this.currentSlide;
					this.currentSlide = this.nextSlide;

					this.updateStatus();
					//stop : reset : restart autoplay
					this.pe.stop();
					this.play();
				}
			};			
			//next slide
			slideshow.prev = function(){
				if (!this.working) {
					this.working = true;
					// Slideshow has just started
					if (this.currentSlide < 0) 
						this.currentSlide = 0;
					// Set prev slide, start over if we are at the end
					if (this.currentSlide == 0) 
						this.previousSlide = this.slideCount - 1;
					else 
						this.previousSlide = this.currentSlide - 1;
					this.slideRight();
					
					this.nextSlide = this.currentSlide;
					this.currentSlide = this.previousSlide;
					this.updateStatus();
					//stop : reset : restart autoplay
					this.pe.stop();
					this.play();
				}	
			};				
			
			//add navigation buttons
			slideshow.btnNext = new Element("div",{"class":"slideshowButton next"}).update("Next slide").observe("click", function(){slideshow.next();});
			slideshow.up().insert(slideshow.btnNext);
			
			slideshow.btnPrev = new Element("div",{"class":"slideshowButton prev"}).update("Previous slide").observe(	"click", function(){slideshow.prev();});
			slideshow.up().insert(slideshow.btnPrev);			

			slideshow.status = new Element("div",{"class":"slideshowMessage"});
			slideshow.up().insert(slideshow.status);

			//function to update status
			slideshow.updateStatus = function(message){
				if(!message) message = (this.currentSlide + 1) + " / " + this.slideCount;
				this.status.update(message);
			}
	
			slideshow.slideLeft = function(){
				// Setup slide start positions
				this.childElements()[this.currentSlide].setStyle({left: '0px',top: '0px',display: 'inline',zIndex: '2'});
				this.childElements()[this.nextSlide].setStyle({left: this.slideWidth + 'px',top: '0px',display: 'inline',zIndex: '1'});
				// Move them to new positions
				new Effect.Morph(this.childElements()[this.currentSlide], {style: {left: '-' + this.slideWidth + 'px'}});				
				new Effect.Morph(this.childElements()[this.nextSlide], {style: {left: '0px'},
					afterFinish: function(){
						slideshow.working = false;
					}
				});
			}//func
			slideshow.slideRight = function(){
				// Setup slide start positions
				this.childElements()[this.previousSlide].setStyle({left: "-" + this.slideWidth + 'px',top: '0px',display: 'inline',zIndex: '1'});
				this.childElements()[this.currentSlide].setStyle({left: '0px',top: '0px',display: 'inline',zIndex: '2'});
				
				// Move them to new positions
				new Effect.Morph(this.childElements()[this.previousSlide], {style: {left: '0px'}});				
				new Effect.Morph(this.childElements()[this.currentSlide], {style: {left: this.slideWidth + 'px'},
					afterFinish: function(){
						slideshow.working = false;
					}
				});
			}//func

			slideshow.play();

			//add classname to signal that has been processed
			slideshow.addClassName("slideshowProcessed");
		}//each
	);//findAll
}

document.observe("dom:loaded", function(){
	processSlideshow();
}); //start the func on page load