// Setup a slideshow 
//  - specify fade speed (in milliseconds) below
//  - specify slide duration (in seconds) below
// ==================================================

fadeSpeed = 1000;	// set the speed of the fade transition effect (milliseconds)
duration = 6;		// set the duration of each slide (seconds)

// Set it up when the page loads
function setupSlideshow() {
	// check for features
	if(slideshowContainer = $('slideshow')) {
		if(slideshowSet = document.getElementsByClassName("slide", slideshowContainer)) {
			numSlides = slideshowSet.length;	// count features
			
			// only do the slideshow if there is more than one feature
			if(numSlides > 1) {
				transitions = new Array(numSlides);	// keep each fade effect in an array
				current = 0;				// keep track of the feature being displayed
				transitioning = false;			// keep track of whether the slide is changing

				// create a fade effect for each feature
				for(i=0; i<numSlides; i++) {
					slide = $('slide-'+(i+1));
					slide.style.display = 'block';	// all but the first feature need to be unhidden
					transitions[i] = new Fx.Opacity(slide, { duration: fadeSpeed, onStart: function() { transitioning = true; }, onComplete: function() { transitioning = false; } }); // create the fade
					
					// hide all but the first feature
					if(i != 0) {
						transitions[i].hide();
					}
				}				

				// create the timer to automatically advance the slideshow
				timer = new PeriodicalExecuter(nextSlide, duration);
				
				// show the slideshow controls (hidden at first)
				$('slideshow-controls').style.display = 'block';
				setCurrentIndicator();
				
				// set up the play/pause toggle link
				Event.observe($('slideshow-play'), 'click', togglePlaying, false);
				
				// set up the manual next link
				Event.observe($('slideshow-next'), 'click', manualNext, false);
			}
		}
	}
}

// Advance the slideshow
function nextSlide() {
	// fade out the displayed feature
	transitions[current].toggle();
	
	// pick the next feature (go back to 0 if at the end, other wise increment)
	if(current == (numSlides-1)) {
		current = 0;
	}
	else {
		current++;
	}
	
	// turn on the new feature
	transitions[current].toggle();
	
	// update current indicator
	setCurrentIndicator();
}

// Update the current slide indicator
// - If paused is set to true, add (Paused) at the end
function setCurrentIndicator(paused) {
	$('slideshow-current').innerHTML = (current+1)+' of '+numSlides+(paused ? (' (paused)') : '');
}

// Toggle playing of the slideshow
function togglePlaying(e) {
	toggleLink = $('slideshow-play');

	// playing -> paused
	if(timer.currentlyExecuting == false) {
		toggleLink.innerHTML = 'Play'	// Change link text to "Play"
		setCurrentIndicator(true);		// add (Paused) to current indicator
	}
	
	// paused -> playing
	else {
		toggleLink.innerHTML = 'Pause';	// Change link text to "Pause"
		setCurrentIndicator();				// remove (Paused) from current indicator
	}

	// toggle playing
	timer.currentlyExecuting = !timer.currentlyExecuting;

	if(e) Event.stop(e);
}

// Manually advance to the next feature by clicking the "Next >>" link
function manualNext(e) {
	if(e) Event.stop(e);
	
	// if the slideshow is playing, pause it
	if(timer.currentlyExecuting == false) {
		togglePlaying();
	}
	
	if(!transitioning) { // don't advance if we're already fading
		// advance to the next feature (and indicate paused status)
		nextSlide();
		setCurrentIndicator(true);
	}
}

Event.observe(window, 'load', function() {
	setupSlideshow();
}, false);