jrange update

5 files changed, 166 insertions, 113 deletions

diff --git a/library/jRange/demo/index.html b/library/jRange/demo/index.html
index ac443f11f..19a5f33f0 100644
--- a/library/jRange/demo/index.html
+++ b/library/jRange/demo/index.html
@@ -41,7 +41,7 @@
     from: 0,
     to: 100,
     step: 1,
-    scale: [0,50,100],
+    scale: [0,25,50,75,100],
     format: '%s',
     width: 300,
     showLabels: true
@@ -181,6 +181,20 @@
                         </td>
                     </tr>
                     <tr>
+                        <td>disable</td>
+                        <td>Optional</td>
+                        <td>Boolean</td>
+                        <td>
+                            <code>Default : false</code>
+                            <p>True if this is a disable(read only) range selector. You can also change disable status later by calling. </p>
+                            <code>
+                                $('.slider').jRange('disable');
+                                $('.slider').jRange('enable');
+                                $('.slider').jRange('toggleDisable');
+                            </code>
+                        </td>
+                    </tr>
+                    <tr>
                         <td>onstatechange</td>
                         <td>Optional</td>
                         <td>Function</td>
@@ -242,4 +256,4 @@
         });
     </script>
 </body>
-</html>
\ No newline at end of file
+</html>
diff --git a/library/jRange/jquery.range-min.js b/library/jRange/jquery.range-min.js
index 00dadf220..589913e57 100644
--- a/library/jRange/jquery.range-min.js
+++ b/library/jRange/jquery.range-min.js
@@ -1 +1 @@
-!function($,t,i,s){"use strict";var o=function(){return this.init.apply(this,arguments)};o.prototype={defaults:{onstatechange:function(){},isRange:!1,showLabels:!0,showScale:!0,step:1,format:"%s",theme:"theme-green",width:300,minRange:0,maxRange:"auto"},template:'<div class="slider-container">			<div class="back-bar">                <div class="selected-bar"></div>                <div class="pointer low"></div><div class="pointer-label">123456</div>                <div class="pointer high"></div><div class="pointer-label">456789</div>                <div class="clickable-dummy"></div>            </div>            <div class="scale"></div>		</div>',init:function(t,i){this.options=$.extend({},this.defaults,i),this.inputNode=$(t),this.options.value=this.inputNode.val()||(this.options.isRange?this.options.from+","+this.options.from:this.options.from),this.domNode=$(this.template),this.domNode.addClass(this.options.theme),this.inputNode.after(this.domNode),this.domNode.on("change",this.onChange),this.pointers=$(".pointer",this.domNode),this.lowPointer=this.pointers.first(),this.highPointer=this.pointers.last(),this.labels=$(".pointer-label",this.domNode),this.lowLabel=this.labels.first(),this.highLabel=this.labels.last(),this.scale=$(".scale",this.domNode),this.bar=$(".selected-bar",this.domNode),this.clickableBar=this.domNode.find(".clickable-dummy"),this.interval=this.options.to-this.options.from,this.render()},render:function(){return 0!==this.inputNode.width()||this.options.width?(this.domNode.width(this.options.width||this.inputNode.width()),this.inputNode.hide(),this.isSingle()&&(this.lowPointer.hide(),this.lowLabel.hide()),this.options.showLabels||this.labels.hide(),this.attachEvents(),this.options.showScale&&this.renderScale(),void this.setValue(this.options.value)):void console.log("jRange : no width found, returning")},isSingle:function(){return"number"==typeof this.options.value?!0:-1!==this.options.value.indexOf(",")||this.options.isRange?!1:!0},attachEvents:function(){this.clickableBar.click($.proxy(this.barClicked,this)),this.pointers.mousedown($.proxy(this.onDragStart,this)),this.pointers.bind("dragstart",function(t){t.preventDefault()})},onDragStart:function(t){if(1===t.which){t.stopPropagation(),t.preventDefault();var s=$(t.target);this.pointers.removeClass("last-active"),s.addClass("focused last-active"),this[(s.hasClass("low")?"low":"high")+"Label"].addClass("focused"),$(i).on("mousemove.slider",$.proxy(this.onDrag,this,s)),$(i).on("mouseup.slider",$.proxy(this.onDragEnd,this))}},onDrag:function(t,i){i.stopPropagation(),i.preventDefault();var s=i.clientX-this.domNode.offset().left;this.domNode.trigger("change",[this,t,s])},onDragEnd:function(){this.pointers.removeClass("focused"),this.labels.removeClass("focused"),$(i).off(".slider"),$(i).off(".slider")},barClicked:function(t){var i=t.pageX-this.clickableBar.offset().left;if(this.isSingle())this.setPosition(this.pointers.last(),i,!0,!0);else{var s=Math.abs(parseInt(this.pointers.first().css("left"),10)-i+this.pointers.first().width()/2)<Math.abs(parseInt(this.pointers.last().css("left"),10)-i+this.pointers.first().width()/2)?this.pointers.first():this.pointers.last();this.setPosition(s,i,!0,!0)}},onChange:function(t,i,s,o){var e,n;i.isSingle()?(e=0,n=i.domNode.width()):(e=s.hasClass("high")?i.lowPointer.position().left+i.lowPointer.width()/2:0,n=s.hasClass("low")?i.highPointer.position().left+i.highPointer.width()/2:i.domNode.width());var h=Math.min(Math.max(o,e),n);i.setPosition(s,h,!0)},setPosition:function(t,i,s,o){var e,n=this.lowPointer.position().left,h=this.highPointer.position().left,a=this.highPointer.width()/2;s||(i=this.prcToPx(i)),t[0]===this.highPointer[0]?h=Math.round(i-a):n=Math.round(i-a),t[o?"animate":"css"]({left:Math.round(i-a)}),e=this.isSingle()?0:n+a,this.bar[o?"animate":"css"]({width:Math.round(h+a-e),left:e}),this.showPointerValue(t,i,o)},setValue:function(t){var i=t.toString().split(",");this.options.value=t;var s=this.valuesToPrc(2===i.length?i:[0,i[0]]);this.isSingle()?this.setPosition(this.highPointer,s[1]):(this.setPosition(this.lowPointer,s[0]),this.setPosition(this.highPointer,s[1]))},renderScale:function(){for(var t=this.options.scale||[this.options.from,this.options.to],i=Math.round(100/(t.length-1)*10)/10,s="",o=0;o<t.length;o++)s+='<span style="left: '+o*i+'%">'+("|"!=t[o]?"<ins>"+t[o]+"</ins>":"")+"</span>";this.scale.html(s),$("ins",this.scale).each(function(){$(this).css({marginLeft:-$(this).outerWidth()/2})})},getBarWidth:function(){var t=this.options.value.split(",");return t.length>1?parseInt(t[1],10)-parseInt(t[0],10):parseInt(t[0],10)},showPointerValue:function(t,i,o){var e=$(".pointer-label",this.domNode)[t.hasClass("low")?"first":"last"](),n,h=this.positionToValue(i);if($.isFunction(this.options.format)){var a=this.isSingle()?s:t.hasClass("low")?"low":"high";n=this.options.format(h,a)}else n=this.options.format.replace("%s",h);var r=e.html(n).width(),l=i-r/2;l=Math.min(Math.max(l,0),this.options.width-r),e[o?"animate":"css"]({left:l}),this.setInputValue(t,h)},valuesToPrc:function(t){var i=100*(t[0]-this.options.from)/this.interval,s=100*(t[1]-this.options.from)/this.interval;return[i,s]},prcToPx:function(t){return this.domNode.width()*t/100},positionToValue:function(t){var i=t/this.domNode.width()*this.interval;return i+=this.options.from,Math.round(i/this.options.step)*this.options.step},setInputValue:function(t,i){if(this.isSingle())this.options.value=i.toString();else{var s=this.options.value.split(",");this.options.value=t.hasClass("low")?i+","+s[1]:s[0]+","+i}this.inputNode.val()!==this.options.value&&(this.inputNode.val(this.options.value),this.options.onstatechange.call(this,this.options.value))},getValue:function(){return this.options.value}};var e="jRange";$.fn[e]=function(t){var i=arguments,s;return this.each(function(){var n=$(this),h=$.data(this,"plugin_"+e),a="object"==typeof t&&t;h||n.data("plugin_"+e,h=new o(this,a)),"string"==typeof t&&(s=h[t].apply(h,Array.prototype.slice.call(i,1)))}),s||this}}(jQuery,window,document);
\ No newline at end of file
+!function($,t,i,s){"use strict";var o=function(){return this.init.apply(this,arguments)};o.prototype={defaults:{onstatechange:function(){},isRange:!1,showLabels:!0,showScale:!0,step:1,format:"%s",theme:"theme-green",width:300,disable:!1},template:'<div class="slider-container">			<div class="back-bar">                <div class="selected-bar"></div>                <div class="pointer low"></div><div class="pointer-label">123456</div>                <div class="pointer high"></div><div class="pointer-label">456789</div>                <div class="clickable-dummy"></div>            </div>            <div class="scale"></div>		</div>',init:function(t,i){this.options=$.extend({},this.defaults,i),this.inputNode=$(t),this.options.value=this.inputNode.val()||(this.options.isRange?this.options.from+","+this.options.from:this.options.from),this.domNode=$(this.template),this.domNode.addClass(this.options.theme),this.inputNode.after(this.domNode),this.domNode.on("change",this.onChange),this.pointers=$(".pointer",this.domNode),this.lowPointer=this.pointers.first(),this.highPointer=this.pointers.last(),this.labels=$(".pointer-label",this.domNode),this.lowLabel=this.labels.first(),this.highLabel=this.labels.last(),this.scale=$(".scale",this.domNode),this.bar=$(".selected-bar",this.domNode),this.clickableBar=this.domNode.find(".clickable-dummy"),this.interval=this.options.to-this.options.from,this.render()},render:function(){return 0!==this.inputNode.width()||this.options.width?(this.domNode.width(this.options.width||this.inputNode.width()),this.inputNode.hide(),this.isSingle()&&(this.lowPointer.hide(),this.lowLabel.hide()),this.options.showLabels||this.labels.hide(),this.attachEvents(),this.options.showScale&&this.renderScale(),void this.setValue(this.options.value)):void console.log("jRange : no width found, returning")},isSingle:function(){return"number"==typeof this.options.value?!0:-1!==this.options.value.indexOf(",")||this.options.isRange?!1:!0},attachEvents:function(){this.clickableBar.click($.proxy(this.barClicked,this)),this.pointers.on("mousedown touchstart",$.proxy(this.onDragStart,this)),this.pointers.bind("dragstart",function(t){t.preventDefault()})},onDragStart:function(t){if(!(this.options.disable||"mousedown"===t.type&&1!==t.which)){t.stopPropagation(),t.preventDefault();var s=$(t.target);this.pointers.removeClass("last-active"),s.addClass("focused last-active"),this[(s.hasClass("low")?"low":"high")+"Label"].addClass("focused"),$(i).on("mousemove.slider touchmove.slider",$.proxy(this.onDrag,this,s)),$(i).on("mouseup.slider touchend.slider touchcancel.slider",$.proxy(this.onDragEnd,this))}},onDrag:function(t,i){i.stopPropagation(),i.preventDefault(),i.originalEvent.touches&&i.originalEvent.touches.length?i=i.originalEvent.touches[0]:i.originalEvent.changedTouches&&i.originalEvent.changedTouches.length&&(i=i.originalEvent.changedTouches[0]);var s=i.clientX-this.domNode.offset().left;this.domNode.trigger("change",[this,t,s])},onDragEnd:function(t){this.pointers.removeClass("focused"),this.labels.removeClass("focused"),$(i).off(".slider")},barClicked:function(t){if(!this.options.disable){var i=t.pageX-this.clickableBar.offset().left;if(this.isSingle())this.setPosition(this.pointers.last(),i,!0,!0);else{var s=Math.abs(parseInt(this.pointers.first().css("left"),10)-i+this.pointers.first().width()/2)<Math.abs(parseInt(this.pointers.last().css("left"),10)-i+this.pointers.first().width()/2)?this.pointers.first():this.pointers.last();this.setPosition(s,i,!0,!0)}}},onChange:function(t,i,s,o){var e,n;i.isSingle()?(e=0,n=i.domNode.width()):(e=s.hasClass("high")?i.lowPointer.position().left+i.lowPointer.width()/2:0,n=s.hasClass("low")?i.highPointer.position().left+i.highPointer.width()/2:i.domNode.width());var h=Math.min(Math.max(o,e),n);i.setPosition(s,h,!0)},setPosition:function(t,i,s,o){var e,n=this.lowPointer.position().left,h=this.highPointer.position().left,a=this.highPointer.width()/2;s||(i=this.prcToPx(i)),t[0]===this.highPointer[0]?h=Math.round(i-a):n=Math.round(i-a),t[o?"animate":"css"]({left:Math.round(i-a)}),e=this.isSingle()?0:n+a,this.bar[o?"animate":"css"]({width:Math.round(h+a-e),left:e}),this.showPointerValue(t,i,o),this.isReadonly()},setValue:function(t){var i=t.toString().split(",");this.options.value=t;var s=this.valuesToPrc(2===i.length?i:[0,i[0]]);this.isSingle()?this.setPosition(this.highPointer,s[1]):(this.setPosition(this.lowPointer,s[0]),this.setPosition(this.highPointer,s[1]))},renderScale:function(){for(var t=this.options.scale||[this.options.from,this.options.to],i=Math.round(100/(t.length-1)*10)/10,s="",o=0;o<t.length;o++)s+='<span style="left: '+o*i+'%">'+("|"!=t[o]?"<ins>"+t[o]+"</ins>":"")+"</span>";this.scale.html(s),$("ins",this.scale).each(function(){$(this).css({marginLeft:-$(this).outerWidth()/2})})},getBarWidth:function(){var t=this.options.value.split(",");return t.length>1?parseInt(t[1],10)-parseInt(t[0],10):parseInt(t[0],10)},showPointerValue:function(t,i,o){var e=$(".pointer-label",this.domNode)[t.hasClass("low")?"first":"last"](),n,h=this.positionToValue(i);if($.isFunction(this.options.format)){var a=this.isSingle()?s:t.hasClass("low")?"low":"high";n=this.options.format(h,a)}else n=this.options.format.replace("%s",h);var l=e.html(n).width(),r=i-l/2;r=Math.min(Math.max(r,0),this.options.width-l),e[o?"animate":"css"]({left:r}),this.setInputValue(t,h)},valuesToPrc:function(t){var i=100*(t[0]-this.options.from)/this.interval,s=100*(t[1]-this.options.from)/this.interval;return[i,s]},prcToPx:function(t){return this.domNode.width()*t/100},positionToValue:function(t){var i=t/this.domNode.width()*this.interval;return i+=this.options.from,Math.round(i/this.options.step)*this.options.step},setInputValue:function(t,i){if(this.isSingle())this.options.value=i.toString();else{var s=this.options.value.split(",");this.options.value=t.hasClass("low")?i+","+s[1]:s[0]+","+i}this.inputNode.val()!==this.options.value&&(this.inputNode.val(this.options.value),this.options.onstatechange.call(this,this.options.value))},getValue:function(){return this.options.value},isReadonly:function(){this.domNode.toggleClass("slider-readonly",this.options.disable)},disable:function(){this.options.disable=!0,this.isReadonly()},enable:function(){this.options.disable=!1,this.isReadonly()},toggleDisable:function(){this.options.disable=!this.options.disable,this.isReadonly()}};var e="jRange";$.fn[e]=function(i){var s=arguments,n;return this.each(function(){var h=$(this),a=$.data(this,"plugin_"+e),l="object"==typeof i&&i;a||(h.data("plugin_"+e,a=new o(this,l)),$(t).resize(function(){a.setValue(a.getValue())})),"string"==typeof i&&(n=a[i].apply(a,Array.prototype.slice.call(s,1)))}),n||this}}(jQuery,window,document);
\ No newline at end of file
diff --git a/library/jRange/jquery.range.css b/library/jRange/jquery.range.css
index 4fb1578dc..62dc15b4f 100644
--- a/library/jRange/jquery.range.css
+++ b/library/jRange/jquery.range.css
@@ -15,7 +15,7 @@
   width: 10px;
   height: 10px;
   background-color: red;
