/**
 * SP Scroll
 * jQuery Plugin
 * 
 * This plugin allows you (the developer) to simply and easily scroll an element within
 * another element.  It does nothing more than move the element back and forth and show/hide
 * the arrows - the structure and style of the elements involved is left completely up to you.
 * 
 * The HTML should resemble something like:
 * <div id="someContainer">
 *    <div id="scrollBox" style="width:300px; border:1px solid black">
 *       <div id="scrollPanel" style="width:1000px; background:yellow;">
 *          This is the content that will be scrolled...
 *       </div>
 *    </div>
 *    <div id="scrollArrowLeft"></div>
 *    <div id="scrollArrowRight"></div>
 * </div>
 * 
 * [NOTE]: The Elements do not have to be <div>s - any valid tag will work.
 * 
 * -----
 * Usage
 * -----
 * $('#scrollPanel').spScroll(settings);
 * Setup the initial scrolling
 * 
 * $('#scrollPanel').spScroll('check');
 * $('#scrollPanel').spScroll('checkArrows');
 * Re-check dimensions and/or arrows to ensure they're displaying correctly
 * 
 * $('#scrollPanel').spScroll('scrollBy', -10);
 * Scroll panel by given amount
 * 
 * $('#scrollPanel').spScroll('scrollTo', '10px');
 * Scroll panel to given position
 * Besides pixel positions, you can also use "front" and "back"
 * 
 * --------
 * Settings
 * --------
 * arrowLeft		DOM element that when clicked will scroll the panel from the left
 * 					Required
 * 
 * arrowRight		DOM element that when clicked will scroll the panel from the right
 * 					Required
 * 
 * scrollAmount		# Pixels to scroll every time an arrow is clicked
 * 					Required
 * 
 * within			DOM element to scroll within the width of
 * 					Default: parent element
 * 
 * scrollSpeed		How long the scroll animation should take (in milliseconds)
 * 					Default: 300 milliseconds
 */
jQuery.fn.spScroll = function(settings, param) {
	if (typeof settings == 'string') {
		jQuery.spScrollCommand(jQuery(this), settings, param);
	}
	else {
		// Define default settings
		settings = jQuery.extend({
			scrollSpeed: 300
		}, settings);
		
		if (!settings.within) {
			settings.within = this.parent();
		}
		
		// Setup each tabset
		return this.each(function(){
			// Set this element as position relative
			var EL = jQuery(this).css({
				position: 'relative',
				left: 0
			});
			
			// If the parent isn't also relative, set it
			if (settings.within.css('position')=='static') settings.within.css('position', 'relative');
			
			settings.within = jQuery(settings.within);
			settings.arrowLeft = jQuery(settings.arrowLeft);
			settings.arrowRight = jQuery(settings.arrowRight);
			
			// Save data
			EL.data('spScrollSettings', settings);
			
			// Set widths and arrow display values
			EL.spScroll('check');
			
			// Listen for left arrow click
			settings.arrowLeft.click(function(){
				EL.spScroll('scrollBy', settings.scrollAmount);
				return false;
			});
			
			// Listen for right arrow click
			settings.arrowRight.click(function() {
				EL.spScroll('scrollBy', (settings.scrollAmount * -1));
				return false;
			});
		});
	}
};

jQuery.spScrollCommand = function(EL, cmd, param) {
	var data = EL.data('spScrollSettings');
	
	// Command was passed in to already-created tabs, execute it!
	switch (cmd) {
		case 'check':
			data.panelWidth = EL.width();
			if (!data.panelWidth && EL.css('width').indexOf('%') < 0) data.panelWidth = parseInt(EL.css('width'));
			
			data.withinWidth= data.within.width();
			if (!data.withinWidth && data.within.css('width').indexOf('%') < 0) data.withinWidth = parseInt(data.within.css('width'));
			
			data.posMin = 0;
			data.posMax = (data.panelWidth - data.withinWidth)*-1;
			
			jQuery.spScrollCommand(EL, 'checkArrows');
			break;
		
		case 'checkArrows':
			var left = param===undefined ? (parseInt(EL.css('left')) || 0) : param;
			
			data.arrowLeft.css('display', (left < data.posMin ? '' : 'none'));
			data.arrowRight.css('display', (left > data.posMax ? '' : 'none'));
			break;
		
		case 'scrollBy':
			if (!data.panelWidth || !data.withinWidth) EL.spScroll('check');
		
			var left = parseInt(EL.css('left')) || 0;
			left = (left + parseInt(param)) || 0;
			jQuery.spScrollCommand(EL, 'scrollTo', left);
			break;
		
		case 'scrollTo':
			if (!data.panelWidth || !data.withinWidth) EL.spScroll('check');
			
			var left = param;
			if (left == 'front') left = data.posMin;
			else if (left == 'back') left = data.posMax;
			else left = parseInt(left) || 0;
			
			if (left > data.posMin) left = data.posMin;
			else if (left <= data.posMax) left = data.posMax;
			
			jQuery.spScrollCommand(EL, 'checkArrows', left);
			EL.stop().animate({'left':left}, data.scrollSpeed);
	}
}