/** carousel.js ********************************************************
 * JavaScript functions for controlling a JavaScript carousel which
 * stops at either end.
 *
 * Makes use of the MooTools Fx tweens to slide the carousel along.
 *
 * Created:		CM - 20100305
 * Edited:		CM - 20100308
 * Version:		1.1
 *
 * DESCRIPTION ***************************************** CM - 20100305 *
 * Small JS library that creates a scrolling window that moves along a
 * range of items held within it with fixed widths.  Usage is as
 * follows:
 *
 *	1	A div is set up to hold the carousel and all element are added
 *		to that, contols are set outside this div.
 *	2	The carousel should be initialised with the initCarousel()
 *		method, passing in the id, number of items, width of each item,
 *		the number of items to scroll at a time, the id of the left
 *		control and the id of the right control.	
 *	3	Interaction is added to the carousel by adding onclick/onhover	
 *		calls to the controllers, scrollCarouselLeft() or
 *		scrollCarouselRight().
 *	
 *	Makes use of MooTools Fx tweens: http://mootools.net/
 *
 * CH-CH-CHANGES *******************************************************
 * 20100308		Updated the carousel to allow the scrolling window size
 * V1.1 CM		to be different from the viewing window size.
 *
 * 20100305		Created the JS widget and set up all the required  
 * V1.0 CM		functions to deal with scrolling and updating the
 * 				controls.
 ****************************************************** CM - 20100305 */


var _carousel			= null;
var _leftControl		= null;
var _rightControl		= null;
var _carouselWidth		= 0;
var _itemWidth			= 0;
var _itemsToScroll		= 0;
var _itemsToShow		= 0;
var _leftValue			= 0;
var _autoScrolling		= null;

function initCarousel( carouselID, totalItems, itemsToShow, itemWidth, itemsToScroll, leftControlID, rightControlID ) {
	_carouselWidth		= totalItems * itemWidth;
	_itemWidth			= itemWidth;
	_itemsToScroll		= ( itemsToScroll <= itemsToShow ) ? itemsToScroll : itemsToShow;
	_itemsToShow		= itemsToShow;
	_carousel			= document.getElementById( carouselID );
	_leftControl		= document.getElementById( leftControlID );
	_rightControl		= document.getElementById( rightControlID );
	_autoScrolling		= ( itemsToShow < totalItems ) ? "right" : "none";
	
	// Set the width of the carousel in case it's not set properly
	_carousel.style.width	= totalItems * _itemWidth + "px";
}


function scrollCarouselLeft( scrollBy ) {
	if( scrollBy == null ) {
		scrollBy	= _itemsToScroll;
	}
	newLeftValue	= _leftValue - ( scrollBy * _itemWidth );
	
	if( newLeftValue < 0 )
		newLeftValue	= 0;
	
	leftValueString	= "-" + newLeftValue + "px";
	
	scrollLeft		= newLeftValue >= 0;
	
	if( scrollLeft ) {
		var myFx	= new Fx.Tween( _carousel );
		myFx.start( 'left', leftValueString );
		_leftValue	= newLeftValue;
		updateCarouselArrows();
	}
}


function scrollCarouselRight( scrollBy ) {
	if( scrollBy == null ) {
		scrollBy	= _itemsToScroll;
	}
	newLeftValue	= _leftValue + ( scrollBy * _itemWidth );
	
	// Change the left value to the width of the carousel less the width
	// of the items shown
	if( newLeftValue > ( _carouselWidth - ( _itemsToShow * _itemWidth ) ) ) {
		newLeftValue	= _carouselWidth - ( _itemsToShow * _itemWidth );
	}
	
	
	leftValueString	= "-" + newLeftValue + "px";

	var myFx	= new Fx.Tween( _carousel );
	myFx.start( 'left', leftValueString );
	_leftValue	= newLeftValue;
	updateCarouselArrows();
}

function autoScrollCarousel( autoScrollBy ) {
	if( _autoScrolling == "left" ) {
		scrollCarouselLeft( autoScrollBy );
	} else if( _autoScrolling == "right" ) {
		scrollCarouselRight( autoScrollBy );
	}
}

function updateCarouselArrows() {
	if( _leftValue <= 0 ) {
		_leftControl.style.opacity		= "0.25";
		_autoScrolling					= "right";
	} else {
		_leftControl.style.opacity		= "1.00";
	}

	if( _leftValue >= ( _carouselWidth - ( _itemsToShow * _itemWidth ) ) ) {
		_rightControl.style.opacity		= "0.25";
		_autoScrolling					= "left";
	} else {
		_rightControl.style.opacity		= "1.00";
	}
}
