Adds a crude windowing control to https://immersion.media.mit.edu/viz. Just paste this into the console after the visualization is running and press enter. Adjust the STEPS count for more or less granularity.

immersionWindow.js

// Adds a crude windowing control to https://immersion.media.mit.edu/viz
//  Just paste into the console after the visualization is running and
//  press enter.

(function ($) {
  $('<div>').attr({id: 'slider-window'}).appendTo('#centercolumn');

  var STEPS = 16;
  var $windower = $('#slider-window');
  var $ranger = $('#slider-range');
  var rMin = $ranger.slider('option', 'min');
  var rMax = $ranger.slider('option', 'max');
  var rOffset;
  var rAvg;

  $windower.slider({
    slide: function (ev, ui) {
      $ranger.slider('values', 0, ui.value - rOffset);
      $ranger.slider('values', 1, ui.value + rOffset);
    },
    step: (rMax-rMin)/STEPS
  });

  $ranger.on('slidechange', function (ev, ui) {
      $windower.slider({
        value: rAvg,
        min: rMin + rOffset,
        max: rMax - rOffset
      });
    });

  $ranger.on('slidestop', function (ev, ui) {
      rOffset = ($ranger.slider('values', 1)-$ranger.slider('values', 0))/2;
      rAvg = ($ranger.slider('values', 0)+$ranger.slider('values', 1))/2;
    });

  $ranger.slider('values', [((rMax-rMin)/(STEPS/2))*(STEPS/2-1)+rMin, rMax]);
  $ranger.trigger('slidestop');
  $ranger.trigger('slidechange');
})($);