/**
 * Builds a custom scrollbar
 * @param theContent the content box that will get a scrollbar
 * @return
 */

function addKAAScrollbar(theContent,csslocation){	
	//Include scrollbar css
	var css = new Asset.css(csslocation, { });
	
	var content = theContent;
	//var container = $('toScroll');
	var theHeight = content.getSize().y;
	var manysteps = 0;
	if(content != null){
		manysteps = content.getScrollSize().y - theHeight;
	}


	if(manysteps > 0){
		
			var container = content.addClass('scroll_content');
			
			var scrollarea = new Element('div', {
				'class': 'scrollbar_area'
			}).injectAfter(container);
			
			scrollarea.setStyle('height', theHeight);
			
			//Create the up button
			var upbutton = new Element('div', {
				'class': 'scroll_up'
			}).injectInside(scrollarea);

			//Create the track for our slider
			var track = new Element('div', {
				'class': 'scrollbar_container'
			}).injectAfter(upbutton);
			
			//Make the scrollbar height match the textbox height
			track.setStyle('height', theHeight);
			
			//Create the knob for our slider
			var knob = new Element('div', {
				'class': 'scrollbar_knob'
			}).injectInside(track);

			//Create the down button
			var downbutton = new Element('div', {
				'class': 'scroll_down'
			}).injectAfter(track);
			
			//Create the up button img
//			var upbuttonImg = new Element('img', {
//				'class': 'arrow',
//				'src'	: baseURL+'/templates/kentate/images/arrowUP.png'
//			}).injectInside(upbutton);
			
//			//Create the down button img
//			var downbuttonImg = new Element('img', {
//				'class': 'arrow',
//				'src'	: baseURL+'/templates/kentate/images/arrowDOWN.png'
//			}).injectInside(downbutton);
	
	 
			
	myScroll = new MooScroller(container, knob, {
		scrollLinks: {
			forward: downbutton,
			back: upbutton
		}
	});

	}	
}