/*
 * This handles the slider on the home page of the SPA website. 
 * It simply moves a long div to the left x number of pixels every few seconds.
 * 
 * @author Ryan Smith [Ryan.Smith@speedtvsupport.com]
 * @since 11/08/2010
 */

jQuery('.SPA_Letterbox-Region').ready(function(){

	// Set the initial auto scroll
	featureTimer = setInterval(autoPageScroll, 10000);
	
	// Set the variables
	var currentPageNumber = 1;
	var totalFeatures = jQuery('.featureItem').length;

	var scrollAmount = 700;

	// This function scrolls container Div to the left x amount of pixels
	function autoPageScroll()
	{
		// Check if the slider is at the end
		if(currentPageNumber == totalFeatures)
		{
			// Slider has reached the end, start over at the beginning
			oldNumber = currentPageNumber;
			currentPageNumber = 1;

			jQuery('#feature_button' + oldNumber).animate({
				opacity: 0
			}, 1000, 'easeOutExpo');

			jQuery('#featureSlider').animate({
				  left: '+='+(scrollAmount * (totalFeatures - 1))
				}, 1000, 'easeOutExpo');
			

			jQuery('#feature_button' + currentPageNumber).animate({
				opacity: 100
			}, 1000);
			
		}else{
			// Still more slides to go, continue moving foward
			
			// Check if the user is using internet explorer, and use the filter style instead of opacity
				jQuery('#feature_button' + currentPageNumber).animate({
					opacity: 0
				}, 1000, 'easeOutExpo');
			
			jQuery('#featureSlider').animate({
				  left: '-=' + scrollAmount
				}, 1000, 'easeOutExpo');
	
			// Increment the page values here so we can show the new current pages button
			currentPageNumber++;
	
			// Show the new button after the feature has loaded
			jQuery('#feature_button' + currentPageNumber).animate({
				opacity: 100
			}, 1000);
		}
	}

	// Change the slider to the specified page
	function changeFeaturePage(selectedPage){
		oldPage = currentPageNumber;
		newPageNumber = selectedPage;

		// Check if the page is to the right or left
		if(newPageNumber > oldPage){
			jQuery('#feature_button' + oldPage).animate({
				opacity: 0
			}, 1000, 'easeOutExpo');


			// move container div to the left calculating the amount to move by using the new and old page numbers
			jQuery('#featureSlider').animate({
				  left: '-=' + (scrollAmount * (newPageNumber - oldPage))
				}, 1000, 'easeOutExpo');

			// Increment the page values here so we can show the new current pages button
			currentPageNumber = newPageNumber;

			// Show the new button after the feature has loaded
			jQuery('#feature_button' + currentPageNumber).animate({
				opacity: 100
			}, 1000);
			
		}else if(newPageNumber == oldPage){
			// Page number is the same, ignore request
		}else{
			jQuery('#feature_button' + oldPage).animate({
				opacity: 0
			}, 1000, 'easeOutExpo');
			
			// Move container div to the right calculating the amount to move by using the new and old page numbers
			jQuery('#featureSlider').animate({
				  left: '+=' + (scrollAmount * (oldPage - newPageNumber))
				}, 1000, 'easeOutExpo');

			// Increment the page values here so we can show the new current pages button
			currentPageNumber = newPageNumber;

			// Show the new button after the feature has loaded
			jQuery('#feature_button' + currentPageNumber).animate({
				opacity: 100
			}, 1000);

		}

		// Start the auto slider back up
		featureTimer = setInterval(autoPageScroll, 10000);
	}

	// Fired when someone clicks the navigation buttons on the feature slider
	jQuery('.featureButton').click(function(){
		// Stop the auto slider timer
		clearTimeout(featureTimer);
		
		// Get the clicked buttons page number
		elementId = jQuery(this).attr('id');
		pageNum = elementId.substring(elementId.length -1);

		// Change the page to the selected tab
		changeFeaturePage(pageNum);
	});
});
