// ==============================================================
// HANDLES SCROLLER/S
// Modified from Aaron Boodman http://webapp.youngpup.net/?request=/components/ypSimpleScroll.xml
// mixed ypSimpleScroll with dom-drag script and allowed multiple scrolelrs through array instances
// (c)2004 Sergi Meseguer (http://zigotica.com/), 04/2004:
// ==============================================================
  includeJS("/include/js/"+(!isAppleHandheld ? '_domdrag' : '_touch')+".js");
  includeJS("/include/js/_simplescroll.js");

  var theHandle = []; var theRoot = []; var theThumb = []; var theScroll = []; var thumbTravel = []; var ratio = [];

  function instantiateScroller(count, id, left, top, width, height, speed){
    if(document.getElementById) {
      theScroll[count] = new ypSimpleScroll(id, left, top, width, height, speed);
    }
  }

  function createDragger(count, root, minX, maxX, minY, maxY, limit) {
    var buttons = '<div id="scrollbar'+count+'" class="scrollbar">'+
          '<div class="scrollbar-up" id="scrollbar-up-'+count+'" '+
            'onmousedown="theScroll['+count+'].scrollUp(\''+count+'\');" '+
            'onmouseout="theScroll['+count+'].endScroll();" '+
            'onmouseup="theScroll['+count+'].endScroll();" '+
            'ontouchstart="theScroll['+count+'].scrollUp(\''+count+'\');" '+
            'ontouchend="theScroll['+count+'].endScroll();" '+
            'onclick="void(0);" '+
          '></div>'+
          '<div class="scrollbar-th" id="scrollbar-th-'+count+'" onclick="void(0);"></div>'+
          '<div class="scrollbar-dn" id="scrollbar-dn-'+count+'" '+
            'onmousedown="theScroll['+count+'].scrollDn(\''+count+'\');" '+
            'onmouseout="theScroll['+count+'].endScroll();" '+
            'onmouseup="theScroll['+count+'].endScroll();" '+
            'ontouchstart="theScroll['+count+'].scrollDn(\''+count+'\');" '+
            'ontouchend="theScroll['+count+'].endScroll();" '+
            'onclick="void(0);" '+
          '></div>'+
         '</div>'

    thumb = 'scrollbar-th-'+count;
    document.getElementById(root).innerHTML = buttons + document.getElementById(root).innerHTML;

    theRoot[count]   = document.getElementById(root);
    theThumb[count]  = document.getElementById(thumb);
    var thisup = document.getElementById("scrollbar-up-"+count);
    var thisdn = document.getElementById("scrollbar-dn-"+count);
    theThumb[count].style.left = parseInt(minX+15) + "px";
    thisup.style.left = parseInt(minX+15) + "px";
    thisdn.style.left = parseInt(minX+15) + "px";
    theThumb[count].style.border = 0;
    theThumb[count].style.top = parseInt(minY) + "px";
    thisup.style.top = 0 + "px";
    thisdn.style.top = parseInt(minY+maxY) + "px";
    //thisdn.style.top = 15 + "px";

    theScroll[count].load();

    //Drag.init(theHandle[count], theRoot[count]); //not draggable on screen
    Drag.init(theThumb[count], null, minX+15, maxX+15, minY, limit);  //maxY-10);

    // the number of pixels the thumb can travel vertically (max - min)
    // (gp) adjusted for taller thumb -- change to definable sizes someday
    thumbTravel[count] = limit - theThumb[count].minY;       //theThumb[count].maxY - theThumb[count].minY;

    // the ratio between scroller movement and thumbMovement
    ratio[count] = theScroll[count].scrollH / thumbTravel[count];

    theThumb[count].onDrag = function(x, y) {
      theScroll[count].jumpTo(null, Math.round((y - theThumb[count].minY) * ratio[count]));
    }
  }