function debug(d) {
  if($('debug')) {
    $('debug').value = d+"\n"+$('debug').value;
  }
}


if(!Control) var Control = {};
Control.Scroll = Class.create();

Control.Scroll.prototype = {
  /* note that height and width should reflect the height and width of the parent element.
  These parameters are ONLY used when an offset height can't be calculated */
  initialize: function(element) {
    element = $(element);
    var element_id = element.id;
    var parent = element;
    var child = $(element.id+'-content');
    var handle = $(element_id+'-slider');
    var track = $(element_id+'-track');
    //track.style.height = parent.offsetHeight+"px";
    
    new Control.Slider(handle.id, track.id, { range: $R(0,1),
      parent_element: parent,
      content_element: child,
      axis: 'vertical',
      
      onSlide: function(v) { 
        this.scroll(v);
      },
      
      onChange: function(v) {
        //alert($('slot-1').offsetHeight);
        this.scroll(v);
      },
    
      scroll: function(v)
      {
        //alert(this.true_height+' '+this.control_height);
        //debug(this.content_element.offsetHeight+" - "+ this.parent_element.offsetHeight + v);
        margin = (this.content_element.offsetHeight - this.parent_element.offsetHeight) * -v;       
        if(margin > 0) {
          margin = 0;
        }
        this.content_element.style.marginTop = margin+'px';
      }
    });
  }
}