-  cursor: move;
+  cursor: col-resize;
   opacity: 1;
   z-index: 2;
 }
@@ -59,6 +59,10 @@
   color: #999;
   line-height: 1;
 }
+.slider-container.slider-readonly .clickable-dummy,
+.slider-container.slider-readonly .pointer {
+  cursor: auto;
+}
 .theme-green .back-bar {
   height: 5px;
   border-radius: 2px;
@@ -100,7 +104,6 @@
   background-image: linear-gradient(to bottom, #eeeeee, #dddddd);
   background-repeat: repeat-x;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0);
-  cursor: col-resize;
 }
 .theme-green .back-bar .pointer-label {
   color: #999;
@@ -155,7 +158,6 @@
   background-image: linear-gradient(to bottom, #eeeeee, #dddddd);
   background-repeat: repeat-x;
   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffeeeeee', endColorstr='#ffdddddd', GradientType=0);
-  cursor: col-resize;
 }
 .theme-blue .back-bar .pointer-label {
   color: #999;
diff --git a/library/jRange/jquery.range.js b/library/jRange/jquery.range.js
index b3208387d..3e7f99ed9 100644
--- a/library/jRange/jquery.range.js
+++ b/library/jRange/jquery.range.js
@@ -17,27 +17,26 @@
  * jQuery (http://jquery.com)
  *
  **/
- ;
- (function($, window, document, undefined) {
+;
+(function($, window, document, undefined) {
 	'use strict';
 
-	var jRange = function(){
+	var jRange = function() {
 		return this.init.apply(this, arguments);
 	};
 	jRange.prototype = {
-		defaults : {
-			onstatechange : function(){},
-			isRange : false,
-			showLabels : true,
-			showScale : true,
-			step  : 1,
+		defaults: {
+			onstatechange: function() {},
+			isRange: false,
+			showLabels: true,
+			showScale: true,
+			step: 1,
 			format: '%s',
-			theme : 'theme-green',
-			width : 300,
-			minRange: 0,
-			maxRange: 'auto'
+			theme: 'theme-green',
+			width: 300,
+			disable: false
 		},
-		template : '<div class="slider-container">\
+		template: '<div class="slider-container">\
 			<div class="back-bar">\
                 <div class="selected-bar"></div>\
                 <div class="pointer low"></div><div class="pointer-label">123456</div>\
@@ -46,214 +45,247 @@
             </div>\
             <div class="scale"></div>\
 		</div>',
-		init : function(node, options){
+		init: function(node, options) {
 			this.options       = $.extend({}, this.defaults, options);
 			this.inputNode     = $(node);
-			this.options.value = this.inputNode.val() || (this.options.isRange ? this.options.from+','+this.options.from : this.options.from);
+			this.options.value = this.inputNode.val() || (this.options.isRange ? this.options.from + ',' + this.options.from : this.options.from);
 			this.domNode       = $(this.template);
 			this.domNode.addClass(this.options.theme);
 			this.inputNode.after(this.domNode);
 			this.domNode.on('change', this.onChange);
-			this.pointers     = $('.pointer', this.domNode);
-			this.lowPointer   = this.pointers.first();
-			this.highPointer  = this.pointers.last();
-			this.labels       = $('.pointer-label', this.domNode);
-			this.lowLabel     = this.labels.first();
-			this.highLabel    = this.labels.last();
-			this.scale        = $('.scale', this.domNode);
-			this.bar          = $('.selected-bar', this.domNode);
-			this.clickableBar = this.domNode.find('.clickable-dummy');
-			this.interval     = this.options.to - this.options.from;
+			this.pointers      = $('.pointer', this.domNode);
+			this.lowPointer    = this.pointers.first();
+			this.highPointer   = this.pointers.last();
+			this.labels        = $('.pointer-label', this.domNode);
+			this.lowLabel      = this.labels.first();
+			this.highLabel     = this.labels.last();
+			this.scale         = $('.scale', this.domNode);
+			this.bar           = $('.selected-bar', this.domNode);
+			this.clickableBar  = this.domNode.find('.clickable-dummy');
+			this.interval      = this.options.to - this.options.from;
 			this.render();
 		},
-		render: function(){
+		render: function() {
 			// Check if inputNode is visible, and have some width, so that we can set slider width accordingly.
-			if( this.inputNode.width() === 0 && !this.options.width ){
+			if (this.inputNode.width() === 0 && !this.options.width) {
 				console.log('jRange : no width found, returning');
 				return;
-			}else{
-				this.domNode.width( this.options.width || this.inputNode.width() );
+			} else {
+				this.domNode.width(this.options.width || this.inputNode.width());
 				this.inputNode.hide();
 			}
 
-			if(this.isSingle()){
+			if (this.isSingle()) {
 				this.lowPointer.hide();
 				this.lowLabel.hide();
 			}
-			if(!this.options.showLabels){
+			if (!this.options.showLabels) {
 				this.labels.hide();
 			}
 			this.attachEvents();
-			if(this.options.showScale){
+			if (this.options.showScale) {
 				this.renderScale();
 			}
 			this.setValue(this.options.value);
 		},
-		isSingle: function(){
-			if(typeof(this.options.value) === 'number'){
+		isSingle: function() {
+			if (typeof(this.options.value) === 'number') {
 				return true;
 			}
 			return (this.options.value.indexOf(',') !== -1 || this.options.isRange) ?
-					false : true;
+				false : true;
 		},
-		attachEvents: function(){
+		attachEvents: function() {
 			this.clickableBar.click($.proxy(this.barClicked, this));
-			this.pointers.mousedown($.proxy(this.onDragStart, this));
-			this.pointers.bind('dragstart', function(event) { event.preventDefault(); });
+			this.pointers.on('mousedown touchstart', $.proxy(this.onDragStart, this));
+			this.pointers.bind('dragstart', function(event) {
+				event.preventDefault();
+			});
 		},
-		onDragStart: function(e){
-			if(e.which !== 1){return;}
-			e.stopPropagation(); e.preventDefault();
+		onDragStart: function(e) {
+			if ( this.options.disable || (e.type === 'mousedown' && e.which !== 1)) {
+				return;
+			}
+			e.stopPropagation();
+			e.preventDefault();
 			var pointer = $(e.target);
 			this.pointers.removeClass('last-active');
 			pointer.addClass('focused last-active');
-			this[(pointer.hasClass('low')?'low':'high') + 'Label'].addClass('focused');
-			$(document).on('mousemove.slider', $.proxy(this.onDrag, this, pointer));
-			$(document).on('mouseup.slider', $.proxy(this.onDragEnd, this));
+			this[(pointer.hasClass('low') ? 'low' : 'high') + 'Label'].addClass('focused');
+			$(document).on('mousemove.slider touchmove.slider', $.proxy(this.onDrag, this, pointer));
+			$(document).on('mouseup.slider touchend.slider touchcancel.slider', $.proxy(this.onDragEnd, this));
 		},
-		onDrag: function(pointer, e){
-			e.stopPropagation(); e.preventDefault();
+		onDrag: function(pointer, e) {
+			e.stopPropagation();
+			e.preventDefault();
+
+			if (e.originalEvent.touches && e.originalEvent.touches.length) {
+				e = e.originalEvent.touches[0];
+			} else if (e.originalEvent.changedTouches && e.originalEvent.changedTouches.length) {
+				e = e.originalEvent.changedTouches[0];
+			}
+
 			var position = e.clientX - this.domNode.offset().left;
 			this.domNode.trigger('change', [this, pointer, position]);
 		},
-		onDragEnd: function(){
+		onDragEnd: function(e) {
 			this.pointers.removeClass('focused');
 			this.labels.removeClass('focused');
 			$(document).off('.slider');
-			$(document).off('.slider');
 		},
-		barClicked: function(e){
+		barClicked: function(e) {
+			if(this.options.disable) return;
 			var x = e.pageX - this.clickableBar.offset().left;
-			if(this.isSingle())
+			if (this.isSingle())
 				this.setPosition(this.pointers.last(), x, true, true);
-			else{
+			else {
 				var pointer = Math.abs(parseInt(this.pointers.first().css('left'), 10) - x + this.pointers.first().width() / 2) < Math.abs(parseInt(this.pointers.last().css('left'), 10) - x + this.pointers.first().width() / 2) ?
 					this.pointers.first() : this.pointers.last();
 				this.setPosition(pointer, x, true, true);
 			}
 		},
-		onChange: function(e, self, pointer, position){
+		onChange: function(e, self, pointer, position) {
 			var min, max;
-			if(self.isSingle()){
+			if (self.isSingle()) {
 				min = 0;
 				max = self.domNode.width();
-			}else{
-				min = pointer.hasClass('high')? self.lowPointer.position().left + self.lowPointer.width() / 2 : 0;
+			} else {
+				min = pointer.hasClass('high') ? self.lowPointer.position().left + self.lowPointer.width() / 2 : 0;
 				max = pointer.hasClass('low') ? self.highPointer.position().left + self.highPointer.width() / 2 : self.domNode.width();
 			}
 			var value = Math.min(Math.max(position, min), max);
 			self.setPosition(pointer, value, true);
 		},
-		setPosition: function(pointer, position, isPx, animate){
+		setPosition: function(pointer, position, isPx, animate) {
 			var leftPos,
 				lowPos = this.lowPointer.position().left,
 				highPos = this.highPointer.position().left,
 				circleWidth = this.highPointer.width() / 2;
-			if(!isPx){
+			if (!isPx) {
 				position = this.prcToPx(position);
 			}
-			if(pointer[0] === this.highPointer[0]){
-				highPos = Math.round(position  - circleWidth);
-			}else{
-                lowPos = Math.round(position  - circleWidth);
+			if (pointer[0] === this.highPointer[0]) {
+				highPos = Math.round(position - circleWidth);
+			} else {
+				lowPos = Math.round(position - circleWidth);
 			}
-            pointer[animate?'animate':'css']({'left': Math.round(position  - circleWidth)});
-			if(this.isSingle()){
+			pointer[animate ? 'animate' : 'css']({
+				'left': Math.round(position - circleWidth)
+			});
+			if (this.isSingle()) {
 				leftPos = 0;
-			}else{
+			} else {
 				leftPos = lowPos + circleWidth;
 			}
-			this.bar[animate?'animate':'css']({
-					'width' : Math.round(highPos + circleWidth - leftPos),
-					'left'	: leftPos
-				});
+			this.bar[animate ? 'animate' : 'css']({
+				'width': Math.round(highPos + circleWidth - leftPos),
+				'left': leftPos
+			});
 			this.showPointerValue(pointer, position, animate);
+			this.isReadonly();
 		},
 		// will be called from outside
-		setValue: function(value){
+		setValue: function(value) {
 			var values = value.toString().split(',');
 			this.options.value = value;
-			var prc = this.valuesToPrc( values.length === 2 ? values : [0, values[0]] );
-			if(this.isSingle()){
+			var prc = this.valuesToPrc(values.length === 2 ? values : [0, values[0]]);
+			if (this.isSingle()) {
 				this.setPosition(this.highPointer, prc[1]);
-			}else{
+			} else {
 				this.setPosition(this.lowPointer, prc[0]);
 				this.setPosition(this.highPointer, prc[1]);
 			}
 		},
-		renderScale: function(){
+		renderScale: function() {
 			var s = this.options.scale || [this.options.from, this.options.to];
 			var prc = Math.round((100 / (s.length - 1)) * 10) / 10;
 			var str = '';
-			for(var i = 0; i < s.length ; i++ ){
+			for (var i = 0; i < s.length; i++) {
 				str += '<span style="left: ' + i * prc + '%">' + (s[i] != '|' ? '<ins>' + s[i] + '</ins>' : '') + '</span>';
 			}
 			this.scale.html(str);
 
-			$('ins', this.scale).each(function () {
+			$('ins', this.scale).each(function() {
 				$(this).css({
 					marginLeft: -$(this).outerWidth() / 2
 				});
 			});
 		},
-		getBarWidth: function(){
+		getBarWidth: function() {
 			var values = this.options.value.split(',');
-			if(values.length > 1){
+			if (values.length > 1) {
 				return parseInt(values[1], 10) - parseInt(values[0], 10);
-			}else{
+			} else {
 				return parseInt(values[0], 10);
 			}
 		},
-		showPointerValue: function(pointer, position, animate){
-			var label = $('.pointer-label', this.domNode)[pointer.hasClass('low')?'first':'last']();
+		showPointerValue: function(pointer, position, animate) {
+			var label = $('.pointer-label', this.domNode)[pointer.hasClass('low') ? 'first' : 'last']();
 			var text;
 			var value = this.positionToValue(position);
-			if($.isFunction(this.options.format)){
-                var type = this.isSingle() ? undefined : (pointer.hasClass('low') ? 'low':'high');
-                text = this.options.format(value, type);
-			}else{
+			if ($.isFunction(this.options.format)) {
+				var type = this.isSingle() ? undefined : (pointer.hasClass('low') ? 'low' : 'high');
+				text = this.options.format(value, type);
+			} else {
 				text = this.options.format.replace('%s', value);
 			}
 
 			var width = label.html(text).width(),
 				left = position - width / 2;
 			left = Math.min(Math.max(left, 0), this.options.width - width);
-			label[animate?'animate':'css']({left: left});
+			label[animate ? 'animate' : 'css']({
+				left: left
+			});
 			this.setInputValue(pointer, value);
 		},
-		valuesToPrc: function(values){
-			var lowPrc = ( ( values[0] - this.options.from ) * 100 / this.interval ),
-				highPrc = ( ( values[1] - this.options.from ) * 100 / this.interval );
+		valuesToPrc: function(values) {
+			var lowPrc = ((values[0] - this.options.from) * 100 / this.interval),
+				highPrc = ((values[1] - this.options.from) * 100 / this.interval);
 			return [lowPrc, highPrc];
 		},
-		prcToPx: function(prc){
+		prcToPx: function(prc) {
 			return (this.domNode.width() * prc) / 100;
 		},
-		positionToValue: function(pos){
+		positionToValue: function(pos) {
 			var value = (pos / this.domNode.width()) * this.interval;
 			value = value + this.options.from;
-			return  Math.round(value / this.options.step) * this.options.step;
+			return Math.round(value / this.options.step) * this.options.step;
 		},
-		setInputValue: function(pointer, v){
+		setInputValue: function(pointer, v) {
 			// if(!isChanged) return;
-			if(this.isSingle()){
+			if (this.isSingle()) {
 				this.options.value = v.toString();
-			}else{
+			} else {
 				var values = this.options.value.split(',');
-				if(pointer.hasClass('low')){
+				if (pointer.hasClass('low')) {
 					this.options.value = v + ',' + values[1];
-				}else{
+				} else {
 					this.options.value = values[0] + ',' + v;
 				}
 			}
-			if( this.inputNode.val() !== this.options.value ){
+			if (this.inputNode.val() !== this.options.value) {
 				this.inputNode.val(this.options.value);
 				this.options.onstatechange.call(this, this.options.value);
 			}
 		},
-        getValue: function(){
-            return this.options.value;
-        }
+		getValue: function() {
+			return this.options.value;
+		},
+		isReadonly: function(){
+			this.domNode.toggleClass('slider-readonly', this.options.disable);
+		},
+		disable: function(){
+			this.options.disable = true;
+			this.isReadonly();
+		},
+		enable: function(){
+			this.options.disable = false;
+			this.isReadonly();
+		},
+		toggleDisable: function(){
+			this.options.disable = !this.options.disable;
+			this.isReadonly();
+		}
 	};
 
 	/*$.jRange = function (node, options) {
@@ -275,7 +307,7 @@
 	// preventing against multiple instantiations
 	$.fn[pluginName] = function(option) {
 		var args = arguments,
-				result;
+			result;
 
 		this.each(function() {
 			var $this = $(this),
@@ -283,7 +315,9 @@
 				options = typeof option === 'object' && option;
 			if (!data) {
 				$this.data('plugin_' + pluginName, (data = new jRange(this, options)));
-				$(window).resize(function() { data.setValue(data.getValue()); }); // Update slider position when window is resized to keep it in sync with scale
+				$(window).resize(function() {
+					data.setValue(data.getValue());
+				}); // Update slider position when window is resized to keep it in sync with scale
 			}
 			// if first argument is a string, call silimarly named function
 			// this gives flexibility to call functions of the plugin e.g.
@@ -298,4 +332,4 @@
 		return result || this;
 	};
 
-})(jQuery, window, document);
+})(jQuery, window, document);
\ No newline at end of file
diff --git a/library/jRange/jquery.range.less b/library/jRange/jquery.range.less
index cb6e12288..4034bdd66 100644
--- a/library/jRange/jquery.range.less
+++ b/library/jRange/jquery.range.less
@@ -70,7 +70,7 @@
             width: 10px;
             height: 10px;
             background-color: red;
-            cursor: move;
+            cursor: col-resize;
             opacity: 1;
             z-index: 2;
             &.last-active{
@@ -115,6 +115,11 @@
             line-height: 1;
         }
     }
+    &.slider-readonly{
+        .clickable-dummy, .pointer {
+            cursor: auto;
+        }
+    }
 }
 .theme-green {
     .back-bar {
@@ -136,7 +141,6 @@
             border-radius: 10px;
             border: 1px solid #AAA;
             #gradient > .vertical(#eeeeee, #dddddd);
-            cursor: col-resize;
         }
         .pointer-label {
             color: #999;
@@ -175,7 +179,6 @@
             border-radius: 10px;
             border: 1px solid #AAA;
             #gradient > .vertical(#eeeeee, #dddddd);
-            cursor: col-resize;
         }
         .pointer-label {
             color: #999;