Variable Speed Stopwatch

gistfile1.js

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script type="text/javascript">
// How often the stopwatch is actually updated
Stopwatch.interval_ms = 200;

function Stopwatch(time_offset, ratio_to_realtime, display_increment_ms, display_function) {

  this.start_time = (new Date()).getTime();
  if(time_offset) {
    this.start_time -= time_offset;
  }
  this.now_time = this.start_time;

  if(display_increment_ms < Stopwatch.interval_ms) {
    this.display_increment_ms = Stopwatch.interval_ms;
  }
  else {
    this.display_increment_ms = display_increment_ms;
  }
  this.counter = 0;
  
  // Ratio r = displayed_delta_t/real_delta_t
  // for r > 1, considered "fast"
  // for r = 1, real time
  // for 0 < r < 1, considered "slow"
  // for r = 0, stopwatch is not moving
  this.ratio_to_realtime = Math.abs(ratio_to_realtime);
  
  this.display_function = display_function;
}

Stopwatch.prototype.delta_t = function() {
  return this.now_time - this.start_time;
}

Stopwatch.prototype.displayed_delta_t = function() {
  return this.ratio_to_realtime * this.delta_t();
}

Stopwatch.prototype.update = function() {
  this.now_time = (new Date()).getTime();
}
Stopwatch.prototype.display = function() {
  if(this.counter - this.display_increment_ms < this.displayed_delta_t()) {
    this.counter += this.display_increment_ms;
    this.display_function(this.displayed_delta_t());
  }
}

Stopwatch.prototype.start = function() {
  var instance = this;
  this.timer = window.setInterval(function() {
    instance.update();
    instance.display();
  }, Stopwatch.interval_ms);
}

var DisplayClock = function(milliseconds, id_target) {
  var zeroPad = function(num, count) {
    var numZeropad = num + '';
    while(numZeropad.length < count) {
      numZeropad = "0" + numZeropad;
    }
    return numZeropad;
  }
  var seconds = Math.floor((milliseconds / 1000.0)%60);
  var minutes = Math.floor((milliseconds / 1000.0)/60)%60;
  var hours = Math.floor((milliseconds / 1000.0) / 3600);
  //jQuery(id_target).html(zeroPad(minutes, 2) + ":" + zeroPad(seconds, 2));
  document.getElementById(id_target).innerHTML(zeroPad(minutes, 2) + ":" + zeroPad(seconds, 2));
};

var slow_ratio = 0.8;
var fast_ratio = 1.2;
var display_interval = 1000;
var target_id = "#stopwatch";
var ratio = slow_ratio;

var stopwatch;
jQuery(document).ready(function() {
  var stopwatch_offset = jQuery('#Stopwatch-RealTime').val();
  jQuery('#Stopwatch-TimeRatio').val(ratio);
//  console.log("Stopwatch-TimeRatio: " + ratio);
  stopwatch = new Stopwatch(stopwatch_offset, slow_ratio, display_interval, function(delta_t) {
    DisplayClock(delta_t, target_id);
    var ratio = jQuery('#Stopwatch-TimeRatio').val();
    jQuery('#Stopwatch-RealTime').val(delta_t / ratio);
    jQuery('#Stopwatch-SeenTime').val(delta_t);
//    console.log("Stopwatch-RealTime: " + jQuery('#Stopwatch-RealTime').val());
//    console.log("Stopwatch-SeenTime: " + jQuery('#Stopwatch-SeenTime').val());
  });
  stopwatch.start();
});
</script>