/*
 * - Parameters -
 *    autoScrollId - HTML element you want to use for the window of ScrollObject
 *    frames - Number of frames needed to scroll to end of content
 *    scrollAmount - The number of pixels to scroll the window each frame.
 *    delay - How often the auto scroll moves the window. (milliseconds)
 *    lastOffset - Used to shorten the last frame of scroll. -150px makes
 *      the scroll stop 150px earlier than normal.
 * - autoScrollId should be the ID of a div with a set height and width.
 * - autoScrollId should also have the CSS style overflow:hidden set.
 * - autoScrollId should not have padding. Use a wrapper div if you want padding
 */
function ScrollObject(autoScrollId, frames, scrollAmount, delay, lastOffset) {
	var _self = this;
	
	// Member variables
	_self.mainDivId = autoScrollId;
	_self.canvasId = autoScrollId+"-ScollCanvas";
	_self.frames = (frames) ? frames : 1;
	_self.scrollAmount = (scrollAmount) ? scrollAmount : 0;
	_self.delay = (delay) ? delay : 5000;
	_self.lastOffset = (lastOffset) ? lastOffset : 0;
	_self.current = 0;
	_self.paused = false;
	_self.positions = new Array();
	
	// Member functions
	_self.Initialize = ScrollObject_Initialize;	
	_self.NextFrame = ScrollObject_NextFrame;
	_self.PreviousFrame = ScrollObject_PreviousFrame;
	_self.StartAutoScroll = ScrollObject_StartAutoScroll;
	_self.StopAutoScroll = ScrollObject_StopAutoScroll;
	_self.SetNextButton = ScrollObject_SetNextButton;
	_self.SetPrevButton = ScrollObject_SetPrevButton;
	_self.SetPauseButton = ScrollObject_SetPauseButton;
	
	// Once content is loaded initalize it
	YAHOO.util.Event.onContentReady(_self.mainDivId, function() {
		_self.Initialize(); 
	});
}
/*
 * - Adds an inner div for canvas to move
 * - Sets up YUI animations to move the canvas
 * - Sets up a timer to fire YUI animate
 * - Sets up two events to pause scroll on mouseover
 */
function ScrollObject_Initialize() {
	var _self = this;
	
	// Get padding of window and adjusts absolute position for it.
	// Preferably padding should be 0.
	var pT = parseInt(YAHOO.util.Dom.getStyle(_self.mainDivId, "padding-top"));
	var pL = parseInt(YAHOO.util.Dom.getStyle(_self.mainDivId, "padding-left"));
	
	// Insert the canvas div into the window div
	var canvasBegin = "<div id=\""+_self.canvasId+
		"\" style=\"position:absolute;top:"+pT+";left:"+pL+";\">";
	var canvasEnd = "</div>";
	var canvasInner = document.getElementById(_self.mainDivId).innerHTML;
	document.getElementById(_self.mainDivId).innerHTML = canvasBegin+
		canvasInner+canvasEnd;
	
	// Sets needed CSS properties of the scroller window
	document.getElementById(_self.mainDivId).style.overflow = "hidden";
	document.getElementById(_self.mainDivId).style.position = "relative";
	
	// Create YUI animations
	var i = 0;
	for(;i < _self.frames - 1;++i) {
		attributes = { left: { to: _self.scrollAmount * i * -1 } };
		_self.positions[i] = new YAHOO.util.Anim(_self.canvasId, attributes);
	}
	// Last Frame
	attributes = {left: { to: _self.scrollAmount * i * -1 - _self.lastOffset }};
	_self.positions[i] = new YAHOO.util.Anim(_self.canvasId, attributes);
	
	// Starts the autoscroll
	/*_self.autoScrollHandle = setTimeout(function() {
		_self.AutoScrollTimer();
	}, _self.delay);*/
	
	// Handle mouseover events for the scroller window
	var wasPaused;
	YAHOO.util.Event.on(_self.mainDivId, "mouseover", function() {
		wasPaused = _self.paused;
		_self.StopAutoScroll();
	});
	YAHOO.util.Event.on(_self.mainDivId, "mouseout", function() {
		if(!wasPaused) {
			_self.StartAutoScroll();
		}
	});
}
/*
 * - Increments object's current variable
 * - Animates the canvas to go to current frame
 */
function ScrollObject_NextFrame() {
	var _self = this;
	
	if(_self.current >= _self.frames - 1) {
		_self.current = 0;
	} else {
		++_self.current;
	}
	_self.positions[_self.current].animate();
}
/*
 * - Decrements object's current variable
 * - Animates the canvas to go to current frame
 */
function ScrollObject_PreviousFrame() {
	var _self = this;
	
	if(_self.current <= 0) {
		_self.current = _self.frames - 1;
	} else {
		--_self.current;
	}
	_self.positions[_self.current].animate();
}
/*
 * - This moves the canvas to next frame then calls itself
 *     after a set number of milliseconds if not paused.
 *     delay is the number of milliseconds.
 */
