/*
Class: ViewPortScrollBar
	Creates a scrollbar. Contains Slider class all events and options are handled through that
	
Note:
	The ScrollBar requires an XHTML doctype.

Arguments:
	element - the knob container
	knob - the handle
	numberOfSteps - the number of steps
	options - see Options below

Options:
	mode - either 'horizontal' or 'vertical'. defaults to horizontal.
	offset - relative offset for knob position. default to 0.
	
Events:
	onChange - a function to fire when the value changes.
	onComplete - a function to fire when you're done dragging.
	onTick - optionally, you can alter the onTick behavior, for example displaying an effect of the knob moving to the desired position.
		Passes as parameter the new position.
*/
var ViewPortScroller = new Class({
	
	options: {
		mode: "horizontal",
		increaseArrowName: "increase",
		decreaseArrorName: "decrease"
	},
	
	initialize: function(options){
		this.setOptions(options);
		
		$(this.options.increaseArrowName).addEvent(
			'click',
			function(){
				this.increasePosition();
			}.bind(this)
		);
		
		$(this.options.decreaseArrowName).addEvent(
			'click',
			function(){
				this.decreasePosition();
			}.bind(this)
		);
		
	},
	
	moveScroller: function(step){
		var eventName = 'onScroll' + this.options.mode.capitalize();
		this.fireEvent(eventName, step);
	},
	
	increasePosition: function(){
		this.moveScroller(1);
	},
	
	decreasePosition: function(){
		this.moveScroller(-1);
	}
});

ViewPortScroller.implement(new Events);
ViewPortScroller.implement(new Options);