if ( typeof scrollbar === 'undefined' )
{
	scrollbar = {};
};

scrollbar.browser = {
	
	sliderVal: 0,
	animationId: false,
	viewportHeight: 0,
	contentHeight: 0,
	categories: [],
	isSliding: false,
	lastY: 0.32,
	arrowScrollAmount: 0.24,
	isMouseDown: false,
	dif: 0,
	overlap: 0,
	sliderOffset: 108,
	offsetcontentHeight: -946,
	clicked: false,
	startIndex: 0,
	
	init: function ( setupArgs )
	{
		if ( setupArgs )
		{
			if ( typeof setupArgs.categories !== 'undefined' )
			{
				this.categories = setupArgs.categories;
			};
		};
		
		this.viewportHeight = $( 'scroll_container' ).getHeight();
		// Content Höhe
		var that = this;
		$( 'scroll_container_inner' ).childElements().each( function( e )
		{
			that.contentHeight += $( e ).getHeight();
		} );
		
		this.offsetcontentHeight = -1 * ( this.contentHeight - this.viewportHeight );
		this.slider = new Control.Slider( 'scrollbar_bg', 'scroll', { axis: 'vertical' } );
		
		$( 'scroll_container_inner' ).setStyle( { 'height': this.contentHeight + 'px' } );
		
		this.slider.options.onChange = function ( value )
		{
			$( 'scrollbar_btn' ).style.top = $( 'scrollbar_bg' ).style.top;
			
			if ( scrollbar.browser.isThrow && !scrollbar.browser.isSliding )
			{
				scrollbar.browser.isSliding = true;
				scrollbar.browser.isThrow	= false;
				
				var mod = value + scrollbar.browser.throwMod;
				
				if ( mod < 0 )
				{
					mod = 0;
				};
				if ( mod > 1 )
				{
					mod = 1;
				};
				scrollbar.browser.animateSlide( mod );
			}
			else if ( !scrollbar.browser.isSliding && value )
			{
				scrollbar.browser.isSliding = true;
				scrollbar.browser.animateSlide( value );
			};
		};
		
		this.slider.options.onSlide = function ( value )
		{
			$( 'scrollbar_btn' ).style.top = $( 'scrollbar_bg' ).style.top;
			
			if ( value && !scrollbar.browser.isSliding )
			{
				scrollbar.browser.isSliding = true;
				scrollbar.browser.isThrow	= false;
				
				if ( scrollbar.browser.isMouseDown )
				{
					scrollbar.browser.dif	= value - scrollbar.browser.lastY;
					scrollbar.browser.lastY	= value;
					
					if ( scrollbar.browser.dif > 0.05 )
					{
						scrollbar.browser.isThrow	= true;
						scrollbar.browser.throwMod 	= 0.2;
					}
					else if ( scrollbar.browser.dif < -0.04 )
					{
						scrollbar.browser.isThrow	= false;
						scrollbar.browser.throwMod 	= -0.2;
					};
				};
				var h = scrollbar.browser.offsetcontentHeight;
				$( 'scroll_container_inner' ).setStyle( { 'top': ( h * value ) + 'px' } );

				this.sliderVal				= value;
				scrollbar.browser.lastY		= value;
				scrollbar.browser.isSliding = false;
			};
			$( 'scroll_container_inner' ).setStyle( { 'overflow': 'hidden' } );
		}
		
		Event.observe( 'scrollbar_bg', 'mousedown', function ()
		{
			scrollbar.browser.isMouseDown = true;
			$( 'scrollbar_bg' ).style.zIndex = '5';
		} );
		
		Event.observe( 'scrollbar_bg', 'mouseup', function ()
		{
			scrollbar.browser.isMouseDown = false;
		} );
		Event.observe( 'scroll', 'mousedown', function ( event )
		{
			var o = event.offsetY || event.layerY;
			if ( Event.element( event ).id === 'scroll' && o < 100 )
			{
				scrollbar.browser.animateSlide( 0 );
			};
		} );
		Event.observe( 'btn_up', 'mousedown', function ( event )
		{
			scrollbar.browser.up();
		} );
		Event.observe( 'btn_dwn', 'mousedown', function ( event )
		{
			scrollbar.browser.down();
		} );
	},
	
	up: function ()
	{
		scrollbar.browser.animateSlide( scrollbar.browser.sliderVal - scrollbar.browser.arrowScrollAmount );
	},
	
	down: function ()
	{
		scrollbar.browser.animateSlide( scrollbar.browser.sliderVal + scrollbar.browser.arrowScrollAmount );
	},
	
	animateSlide: function( toY )
	{
		if ( toY > 1 )
		{
			toY = 1;
		};
		if ( toY < 0 )
		{
			toY = 0;
		};
		
		scrollbar.browser.sliderVal = toY;
		
		window.clearInterval( scrollbar.browser.animationId ); 
		
		var w = scrollbar.browser.offsetcontentHeight;
		var stopPoint = w * toY;
		
		var sliderStopPoint = Math.round( scrollbar.browser.viewportHeight - scrollbar.browser.sliderOffset ) * toY;
		
		scrollbar.browser.isSliding = true;
		scrollbar.browser.animationId = window.setInterval( function ()
		{
			var sliderPos = parseInt( $( 'scroll_container_inner' ).getStyle( 'top' ) ) || 0;
			var handlePos = parseInt( $( 'scrollbar_bg' ).getStyle( 'top' ) ) || 0;
			var y 	= scrollbar.browser.calculateDecel( sliderPos, stopPoint );
			var sy 	= scrollbar.browser.calculateDecel( handlePos, sliderStopPoint );
			$( 'scroll_container_inner' ).style.top = y + 'px';
			$( 'scrollbar_bg' ).style.top = sy + 'px';
			$( 'scrollbar_btn' ).style.top = sy + 'px';
			
			if ( y === stopPoint )
			{
				window.clearInterval( scrollbar.browser.animationId );
				scrollbar.browser.isSliding = false;
			};
		}, 30 );
	},
	
	calculateDecel: function ( from, to )
	{
		var n = from - Math.floor( ( from - to ) * 0.4 );
		if ( Math.abs( from - to ) < 4 )
		{
			return to;
		};
		return n;
	}
};