function ScrollObject_AutoScrollTimer() {
	var _self = this;
	
	_self.NextFrame();
	if(!_self.paused) {
		_self.autoScrollHandle = setTimeout(function() {
			_self.AutoScrollTimer();
		}, _self.delay);
	}
}
/*
 * - Unpauses the scroller and starts up the autoscroll timer.
 * - Changes the pause button's image to inactive if pause button is set.
 */
function ScrollObject_StartAutoScroll() {
	var _self = this;
	
	_self.paused = false;
	_self.autoScrollHandle = setTimeout(function() {
		_self.AutoScrollTimer();
	}, _self.delay);
	if(_self.pauseImage) {
		document.getElementById(_self.pauseId).src = _self.pauseImage;
	}
}
/*
 * - Pauses the scroller and stops up the autoscroll timer.
 * - Changes the pause button's image to active if pause button is set.
 */
function ScrollObject_StopAutoScroll() {
	var _self = this;
	
	_self.paused = true;
	clearTimeout(_self.autoScrollHandle);
	if(_self.pauseActiveImage) {
		document.getElementById(_self.pauseId).src = _self.pauseActiveImage;
	}
}
/*
 * - Parameters -
 *    btnId - The id of the HTML element you want to use for your next button.
 *    image - The location of the image you want to use for inactive next button.
 *    imageActive - The location of the image you want to use active next button.
 * - If you don't include imageActive then image will be used
 *     for both button states.
 * - This fucntion ties in the next button control to an html element and 
 *     sets images for it.
 * - Sets mouseover, mouseout and click events for next button.
 */
function ScrollObject_SetNextButton(btnId, image, imageActive) {
	var _self = this;
	
	if(btnId) {
		_self.nextId = btnId;
		if(image) {
			_self.nextImage = image;
			_self.nextActiveImage = (imageActive) ? imageActive : image;
			YAHOO.util.Event.on(_self.nextId, 'mouseover', function() {
				document.getElementById(_self.nextId).src = _self.nextActiveImage;
			});
			YAHOO.util.Event.on(_self.nextId, 'mouseout', function() {
				document.getElementById(_self.nextId).src = _self.nextImage;
			});
		}
		YAHOO.util.Event.on(_self.nextId, 'click', function() {
			_self.NextFrame();
			_self.StopAutoScroll();
		});
	}
}
/*
 * - Parameters -
 *    btnId - The id of the HTML element you want to use for
 *      your previous button.
 *    image - The location of the image you want to use for
 *      inactive previous button.
 *    imageActive - The location of the image you want to use
 *      active previous button.
 * - If you don't include imageActive then image will be
 *     used for both button states.
 * - This fucntion ties in the previous button control to an html element and 
 *     sets images for it.
 * - Sets mouseover, mouseout and click events for next button.
 */
function ScrollObject_SetPrevButton(btnId, image, imageActive) {
	var _self = this;
	
	if(btnId) {
		_self.prevId = btnId;
		if(image) {
			_self.prevImage = image;
			_self.prevActiveImage = (imageActive) ? imageActive : image;
			YAHOO.util.Event.on(_self.prevId, 'mouseover', function() {
				document.getElementById(_self.prevId).src = _self.prevActiveImage;
			});
			YAHOO.util.Event.on(_self.prevId, 'mouseout', function() {
				document.getElementById(_self.prevId).src = _self.prevImage;
			});
		}
		YAHOO.util.Event.on(_self.prevId, 'click', function() {
			_self.PreviousFrame();
			_self.StopAutoScroll();
		});
	}
}
/*
 * - Parameters -
 *    btnId - The id of the HTML element you want to use for
 *      your pause button.
 *    image - The location of the image you want to use for
 *      inactive pause button.
 *    imageActive - The location of the image you want to use
 *      active pause button.
 * - If you don't include imageActive then image will be used
 *     for both button states.
 * - This fucntion ties in the pause button control to an html element and 
 *     sets images for it.
 * - Sets mouseover, mouseout and click events for next button.
 */
function ScrollObject_SetPauseButton(btnId, image, imageActive) {
	var _self = this;
	
	if(btnId) {
		_self.pauseId = btnId;
		if(image) {
			_self.pauseImage = image;
			_self.pauseActiveImage = (imageActive) ? imageActive : image;
			YAHOO.util.Event.on(_self.pauseId, 'mouseover', function() {
				if(!_self.paused) {
					document.getElementById(_self.pauseId).src = _self.pauseActiveImage;
				}
			});
			YAHOO.util.Event.on(_self.pauseId, 'mouseout', function() {
				if(!_self.paused) {
					document.getElementById(_self.pauseId).src = _self.pauseImage;
				}
			});
		}
		YAHOO.util.Event.on(_self.pauseId, "click", function() {
			if(_self.paused) {
				_self.StartAutoScroll();
			} else {
				_self.StopAutoScroll();
			}
		});
	}
}

