setLength extension for Control.Slider

The UI on a project of mine had to be resiz­able. The UI included a script.aculo.us slider which unfor­tu­nately did not have a resize method nor was it smart enough to update itself should the under­ly­ing ele­ment be resized. So I cre­ated the fol­low­ing extension:

Object.extend(Control.Slider.prototype, {
  setLength: function(length) {
    // resize the element
    if (this.isVertical()) {
      Element.setStyle(this.track, {height: length + "px"});
    } else {
      Element.setStyle(this.track, {width: length + "px"});
    }
    
    // update lengths
    this.trackLength = this.maximumOffset() - this.minimumOffset();

    this.handleLength = this.isVertical() ? 
      (this.handles[0].offsetHeight != 0 ? 
        this.handles[0].offsetHeight : this.handles[0].style.height.replace(/px$/,"")) : 
      (this.handles[0].offsetWidth != 0 ? this.handles[0].offsetWidth : 
        this.handles[0].style.width.replace(/px$/,""));
    
    // reposition handles
    this.handles.each( function(h,i) {
      h.style[this.isVertical() ? 'top' : 'left'] = 
        this.translateToPx(this.values[i]);
    }.bind(this));
  }
})

Just drop this code into your extensions.js file and you should be good to go. Then just call the instance method like so mySlider.setLength(newLength) where newLength is an inte­ger value.