//////////////////////////////////////////
//										//
//	JAC Slider v1.1						//
//	Written By Shawn Wagner, B.Sc.(CS)	//
//	John Atkins & Co. 2011				//
//										//
//	Requirements:						//
//	- jQuery v1.3+						//
//	- jac_Slider.css					//
//	- HTML Container: div#slider		//
//	- HTML Panel(s): *.panel			//
//	- HTML Panel Selector: ul.pages		//
//										//
//	Options:							//
//	- HTML Next Button: *.next			//
//	- HTML Previous Button: *.prev		//
//										//
//////////////////////////////////////////

/*
 *	Slider Function
 *	Usage:	sliderId (String): The id of the html element containing the slider
 *			direction (Enumeration Value): sliderDirection (see above), horizontal is default
 *			speed (int): milliseconds to complete the transition, 200 is default
 *			wraps (boolean): whether the panels wrap around in a loop, true is default
 *			timer (int): milliseconds before the panel automatically transitions, 0 (false) for never
 *
 *	ToDo:	extend to allow multiple transition types ??? possible? ???
 */
 
function jacSlider( sliderId, vertical, speed, wraps, timer ) {
	/*
	 *	Set Variables
	 */
	 
	//Set to default if invalid
	speed = ( speed < 200 ) ? 400 : speed;
	timer = ( timer < 0 ) ? 0 : timer;
	if( timer > 0 ) wraps = true;
	if( $( "#" + sliderId + " > div.panels > ul > li" ).size() < 3 ) {
		wraps = false;
		timer = 0;
	}
	
	//Get Panel Dimensions
	var panelWidth = $( "#" + sliderId + " > div.panels > ul > li" ).width();
	var panelHeight = $( "#" + sliderId + " > div.panels > ul > li" ).height();
	
	//Get Slider dimensions
	var sliderWidth = $( "#" + sliderId + " > div.panels > ul" ).width();
	var sliderHeight = $( "#" + sliderId + " > div.panels > ul" ).height();
	
	//Ensure the first page is selected
	$( "#" + sliderId + " > div.controls > ul > li:first" ).toggleClass( "selected", true );
	
	//Set the proper ul dimensions
	if( vertical ) $( "#" + sliderId + " > div.panels > ul" ).css( {"height" : $( "#" + sliderId + " > div.panels > ul > li" ).height() * $( "#" + sliderId + " > div.panels > ul > li" ).size()} );
	else $( "#" + sliderId + " > div.panels > ul" ).css( {"width" : $( "#" + sliderId + " > div.panels > ul > li" ).width() * $( "#" + sliderId + " > div.panels > ul > li" ).size()} );
	
	//Special Case: Wrapping
	if( wraps ) {
		//Make the last element first so previous panel exists
		$( "#" + sliderId + " > div.panels > ul > li:first" ).before( $( "#" + sliderId + " > div.panels > ul > li:last" ) );
		
		//Realign the panels depending on the direction of movement
		if( vertical ) $( "#" + sliderId + " > div.panels > ul" ).css( {"top" : -panelHeight} );
		else $( "#" + sliderId + " > div.panels > ul" ).css( {"left" : -panelWidth} );
	}
	
	//Special Case: Vertical Movement
	if( vertical ) {
		//Make the panel clear each other so they stack
		$( "#" + sliderId + " > div.panels > ul > li" ).css( {"clear": "left"} );
	}
	
	//Start timer if time not zero
	if ( timer > 0 ) timeout = setTimeout( '$( "#' + sliderId + ' > div.controls .next" ).click()', timer );
	
	/*
	 *	Bind Previous OnClick
	 */
	 
	$( "#" + sliderId + " > div.controls .prev" ).click( function(){
		//Clear the timeout if there is one
		if( typeof timeout !== 'undefined' ) clearTimeout( timeout );
		
		//Find the page index we're on
		var page = $( "#" + sliderId + " > div.controls > ul.pages > li.selected" ).index();
		
		if( vertical ) {
			//Do nothing if not wrapping and on the first panel
			if( !wraps && parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "top" ) ) == 0 ) return false;

			//Calculate distance
			var distance = parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "top" ) ) + panelHeight - ( parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "top" ) ) % panelHeight );
			
			//Break if part-way through a transition
			if ( parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "top" ) ) % panelHeight != 0 ) return false;
			
			//move the panels
			$( "#" + sliderId + " > div.panels > ul" ).animate( {"top": distance}, speed, function() {
				//Callback
				if( wraps ) {
					//Pull a new previous panel               
					$( "#" + sliderId + " > div.panels > ul > li:first" ).before( $( "#" + sliderId + " > div.panels > ul > li:last" ) );
					
					//Realign the panels
					$( "#" + sliderId + " > div.panels > ul" ).css( {"top": -panelHeight} );
				}
			});
		}
		else {
			//Do nothing if not wrapping and on the first panel
			if( !wraps && parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "left" ) ) == 0 ) return false;
			
			//Calculate distance
			var distance = parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "left" ) ) + panelWidth - ( parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "left" ) ) % panelWidth );
			
			//Break if part-way through a transition
			if ( parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "left" ) ) % panelWidth != 0 ) return false;
			
			//move the panels
			$( "#" + sliderId + " > div.panels > ul" ).animate( {"left": distance}, speed, function(){
				//Callback
				if( wraps ) {
					//Pull a new previous panel               
					$( "#" + sliderId + " > div.panels > ul > li:first" ).before( $( "#" + sliderId + " > div.panels > ul > li:last" ) );
					
					//Realign the panels
					$( "#" + sliderId + " > div.panels > ul" ).css( {"left": -panelWidth} );
				}
			});
		}
		//Change the page selected
		if( page == $( "#" + sliderId + " > div.controls > ul.pages > li:first" ).index() ) {//We are on the last page
			$( "#" + sliderId + " > div.controls > ul.pages > li:last" ).toggleClass( "selected" );
			$( "#" + sliderId + " > div.controls > ul.pages > li:first" ).toggleClass( "selected" );
		}
		else {//We are not on the last page
			$( "#" + sliderId + " > div.controls > ul.pages > li:eq(" + ( page - 1 ) + ")" ).toggleClass( "selected" );
			$( "#" + sliderId + " > div.controls > ul.pages > li:eq(" + page + ")" ).toggleClass( "selected" );
		}
		
		//Reset timer if time not zero
		if ( timer > 0 ) timeout = setTimeout( '$( "#' + sliderId + ' > div.controls .next" ).click()', timer );
		
		//Prevent refresh
		return false;
	});
	
	/*
	 *	Bind Next OnClick
	 */
	 
	$( "#" + sliderId + " > div.controls .next" ).click( function(){
		//Clear the timeout if there is one
		if( typeof timeout !== 'undefined' ) clearTimeout( timeout );
		
		//Find the page index we're on
		var page = $( "#" + sliderId + " > div.controls > ul.pages > li.selected" ).index();
		
		if( vertical ) {
			//Do nothing if not wrapping and on the last panel
			if( !wraps && parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "top" ) ) == -panelHeight * parseInt( $( "#" + sliderId + " > div.panels > ul > li:last" ).index() ) ) return false;
			
			//Calculate distance to move
			var distance = parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "top" ) ) - panelHeight - ( parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "top" ) ) % panelHeight );
			
			//Break if part-way through a transition
			if ( parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "top" ) ) % panelHeight != 0 ) return false;
			
			//move the panels
			$( "#" + sliderId + " > div.panels > ul" ).animate( {"top": distance}, speed, function(){
				//Callback
				if( wraps ){
					//move the first item and put it as last item
					$( "#" + sliderId + " > div.panels > ul > li:last" ).after( $( "#" + sliderId + " > div.panels > ul > li:first" ) );                  

					//set the default item to correct position
					$( "#" + sliderId + " > div.panels > ul" ).css( {'top' : -panelHeight} );
				}
			});
		}
		else {
			//Do nothing if not wrapping and on the last panel
			if( !wraps && parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "left" ) ) == -panelWidth * parseInt( $( "#" + sliderId + " > div.panels > ul > li:last" ).index() ) ) return false;
			
			//Calculate distance to move
			var distance = parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "left" ) ) - panelWidth - ( parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "left" ) ) % panelWidth );
			
			//Break if part-way through a transition
			if ( parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "left" ) ) % panelWidth != 0 ) return false;
			
			//move the panels
			$( "#" + sliderId + " > div.panels > ul" ).animate( {"left": distance}, speed, function(){
				//Callback
				if( wraps ){
					//move the first item and put it as last item
					$( "#" + sliderId + " > div.panels > ul > li:last" ).after( $( "#" + sliderId + " > div.panels > ul > li:first" ) );                  

					//set the default item to correct position
					$( "#" + sliderId + " > div.panels > ul" ).css( {'left' : -panelWidth} );
				}
			});
		}
		//Change the page selected
		if( page == $( "#" + sliderId + " > div.controls > ul.pages > li:last" ).index() ) {//We are on the last page
			$( "#" + sliderId + " > div.controls > ul.pages > li:first" ).toggleClass( "selected" );
			$( "#" + sliderId + " > div.controls > ul.pages > li:last" ).toggleClass( "selected" );
		}
		else {//We are not on the last page
			$( "#" + sliderId + " > div.controls > ul.pages > li:eq(" + ( page + 1 ) + ")" ).toggleClass( "selected" );
			$( "#" + sliderId + " > div.controls > ul.pages > li:eq(" + page + ")" ).toggleClass( "selected" );
		}
		
		//Reset timer if time not zero
		if ( timer > 0 ) timeout = setTimeout( '$( "#' + sliderId + ' > div.controls .next" ).click()', timer );
		
		//Prevent refresh
		return false;
	});
	
	/*
	 *	Bind Page OnClicks
	 */
	 
	$( "#" + sliderId + " > div.controls > ul.pages > li" ).click( function(){
		//Clear the timeout if there is one
		if( typeof timeout !== 'undefined' ) clearTimeout( timeout );
		
		//Find out what page index was clicked
		var goto = $( this ).index();
		
		//Find out what page index we're on
		var page = $( "#" + sliderId + " > div.controls > ul.pages > li.selected" ).index();
		
		//Find the difference for the number and direction of panel switches
		var diff = goto - page;
		
		//If they are the same, exit
		if( !diff ) return false;
		
		//If wrapping we need to move enough panels over
		if( wraps ) {
			var count = ( page > 0 ) ? page - 1 : $( "#" + sliderId + " > div.controls > ul.pages > li:last" ).index();
			for( i = 0; i < count; i++ ) {
				//Pull a new previous panel
				$( "#" + sliderId + " > div.panels > ul > li:first" ).before( $( "#" + sliderId + " > div.panels > ul > li:last" ) );
			}
			//Realign the panels
			if( vertical ) $( "#" + sliderId + " > div.panels > ul" ).css( {"top": -panelHeight * page} );
			else $( "#" + sliderId + " > div.panels > ul" ).css( {"left": -panelWidth * page} );
		}
		
		if( vertical ) {
			//Calculate distance to move
			var distance = parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "top" ) ) - panelHeight * diff;
		
			//move the panels
			$( "#" + sliderId + " > div.panels > ul" ).animate({"top": distance}, speed, function(){
				//Callback
				if( wraps ){
					if( goto == 0 ) {
						//Pull a new previous panel               
						$( "#" + sliderId + " > div.panels > ul > li:first" ).before( $( "#" + sliderId + " > div.panels > ul > li:last" ) );
						
						//Realign the panels
						$( "#" + sliderId + " > div.panels > ul" ).css( {"top": -panelHeight} );
					}
					else {
						for( i = 0; i < ( goto - 1 ); i++ ) {
							//move the first item and put it as last item
							$( "#" + sliderId + " > div.panels > ul > li:last" ).after( $( "#" + sliderId + " > div.panels > ul > li:first" ) );
						}
						//set the default item to correct position
						$( "#" + sliderId + " > div.panels > ul" ).css( {'top' : -panelHeight} );
					}
				}
			});
		}
		else {
			//Calculate distance to move
			var distance = parseInt( $( "#" + sliderId + " > div.panels > ul" ).css( "left" ) ) - panelWidth * diff;
		
			//move the panels
			$( "#" + sliderId + " > div.panels > ul" ).animate( {"left": distance}, speed, function() {
				//Callback
				if( wraps ){
					if( goto == 0 ) {
						//Pull a new previous panel               
						$( "#" + sliderId + " > div.panels > ul > li:first" ).before( $( "#" + sliderId + " > div.panels > ul > li:last" ) );
						
						//Realign the panels
						$( "#" + sliderId + " > div.panels > ul" ).css( {"left": -panelWidth} );
					}
					else {
						for( i = 0; i < ( goto - 1 ); i++ ) {
							//move the first item and put it as last item
							$( "#" + sliderId + " > div.panels > ul > li:last" ).after( $( "#" + sliderId + " > div.panels > ul > li:first" ) );
						}
						//set the default item to correct position
						$( "#" + sliderId + " > div.panels > ul" ).css( {'left' : -panelWidth} );
					}
				}
			});
		}
		
		//Change the page selected
		$( "#" + sliderId + " > div.controls > ul.pages > li:eq(" + goto + ")" ).toggleClass( "selected" );
		$( "#" + sliderId + " > div.controls > ul.pages > li:eq(" + page + ")" ).toggleClass( "selected" );
		
		//Reset timer if time not zero
		if ( timer > 0 ) timeout = setTimeout( '$( "#' + sliderId + ' > div.controls .next" ).click()', timer );
		
		//Prevent Refresh
		return false;
	});
}

/*
 *	Call Sliders Here
 *	Parameters: <string> slider_id, <boolean> movesVertically, <int> timeToCompleteTransition, <boolean> panelsWrap, <int> timeBeforeAutoTransition
 *	Example: jacSlider( "slider_id", false, 400, false, 0 );
 */