var scroller =
{
	init: function( scrollContainerOffset )
	{
		if( scrollContainerOffset==undefined ) scrollContainerOffset = 0;
		var scrollerDom = Ext.get('scroller').dom;
		
		//collect the variables
		scroller.docH			= Ext.get('scrollContent').getHeight(); // Höhe des zu scrollenden Contents
		scroller.contH			= Ext.get('scrollContainer').getHeight()-scrollContainerOffset; // sichtbare Höhe
		
		Ext.get('scrollBar').setHeight( Ext.get('scrollContainer').getHeight() );
		scroller.scrollAreaH = scroller.contH; // Höhe der Scrollbar
		
		//calculate height of scroller and resize the scroller div
		//(however, we make sure that it isn't to small for long pages)
		scroller.scrollH = (scroller.contH * scroller.scrollAreaH) / scroller.docH;
		if( scroller.scrollH<15 ) scroller.scrollH = 15;
		scrollerDom.style.height = Math.round( scroller.scrollH ) + "px";
		
		//what is the effective scroll distance once the scoller's height has been taken into account
		scroller.scrollDist = Math.round( scroller.scrollAreaH-scroller.scrollH+scrollContainerOffset );
		
		//make the scroller div draggable
		Drag.init( scrollerDom, null, 0, 0, -1, scroller.scrollDist );
		
		//add ondrag function
		scrollerDom.onDrag = function (x,y)
		{
			var scrollY = parseInt( scrollerDom.style.top );
			var docY = 0 - (scrollY * (scroller.docH - scroller.contH) / scroller.scrollDist);
			document.getElementById("scrollContent").style.top = docY + "px";
		}
		
		Ext.get( 'scrollBar' ).show();
	}
}