/* Animated Slideshow 
** 4/20/2011 BMM      
*/

/*  Create the slideshow
**  Parameters
**  frameId : id of the element whose child elements will scroll 
**  opts : map of optional settings (see Options)
**
**  Options
**  slide_duration : time between slide transitions, in milliseconds.  default is 8000.
**  transition_duration : time for slide transition animation, in milliseconds. default is 800.
**  no_slide_select : set to true to hide slide selection buttons.  default is false.
**  no_pause : set to true to hide pause/play buttons.  default is false.
**  pause_button_value : value of pause input button.  default is ll.
**  play_button_value : value of forward input button. default is &raquo;
**  no_loop : set to true to stop slideshow when end is reached.  default is false.
*/
function slideshow(frameId, opts) {
	if (!opts)
		opts = {};
	
	var self = this;
	this.frameId = frameId;
	this.frameSelect = '#'+frameId;
	this.frame = $(this.frameSelect);
	this.currSlide = 0;
	this.timer = false;
	this.slideDuration = opts.slide_duration? opts.slide_duration : 8000; // in milliseconds
	this.fadeDuration = opts.transition_duration? opts.transition_duration : 800; // in milliseconds
	this.slideTotal = this.frame.children().length;
	this.opts = opts;

	// set the id for each slide
	this.frame.children().attr('id', function(i) {
		return frameId+"_slide_"+(i+1);
	});
	
	// set required styles for elements
	this.frame.css({'position' : 'relative'});
	this.frame.children().css({'position': 'absolute', 'display': 'none'});
	
	// add control buttons
	if (this.slideTotal > 1) {
		$('<div class="buttons" style="position:absolute; bottom:0px; left:0px;"></div>').appendTo(this.frameSelect);
		//$(this.frameSelect+' div.buttons').css();
		if (!opts.no_pause) {
			$('<input type="button" value="'+(opts.pause_button_value? opts.pause_button_value : 'll')+'" class="pause_button selected" name="pause_button" />').appendTo(this.frameSelect+' div.buttons').click(function () {self.pause();});
			$('<input type="button" value="'+(opts.play_button_value? opts.play_button_value : '&gt;')+'" class="play_button selected" name="play_button" style="display:none" />').appendTo(this.frameSelect+' div.buttons').click(function () {self.play();});
		}
	
		if (!opts.no_slide_select) {
			for (var i = 1; i <= this.slideTotal; i++) {
				$('<input type="button" value="'+(i)+'" class="slide_select_button" name="slide_select_button" />').appendTo(this.frameSelect+' div.buttons').click(function () {self.nextSlide($(this).attr("value"));});
			}
		}
	}
	return this;
}

// Start the slideshow
slideshow.prototype.start = function () {
	this.nextSlide(1);
	this.paused = false;
}

// Pause the slideshow
slideshow.prototype.pause = function () {
	if (this.timer) window.clearTimeout(this.timer);
	this.timer = false;
	this.timeRemaining -= new Date() - this.startTime;
	if (!this.opts.no_pause) {
		$(this.frameSelect+' div.buttons input.pause_button').css("display", "none");
		$(this.frameSelect+' div.buttons input.play_button').css("display", "inline");
	}
	this.paused = true;
}

// Resume the slideshow
slideshow.prototype.play = function () {
	var self = this;
	if (!this.opts.no_pause) {
		$(this.frameSelect+' div.buttons input.play_button').css("display", "none");
		$(this.frameSelect+' div.buttons input.pause_button').css("display", "inline");
	}
	this.paused = false;
	this.nextSlide();
}

// Go to the next slide
slideshow.prototype.nextSlide = function (nextSlide) {

	var self = this;
	if (this.timer) window.clearTimeout(this.timer);
	this.timer = false;

	if (!nextSlide) nextSlide = (parseInt(this.currSlide) + 1);
	// if at the end of slideshow, loop back to beginning
	if (nextSlide > this.slideTotal || nextSlide < 1) nextSlide = 1;
	
	// hide the current slide
	if (this.currSlide) {
		$(this.frameSelect+'_slide_'+this.currSlide).css("display", "none");
	}
	
	// fade in the next slide
	$(this.frameSelect+'_slide_'+nextSlide).fadeIn(this.fadeDuration);
	$(this.frameSelect+' .buttons .slide_select_button').attr('class', 'slide_select_button');
	$(this.frameSelect+' .buttons input[value="'+nextSlide+'"]').attr('class', 'slide_select_button selected');
	this.currSlide = nextSlide;
	
	if (this.currSlide == this.slideTotal && this.opts.no_loop) {
		// if we are not looping and have reached the end, then pause the slideshow
		if (!this.opts.no_pause) {
			$(this.frameSelect+' div.buttons input.pause_button').css("display", "none");
			$(this.frameSelect+' div.buttons input.play_button').css("display", "inline");
		}
		this.timeRemaining = 0;
	} else if (!this.paused && this.slideTotal > 1) {
		// otherwise set the timeout for transition to the next slide
		this.timer = window.setTimeout(function() {self.nextSlide();}, this.slideDuration);
		this.startTime = new Date();
		this.timeRemaining = this.slideDuration;
	}	
}
