//We wrap all the code in an object so that it doesn't interfere with any other code
var tabscroller = {
  init:   function() {
		resetTabScroller();    
  }
}

function resetTabScroller(){
	//collect the variables
	if(document.getElementById("tabScrollContent")){
		tabscroller.docH = document.getElementById("tabScrollContent").offsetHeight;
		tabscroller.contH = document.getElementById("tabScrollContainer").offsetHeight;
		tabscroller.scrollAreaH = document.getElementById("tabScrollArea").offsetHeight;
		  
		//calculate height of scroller and resize the scroller div
		//(however, we make sure that it isn't to small for long pages)
		tabscroller.scrollH = (tabscroller.contH * tabscroller.scrollAreaH) / tabscroller.docH;
		//if(scroller.scrollH < 15) scroller.scrollH = 15;
		document.getElementById("tabScroller").style.height = Math.round(tabscroller.scrollH) + "px";
		
		//what is the effective scroll distance once the scoller's height has been taken into account
		tabscroller.scrollDist = Math.round(tabscroller.scrollAreaH-tabscroller.scrollH);
		
		if(tabscroller.scrollDist < 1){
			document.getElementById("tabScrollArea").style.display = 'none';
		}
		
		//make the scroller div draggable
		Drag.init(document.getElementById("tabScroller"),null,0,0,-1,tabscroller.scrollDist);
		alert(tabscroller.scrollH);
		
		//add ondrag function
		document.getElementById("tabScroller").onDrag = function (x,y) {
		  var scrollY = parseInt(document.getElementById("tabScroller").style.top);
		  var docY = 0 - (scrollY * (tabscroller.docH - tabscroller.contH) / tabscroller.scrollDist);
		  document.getElementById("tabScrollContent").style.top = docY + "px";
		}
	}
}

onload = scroller.init;tabscroller.init;