@vdt-jquery/jquery-rangeslider/Scripts/jquery-rangeslider.min.js

A jQuery plugin that makes it easy to transform any html-element into a range slider with definable range that is consistent across browsers.

(function(n){function t(t,r){this.element=t;this.options=r;this.rangeStart=r.getRangeStart(this.element);this.stepCount=r.getStepCount(this.element);this.stepSize=r.getStepSize(this.element);this.dragStatus={dragging:!1};this.element.addClass("rangeslider");this.element.children().hide();this.thumb=this.createElement("<div>","rangeslider-thumb",this.options.getThumbAttributes());this.track=this.createElement("<div>","rangeslider-track",this.options.getTrackAttributes());this.input=this.createElement("<input>","rangeslider-input",this.options.getInputAttributes(),{name:this.options.getFieldName(this.element),type:"hidden"});this.element.append(this.track,this.thumb,this.input);this.setValue(r.getValue(this.element));this.element.click(this,i.click);this.thumb.on("mousedown",this,i.thumbDragStart);n(document).on("mousemove",this,i.thumbDrag);n(document).on("mouseup",this,i.thumbDragEnd)}n.fn.rangeslider=function(i,r){return n.isFunction(i)&&(r=i,i=null),n(this).each(function(){let u=n(this).data("rangeslider");if(!u){let r=n.extend({},n.fn.rangeslider.defaults,i);u=new t(n(this),r);n(this).data("rangeslider",u)}n.isFunction(r)&&r.bind(u)(u)})};n.fn.rangeslider.defaults={getRangeStart:function(t){let i=parseInt(n(t).data("range-start"));return isNaN(i)&&(i=0),i},getStepCount:function(t){let i=parseInt(n(t).data("step-count"));return(isNaN(i)||i<=0)&&(i=10),i},getStepSize:function(t){let i=parseInt(n(t).data("step-size"));return(isNaN(i)||i<=0)&&(i=10),i},getValue:function(t){let i=parseInt(n(t).data("value"));return isNaN(i)&&(i=0),i},getFieldName:function(t){return n(t).data("field-name")},getInputAttributes:function(){return{}},getThumbAttributes:function(){return{}},getTrackAttributes:function(){return{}}};t.prototype.createElement=function(t,i){let r=n.extend.apply({},Array.prototype.slice.call(arguments,2));return n(t,r).addClass(i)};t.prototype.remove=function(){this.element.removeClass("rangeslider");this.thumb.remove();this.track.remove();this.input.remove();this.element.removeData("rangeslider");this.element.off("click",i.click);this.element.children().show()};t.prototype.getStepWidth=function(){return this.element.width()/this.stepCount};t.prototype.setStep=function(n){this.step!==n&&(this.step=n,this.thumb.css("left","calc("+100/this.stepCount*n+"% - "+this.thumb.outerWidth(!0)/2+"px)"),this.input.val(this.rangeStart+this.step*this.stepSize),this.element.trigger("rangeslider.valueChanged",this.getValue()))};t.prototype.getValue=function(){return this.rangeStart+this.stepSize*this.step};t.prototype.setValue=function(n){n<this.rangeStart?this.setStep(0):n>this.rangeStart+this.stepCount*this.stepSize?this.setStep(this.stepCount):this.setStep(Math.round((n-this.rangeStart)/this.stepSize))};let i={thumbDragStart:function(n){n.which===1&&(n.data.dragStatus.dragging=!0,n.data.dragStatus.startPosition=n.pageX,n.data.dragStatus.startStep=n.data.step)},thumbDrag:function(n){if(n.data.dragStatus.dragging){let i=n.data.dragStatus.startPosition-n.pageX,t=n.data.dragStatus.startStep-Math.round(i/n.data.getStepWidth());t<0?t=0:t>n.data.stepCount&&(t=n.data.stepCount);n.data.setStep(t)}},thumbDragEnd:function(n){n.data.dragStatus.dragging=!1},click:function(n){if(n.data.thumb.filter(n.target).length!==1){let t=Math.round(n.offsetX/n.data.getStepWidth());n.data.setStep(t)}}}})(jQuery);