Date range slider

by Robert Koritnik

HTML

<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script>
<link rel="stylesheet" href="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothness/jquery-ui.css">
<div id="slider"></div>
<div id="results">
</div>

CSS

body {
    padding: 20px;
    font-family: sans-serif;
    font-size: 13px;
}

#slider {
    width: 300px;
}

#results {
    margin: 1em 0;
}

JavaScript

/*
 * jQuery UI Slider Range extension 1.1 (25 Oct 2011)
 *
 * This extension is based code provided by
 * jQuery UI Slider version 1.8.13
 * it may happen tht it won't work with newer versions
 *
 * Copyright (c) 2011 Robert Koritnik
 * Licensed under the terms of the MIT and GPL-2.0 license
 * http://www.opensource.org/licenses/mit-license.php
 * http://www.opensource.org/licenses/GPL-2.0
 *
 */
 
(function($) {
    if ($.ui.slider)
    {
        // add minimum range length option
        $.extend($.ui.slider.prototype.options, {
            minRangeSize: 0,
            maxRangeSize: 100,
            autoShift: false,
            lowMax: 100,
            topMin: 0
        });
 
        $.extend($.ui.slider.prototype, {
            _slide: function(event, index, newVal) {
                var otherVal,
                newValues,
                allowed,
                factor;
 
                if (this.options.values && this.options.values.length)
                {
                    otherVal = this.values(index ? 0 : 1);
                    factor = index === 0 ? 1 : -1;
 
                    if (this.options.values.length === 2 && this.options.range === true)
                    {
                        // lower bound max
                        if (index === 0 && newVal > this.options.lowMax)
                        {
                            newVal = this.options.lowMax;
                        }
 
                        // upper bound min
                        if (index === 1 && newVal < this.options.topMin)
                        {
                            newVal = this.options.topMin;
                        }
 
                        // minimum range requirements
                        if ((otherVal - newVal) * factor < this.options.minRangeSize)
                        {
                            if (this.options.autoShift === true)
                            {
                                otherVal = newVal +...