/* CUSTOM SCROLLBAR */
/*
 * @title: Scrollbar
 * @description: creates a custom scrollbar over an HTML element
 * @params: str[string] - HTML element
*/
kc.scrollbar=function(elem,scroll_speed,scrollbar_height){
	
	
	/*Setting Base Scrolled Elem*/
	if(elem.attributes["class"]){
		var currentclass=elem.attributes["class"].value;
		if(elem.setAttribute){
			elem.setAttribute("class",currentclass+" kc-scroll");
		}else{
			elem.attributeName="class";
			elem.attributes["class"].value=currentclass+" kc-scroll";
		}
	}else{
		if(elem.setAttribute){
			elem.setAttribute("class","kc-scroll");
		}else{
			elem.attributeName="class";
			elem.attributes["class"].value="kc-scroll";
		}
	}
	
	/*Setting up scrolled Inner HTML*/
	function kc_setUpScrollbar(){
		var elemcontent=elem.innerHTML;
		elem.innerHTML='<div class="kc-scrolled"><div class="kc-scrolled-content">'+elemcontent+'</div></div><div class="kc-scrollbar"><div class="kc-scrollbar-handler"><div class="kc-scrollbar-handler-top"></div><div class="kc-scrollbar-handler-bottom"></div></div><div class="kc-scrollbar-direction-top"></div><div class="kc-scrollbar-direction-bottom"></div></div>';
		
		var kc_scrolled=elem.childNodes[0];
		var kc_content=elem.childNodes[0].childNodes[0];
		var kc_scrollbar=elem.childNodes[1];
		var kc_scrollbar_handler=elem.childNodes[1].childNodes[0];
		var kc_dir_handler_top=elem.childNodes[1].childNodes[1];
		var kc_dir_handler_bottom=elem.childNodes[1].childNodes[2];
		
		
		
		/*setting up scroll speed fallback*/
		if(typeof(scroll_speed)=="undefined"){
			scroll_speed=2;
		}
		
		var kc_elem_height=kc.getSize(elem,"height");
		var kc_content_scroll_height=kc.getScroll(kc_content,"height");
		if(typeof(scrollbar_height)!="undefined"){
			kc_scrollbar_handler.style["height"]=scrollbar_height+"px";
		}
		
		/*IE-proof basic styles*/
		elem.style["position"]="relative";
		elem.style["overflow"]="visible";
		kc_content.style["height"]=kc_elem_height+"px";
		kc_content.style["position"]="relative";
		kc_scrollbar.style["height"]=kc.getSize(kc_scrollbar,"height")-kc.getSize(kc_dir_handler_top,"height")-kc.getSize(kc_dir_handler_bottom,"height")+"px";
		kc_scrollbar.style["top"]=kc.getSize(kc_dir_handler_top,"height")+"px";
		kc_dir_handler_top.style["top"]=-kc.getSize(kc_dir_handler_top,"height")+"px";
		kc_dir_handler_bottom.style["bottom"]=-kc.getSize(kc_dir_handler_bottom,"height")+"px";
		
		
		var kc_scrolled_height=kc.getSize(kc_scrolled,"height");
		var kc_content_scroll_height=kc.getScroll(kc_content,"height");
		var kc_scrollbar_height=kc.getSize(kc_scrollbar,"height");
		
		if(kc_content_scroll_height<=kc_scrolled_height){
			kc_scrollbar.style["display"]="none";
		}else{
			var content_overflow_percent=(kc_content_scroll_height*100)/kc_scrolled_height;
			var content_overflow_diff=content_overflow_percent-100;
			var scrollbar_handler_size=100-content_overflow_diff;
			if(scrollbar_handler_size<20){
				scrollbar_handler_size=20;
			}
			kc_scrollbar_handler.style["height"]=scrollbar_handler_size+"%";
		}
		
		var kc_scrollbar_handler_height=kc.getSize(kc_scrollbar_handler,"height");
		
		
		/*Setting Up Maximum Scroll*/
		kc_content.scrollTop=kc.getScroll(kc_content,"height");
		var kc_content_max_scroll=kc_content.scrollTop;
		kc_content.scrollTop=0;
		
		/*Draggable Handler*/
		kc.drag(kc_scrollbar_handler,"y",true);
		
		
		var scroll_position=0;
		var scroll_position_percent=0;
		var scroll_goal=0;
		var content_scroll_position=0;
		var kc_dragstatus=false;
		
		kc.addEventListener(kc_scrollbar_handler,"mousedown",function(){
			kc_dragstatus=true;
		});
		kc.addEventListener(elem,"mousewheel",function(e){
			if (!e) e = window.event;
			if (e.wheelDelta) {
				scroll_position-=e.wheelDelta/20;
			} else if (e.detail) {
				scroll_position+= e.detail*2;
			}
			try{handle(delta)}catch(err){
				try{
					e.preventDefault();
				}catch(err){
					e.returnValue = false;
				}
			}
			if(scroll_position+kc_scrollbar_handler_height>=kc_scrollbar_height){
				kc_scrollbar_handler.style["top"]=kc_scrollbar_height-kc_scrollbar_handler_height+"px";
				scroll_position=kc_scrollbar_height-kc_scrollbar_handler_height;
				kc_get_scroll_percents();
			}else if(scroll_position<=0){
				kc_scrollbar_handler.style["top"]="0px";
				scroll_position=0;
				kc_get_scroll_percents();
			}else{
				kc_scrollbar_handler.style["top"]=scroll_position+"px";
				kc_get_scroll_percents();
			}
		});
		kc.addEventListener(document,"mousemove",function(){
			if(kc_dragstatus===true){
				try{clearInterval(scrollmove)}catch(err){}
				scroll_position=kc.getPosition(kc_scrollbar_handler,1,true);
				kc_get_scroll_percents();
			}
		});
		kc.addEventListener(kc_scrollbar,"mousedown",function(e){
			kc.addEventListener(kc_scrollbar_handler,"mousedown",function(e){
				try{e.stopPropagation();}catch(err){
					e.cancelBubble=true;
				}
			});
			
			/*Setting point to scroll to*/
			scroll_goal=kc.getCursorPosition(e,1)-kc.getPosition(kc_scrollbar,1)+kc.getSize(kc_dir_handler_top,1)-2;
			
			/*Animate scroll*/
			scrollmove=setInterval(function(){
				
				if(scroll_position<scroll_goal-kc_scrollbar_handler_height/2){
					scroll_position+=2;
					if(scroll_position>=scroll_goal-kc_scrollbar_handler_height/2){
						clearInterval(scrollmove);
					}
				}else if(scroll_position>scroll_goal-kc_scrollbar_handler_height/2){
					scroll_position-=2;
					if(scroll_position<=scroll_goal-kc_scrollbar_handler_height/2){
						clearInterval(scrollmove);
					}
					
				}
				
				if(scroll_position+kc_scrollbar_handler_height>=kc_scrollbar_height){
					kc_scrollbar_handler.style["top"]=kc_scrollbar_height-kc_scrollbar_handler_height+"px";
					scroll_position=kc_scrollbar_height-kc_scrollbar_handler_height;
					kc_get_scroll_percents()
				}else if(scroll_position<=0){
					kc_scrollbar_handler.style["top"]="0px";
					scroll_position=0;
					kc_get_scroll_percents();
				}else{
					kc_scrollbar_handler.style["top"]=scroll_position+"px";
					kc_get_scroll_percents();
				}
				
				
				
			},scroll_speed);
		});
		kc.addEventListener(document,"mouseup",function(e){
			kc_dragstatus=false;
			try{clearInterval(scrollmove)}catch(err){}
		});
		
		function kc_get_scroll_percents(){
			scroll_position_percent=(scroll_position*100)/(kc_scrollbar_height-kc_scrollbar_handler_height);	
			if(scroll_position_percent>99) scroll_position_percent=100;
			if(scroll_position_percent<1) scroll_position_percent=0;
			content_scroll_position=(scroll_position_percent*kc_content_max_scroll)/100;
			
			kc_content.scrollTop=content_scroll_position;
		}
	}
	kc_setUpScrollbar();
}

