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

    //collect the variables
    scroller.docH = document.getElementById("scrollcontent").offsetHeight;
    scroller.contH = document.getElementById("scrollcontainer").offsetHeight;
    scroller.scrollAreaH = document.getElementById("scrollerarea").offsetHeight;
    scroller.scrollH = document.getElementById("scroller").offsetHeight;

    if(scroller.docH > scroller.contH) document.getElementById("scroller").style.visibility = "visible";
    
    //what is the effective scroll distance once the scoller's height has been taken into account
    scroller.scrollDist = Math.round(scroller.scrollAreaH-scroller.scrollH);
    
    //make the scroller div draggable
    Drag.init(document.getElementById("scroller"),null,0,0,-1,scroller.scrollDist);
    
    //add ondrag function
    document.getElementById("scroller").onDrag = function (x,y) {
      var scrollY = parseInt(document.getElementById("scroller").style.top);
      var docY = 0 - (scrollY * (scroller.docH - scroller.contH) / scroller.scrollDist);
      document.getElementById("scrollcontent").style.top = docY + "px";
    }
  }
}

onload = scroller.init;