// JavaScript Document
var $PromoPanel = jQuery.noConflict();

//Location of elements
var $PromoPanelId = '#promo-panel'
var $PromoPanelSlidesId = '#promo-panel-slides'
var $PromoPanelSlidesChildren = '#promo-panel-slides > div'
var $PromoPanelRightClickId = '#promo-panel-slides-right-click'
var $PromoPanelLeftClickId = '#promo-panel-slides-left-click'
var $PromoPanelControlsId = '#promo-panel-controls'

//Modifiable variables
var $PromoPanelAnimationSpeed = 1000;
var $PromoPanelFadeAnimationSpeed = 200;
var $PromoPanelInitialFadeAnimationSpeed = 1000;
var $PromoPanelStartingSlide = 0;
var $PromoPanelSlidingSpeedInSeconds = 7;

//Do Not Touch variables
var $PromoPanelDefaultLeft;
var $PromoPanelAnimating = false;
var $PromoPanelWidth;
var $PromoPanelSize;
var $PromoPanelSlidingTimer;

$PromoPanel(document).ready(PromoPanel_READY);
$PromoPanel(window).load(PromoPanel_ONLOAD);

//Main
function PromoPanel_READY(){
	PromoPanel_SET_GLOBALS();
	PromoPanel_MANIP_DOM();
	PromoPanel_BIND_EVENTS();

	//$PromoPanel('#promo-panel-slides > div > a').css({backgroundColor: 'red', opacity: .4});
}

//Onload
function PromoPanel_ONLOAD(){
	$PromoPanelSlidingTimer = setInterval( PromoPanel_Right_Click, $PromoPanelSlidingSpeedInSeconds * 1000 ); 	
}

/* Main Functions */
function PromoPanel_MANIP_DOM(){
	$PromoPanel( $PromoPanelSlidesChildren ).each( function(){
		$PromoPanel( this ).css( 'background-image', 'url("' + $PromoPanel( ' > img', this ).attr( 'src' ) + '")' );
		$PromoPanel( ' > img', this ).hide();
	})
	
	$PromoPanel( $PromoPanelSlidesChildren + " > a" ).hide();
	$PromoPanel( $PromoPanelSlidesChildren ).eq( $PromoPanelStartingSlide ).addClass( 'current' ).fadeIn( $PromoPanelAnimationSpeed, function(){
		$PromoPanel( $PromoPanelSlidesChildren + ".current > a" ).show();
	});
	
	//Do not show controls if only one slide
	if( $PromoPanelSize > 1 ){
		PromoPanel_Create_Control_Panel();
		$PromoPanel( $PromoPanelControlsId + ' > ul > li:first-child' ).eq( $PromoPanelStartingSlide ).addClass('current');
	}
}

function PromoPanel_SET_GLOBALS(){
	$PromoPanelSize = $PromoPanel( $PromoPanelSlidesChildren ).size();
}

function PromoPanel_BIND_EVENTS(){
	$PromoPanel( $PromoPanelControlsId + ' > ul > li.dot' ).click( PromoPanel_Control_Dot_Click );		
	$PromoPanel( '#promo-panel-controls-play-pause' ).click( PromoPanel_changeTimer );		
}

/* Supporting Functions */

function PromoPanel_changeTimer(){
	if(	$PromoPanel( this ).hasClass( 'play' ) )
		PromoPanel_startTimer();
	else
		PromoPanel_pauseTimer();	
}

function PromoPanel_startTimer(){
	PromoPanel_Right_Click();
	$PromoPanelSlidingTimer = setInterval( PromoPanel_Right_Click, $PromoPanelSlidingSpeedInSeconds * 1000 ); 	
	$PromoPanel( '#promo-panel-controls-play-pause'  ).removeClass( 'play' ).addClass( 'pause' );
}

function PromoPanel_pauseTimer(){
	clearInterval( $PromoPanelSlidingTimer ); 	
	$PromoPanel( '#promo-panel-controls-play-pause'  ).removeClass( 'pause' ).addClass( 'play' );
}

function PromoPanel_Create_Control_Panel(){
	$controlsHTML = '<div id="' + $PromoPanelControlsId.substring(1) + '"><ul>';
	
	for( $i=0; $i < $PromoPanelSize; $i++ )
		$controlsHTML = $controlsHTML + '<li class="dot">' + $i + '</li>';

	$controlsHTML = $controlsHTML + '<li id="promo-panel-controls-play-pause" class="pause">Play Pause Controls</li>';
	$controlsHTML = $controlsHTML + '</ul></div>';
	$PromoPanel( $PromoPanelId ).append( $controlsHTML );	
}

function PromoPanel_Right_Click_Stage(){
	PromoPanel_pauseTimer();
	PromoPanel_Right_Click();
}

function PromoPanel_Right_Click(){		
	$current_index = PromoPanel_get_current();
	$nextSlideIndex = PromoPanel_get_next($current_index);	
	PromoPanel_transition();
}

function PromoPanel_Control_Dot_Click(){
	PromoPanel_pauseTimer();
	$currentSlide = PromoPanel_get_current();
	$selectedSlide = $PromoPanel( this ).index();

	if( !$PromoPanelAnimating && $selectedSlide != $currentSlide ){
		$nextSlideIndex = $selectedSlide;
		PromoPanel_transition();		
	}
	/*	
	PromoPanel_pauseTimer();
	$currentSlide = PromoPanel_get_current();
	$selectedSlide = $PromoPanel( this ).index();
	
	alert( $selectedSlide );
	

	if( !$PromoPanelAnimating && $selectedSlide != $currentSlide ){
		if( $selectedSlide < $currentSlide ){
			$nextSlideIndex = PromoPanel_get_previous( $currentSlide );
			alert( 'if ' + $nextSlideIndex );
			PromoPanel_transition();
		}
		else{
			$nextSlideIndex = PromoPanel_get_next( $currentSlide );
			alert( 'else ' + $nextSlideIndex );
			PromoPanel_transition();
		}
	}
	*/
}

function PromoPanel_transition(){
	
	if( !$PromoPanelAnimating ){
		$PromoPanelAnimating = true;
		$PromoPanel( $PromoPanelSlidesChildren + ".current > a" ).hide();
		$PromoPanel( $PromoPanelSlidesChildren + ".current" ).removeClass( 'current' ).fadeOut( $PromoPanelAnimationSpeed );
		$PromoPanel( $PromoPanelSlidesChildren ).eq( $nextSlideIndex ).addClass( 'current' ).fadeIn( $PromoPanelAnimationSpeed, function(){
			$PromoPanel( $PromoPanelControlsId + ' > ul > li' ).removeClass('current');	
			$PromoPanel( $PromoPanelControlsId + " > ul > li" ).eq( $nextSlideIndex ).addClass( 'current' );	
			$PromoPanelAnimating = false;
		$PromoPanel( $PromoPanelSlidesChildren + ".current > a" ).show();
		});
	}
}

function PromoPanel_get_current(){
	return $PromoPanel( $PromoPanelSlidesChildren + '.current' ).index();
}

function PromoPanel_get_previous( $current_index ){
	return ( $current_index - 1 + $PromoPanelSize ) % $PromoPanelSize;
}

function PromoPanel_get_next( $current_index ){
	return ( $current_index + 1 + $PromoPanelSize ) % $PromoPanelSize;
}