// JavaScript Document
$(window).load(function() {
	second_scroll();
	function second_scroll() {
		$customScrollBox_1=$("#customScrollBox_1");
		$customScrollBox_container_1=$("#customScrollBox_1 .container");
		$customScrollBox_content_scroll_1=$("#customScrollBox_1 .content_scroll");
		$dragger_container_1=$("#dragger_container_1");
		$dragger_1=$("#dragger_1");
		$to_1=$('#to_1');
		
		CustomScroller_1();
		
		function CustomScroller_1(){
			outerMargin_1=0;
			innerMargin_1=20;
			$customScrollBox_1.height($to_1.height()-outerMargin_1);
			$dragger_container_1.height($to_1.height()-innerMargin_1);
			visibleHeight_1=$to_1.height()-outerMargin_1;
			
	//		$customScrollBox.height($(window).height()-outerMargin);
	//		$dragger_container.height($(window).height()-innerMargin);
	//		visibleHeight=$(window).height()-outerMargin;
			
			if($customScrollBox_container_1.height()>visibleHeight_1){ //custom scroll depends on content_scroll height
				$dragger_container_1,$dragger_1.css("display","block");
				totalContent_1=$customScrollBox_content_scroll_1.height();
	//			draggerContainerHeight=$(window).height()-innerMargin;
				
				draggerContainerHeight_1=$to_1.height()-innerMargin_1;
				
				animSpeed_1=400; //animation speed
				easeType_1="easeOutCirc"; //easing type
				bottomSpace_1=1.05; //bottom scrolling space
				targY_1=0;
				draggerHeight_1=$dragger_1.height();
				$dragger_1.draggable({ 
					axis: "y", 
					containment: "parent", 
					drag: function(event, ui) {
						Scroll_1();
					}, 
					stop: function(event, ui) {
						DraggerOut_1();
					}
				});
	
				//scrollbar click
				$dragger_container_1.click(function(e) {
					var mouseCoord_1=(e.pageY - $(this).offset().top);
					var targetPos_1=mouseCoord_1+$dragger_1.height();
					if(targetPos_1<draggerContainerHeight_1){
						$dragger_1.css("top",mouseCoord_1);
						Scroll_1();
					} else {
						$dragger_1.css("top",draggerContainerHeight_1-$dragger_1.height());
						Scroll_1();
					}
				});
	
				//mousewheel
				$(function($) {
					$customScrollBox_1.bind("mousewheel", function(event, delta_1) {
						vel_1 = Math.abs(delta_1*10);
						$dragger_1.css("top", $dragger_1.position().top-(delta_1*vel_1));
						Scroll_1();
						if($dragger_1.position().top<0){
							$dragger_1.css("top", 0);
							$customScrollBox_container_1.stop();
							Scroll_1();
						}
						if($dragger_1.position().top>draggerContainerHeight_1-$dragger_1.height()){
							$dragger_1.css("top", draggerContainerHeight_1-$dragger_1.height());
							$customScrollBox_container_1.stop();
							Scroll_1();
						}
						return false;
					});
				});
	
				function Scroll_1(){
					var scrollAmount_1=(totalContent_1-(visibleHeight_1/bottomSpace_1))/(draggerContainerHeight_1-draggerHeight_1);
					var draggerY_1=$dragger_1.position().top;
					targY_1=-draggerY_1*scrollAmount_1;
					var thePos_1=$customScrollBox_container_1.position().top-targY_1;
					$customScrollBox_container_1.stop().animate({top: "-="+thePos_1}, animSpeed_1, easeType_1); //with easing
					//$customScrollBox_container.css("top",$customScrollBox_container.position().top-thePos+"px"); //no easing
				}
	
				//dragger hover
				$dragger_1.mouseup(function(){
					DraggerOut_1();
				}).mousedown(function(){
					DraggerOver_1();
				});
	
				function DraggerOver_1(){
					$dragger_1.css("background", "url(images/i_scroll_1.jpg)");
				}
	
				function DraggerOut_1(){
					$dragger_1.css("background", "url(images/i_scroll_1.jpg)");
				}
			} else { //hide custom scrollbar if content_scroll is short
				$dragger_1,$dragger_container_1.css("display","none");
			}
		}
	}
	//resize browser window functions
	$(window).resize(function() {
		resize_window_1($dragger_1,$customScrollBox_container_1,$customScrollBox_1);
		CustomScroller_1();
	});
	
	function resize_window($dragger_1,$customScrollBox_container_1,$customScrollBox_1) {
		$dragger_1.css("top",0); //reset content_scroll scroll
		$customScrollBox_container_1.css("top",0);
		$customScrollBox_1.unbind("mousewheel");		
	}
});