/***
 * KAA Custom scrollbar class for mootools
 * This was built off the idea of the sliders in Mootools 1.11
 * but built as a class to handle some more robustness
 * http://demos111.mootools.net/Slider
 *
 * version 1.0 for MooTools 1.11
 ***/

var KAAScrollbar = new Class({

	Implements: [Events, Options],

	options: {
		minKnobSize:			16,
		maxKnobSize: 			16,
		wheel: 					8,
		scrollThreshold:		10, 	//If the difference in scroll area and scroll window is less than this value,
										//then no scrollbar will be generated
		'createControls': 		true	//if this is set to true, the default controls are added automatically.
										//if you set this to false (default), you have to define the controls in HTML
										//and give them as parameters to this control (see: this.initialize())
	},
	
	/**
	 * Constructor which builds the scrollbar
	 * @param ojbect	The DOM element we are attaching a scrollbar to
	 * @param array		An array of options to override the defaults
	 **/
	initialize: function(content, options){
		//Set our internal variables
		this.setOptions(options);
		this.content = $(content);

		//Build the necessary containers around the content
		this.createContainers();
		
		//Build the necessary control pieces
		this.createControls();
		
		this.steps = this.content.getSize().scrollSize.y - this.content.getSize().size.y;
		//Prevent errors caused by sliders with 0 steps
		if(this.steps < 1) this.steps = 1;
		
		
//Make a MooTools slider out of the elements
		this.slider = new Slider(this.track, this.knob, {
			steps:		this.steps,
//			steps:		5000,
			mode:		'vertical',
			content:	this.content,						//Pass the content to the slider so we have something to scroll
			onChange: 	function(step){
				(this.options.content.scrollTo(0,step));	//Scroll the content when the slider changes
			}
		});
		
		
		//Stop built-in mousewheel scrolling
		this.content.addEvent('mousewheel', function(e) {
			e = new Event(e).preventDefault();

			//TODO this should update the scrollbar but unfortuneately
			//happens before the mousewheel actually scrolls
			//newknoblocation = $('stupid').getSize().scroll.y;
			//slider.set(newknoblocation);
		});

		this.update();
	},

	/**
	 * Recalculates sizes of everything
	 */
	update: function() {
		//Get the number of steps for the scrollbar
		//This is the difference between the content length and the container length
		this.steps = this.content.getSize().scrollSize.y - this.content.getSize().size.y
		//Prevent errors caused by sliders with 0 steps
		if(this.steps < 1) this.steps = 1;
		this.slider.options.steps = this.steps;
		this.slider.set(this.content.getSize().scroll.y);
	
		//Hide the scrollbar if it isn't necessary
		if(this.steps < 10)
		{
			this.track.setStyle('display', 'none');	
			this.knob.setStyle('display', 'none');	
		} else {
			this.track.setStyle('display', 'block');	
			this.knob.setStyle('display', 'block');
		}
	},

	
	/**
	 * Creates the necessary structure of nested divs and styling for
	 * proper functionality
	 **/
	createContainers: function() {

		//Get the scrollable object's size
		var displaywidth = this.content.getSize().size.x;
		var displayheight = this.content.getSize().size.y;
		
		//Build a content container
		this.contentcontainer = new Element('div', {
			'class': 'contentcontainer'
		}).injectBefore(this.content);
		//Set the necessary settings for the container
		this.contentcontainer.setStyle('width',		displaywidth - 20);
		this.contentcontainer.setStyle('height',	displayheight);
		this.contentcontainer.setStyle('overflow',	'hidden');
		
		//Remove the content from the display tree
		this.content.remove();
		//Insert the content inside our new container
		this.content.injectInside(this.contentcontainer);
	},
	
	
	/**
	 * Creates the controls, including scroll up and down buttons and a 
	 * scrolltrack with something to grab and drag around
	 **/
	createControls: function(){
		//Create the container for our slider
		this.scrollercontainer = new Element('div', {
			'class': 'scrollercontainer'
		}).injectAfter(this.contentcontainer);

		//Create the track for our slider
		this.track = new Element('div', {
			'class': 'scrollertrack',
			'id': 'scrollertrack'
		}).injectInside(this.scrollercontainer);

		//Create the knob for our slider
		this.knob = new Element('div', {
			'class': 'scrollerknob',
			'id': 'scrollerknob'
		}).injectInside(this.track);
		
	}
});

KAAScrollbar.implement(new Options);