$(document).ready(function(){

	// SLIDESHOW SETTINGS --------------------------------------------------------------------------------

	var divToAnimate = "#home_slider";	// this is the div that shows the current slide only
	var divWithSlides = "#home_slider_slides";					// this is the div that holds all slides, side to side so that it can be scrolled horizontally
	var buttonIdNext = "#home_slider_button_next";				// this is the div that holds all slides, side to side so that it can be scrolled horizontally
	var buttonIdPrevious = "#home_slider_button_prev";		// this is the div that holds all slides, side to side so that it can be scrolled horizontally

	var scrollSpeed = 750;									// this is the number of msec it takes to transition to the next selected slide
	var scrollBackToBeginningSpeed = 300;			// this is the number of msec it takes to transition to the beginning of list when at the end

	var autoTransitionEnabled = true;			// Change slides automatically after a period of time?
	var autoTransitionFrequency = 4000;			// How often to change slides automatically  (msec)

	// END OF SLIDESHOW SETTINGS  ------------------------------------------------------------------------
	// ---------------------------------------------------------------------------------------------------


	var slideNumber = 0;										// this is the currently active (shown) slide number
	
	// Calculations
	var slideWidth = $(divToAnimate).width(); 		// width of each slide (defined in css)
	var totalSlidesWidth = slideWidth * $(divWithSlides + " > div").size();	// number of slide divs x slide width
	var slideCount = totalSlidesWidth / slideWidth;	// total width of the slide container / slide width
	
	$(divWithSlides).width(totalSlidesWidth);			// set the width of the div that holds all slides (this must be done for this to work!)
	
	// setup the auto transitioning if enabled
	if (autoTransitionEnabled) {
		enableAutoTransition();
	}
	
	function enableAutoTransition() {
		$(document).everyTime(autoTransitionFrequency, divToAnimate, function(i) {
  			showNextSlide(); }, 0);	// 0 here means there is no limit to how many times this can happen
	}
	
	function disableAutoTransition() {
		$(document).stopTime(divToAnimate);
	}
	
	$(buttonIdNext).click(function() {
		showNextSlide();
		disableAutoTransition();
		enableAutoTransition();
	});
	
	$(buttonIdPrevious).click(function() {
		showPreviousSlide();
		disableAutoTransition();
		enableAutoTransition();
	});
	
	function showNextSlide() {
		var scrollToPosition;
		var scrollSpeedSetting;
		// note the previous selected slide number
		var previousSlideNumber = slideNumber;
		// are we at the last slide? if so, go to first slide			
		if (slideNumber == (slideCount - 1)) { 		// we're at the last slide so scroll back to 0
			// scroll to left - 0
			scrollToPosition = 0;
			scrollSpeedSetting = scrollBackToBeginningSpeed;
			slideNumber = 0;
		} else {
			slideNumber++;
			scrollToPosition = (slideNumber * slideWidth);
			scrollSpeedSetting = scrollSpeed;
		}
										
		// now do the scroll	
		$(divToAnimate).animate({scrollLeft: scrollToPosition}, scrollSpeedSetting);	
	}
	
	function showPreviousSlide() {
		// are we at the first slide? if so, go to last slide
		if (slideNumber == 0) {
			// scroll to show the last slide
			slideNumber = (slideCount - 1);				// slide number starts at 0 so the last is (total - 1)
			scrollSpeedSetting = scrollBackToBeginningSpeed;
		} else {
			slideNumber--;
			scrollSpeedSetting = scrollSpeed;
		}
		
		// now do the scroll				
		$(divToAnimate).animate({scrollLeft: (slideNumber * slideWidth)}, scrollSpeedSetting);		
	}
});