Slider: Fixed animation to respond to keypress as well as mouse click, animation still does not occur at init or during mouse drag slide, both by design. Animation now occurs, if animate is on, when using the value method, but not when using the value option. This allows for animated and non-animated programmatic setting of values without changing the animate option.

Fixes #4432 - Allow animation when programmatically changing slider value
Fixes #4659 - Allow slider to animate if slider value is set programatically

1 files changed, 24 insertions, 10 deletions

diff --git a/ui/jquery.ui.slider.js b/ui/jquery.ui.slider.js
index 84dc9633c..f81403540 100644
--- a/ui/jquery.ui.slider.js
+++ b/ui/jquery.ui.slider.js
@@ -19,6 +19,7 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 
 		var self = this, o = this.options;
 		this._keySliding = false;
+		this._animateOff = true;
 		this._handleIndex = null;
 		this._detectOrientation();
 		this._mouseInit();
@@ -176,6 +177,8 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 
 		this._refreshValue();
 
+		this._animateOff = false;
+
 	},
 
 	destroy: function() {
@@ -254,6 +257,7 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 
 		normValue = this._normValueFromMouse(position);
 		this._slide(event, index, normValue);
+		this._animateOff = true;
 		return true;
 
 	},
@@ -281,6 +285,7 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 		this._handleIndex = null;
 		this._clickOffset = null;
 
+		this._animateOff = false;
 		return false;
 
 	},
@@ -356,7 +361,7 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 				});
 				var otherVal = this.values(index ? 0 : 1);
 				if (allowed !== false) {
-					this.values(index, newVal, ( event.type == 'mousedown' && this.options.animate ), true);
+					this.values(index, newVal, true);
 				}
 			}
 
@@ -369,7 +374,7 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 					value: newVal
 				});
 				if (allowed !== false) {
-					this._setData('value', newVal, ( event.type == 'mousedown' && this.options.animate ));
+					this.value(newVal);
 				}
 					
 			}
@@ -407,7 +412,8 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 		if (arguments.length) {
 			newValue = newValue >= this.options.min ? newValue : this.options.min;
 			newValue = newValue <= this.options.max ? newValue : this.options.max;
-			this._setData("value", newValue);
+			this.options.value = newValue;
+			this._refreshValue();
 			this._change(null, 0);
 		}
 
@@ -415,11 +421,11 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 
 	},
 
-	values: function(index, newValue, animated, noPropagation) {
+	values: function(index, newValue, noPropagation) {
 
 		if (arguments.length > 1) {
 			this.options.values[index] = newValue;
-			this._refreshValue(animated);
+			this._refreshValue();
 			if(!noPropagation) this._change(null, index);
 		}
 
@@ -435,7 +441,7 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 
 	},
 
-	_setData: function(key, value, animated) {
+	_setData: function(key, value) {
 
 		$.widget.prototype._setData.apply(this, arguments);
 
@@ -457,10 +463,17 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 				this.element
 					.removeClass("ui-slider-horizontal ui-slider-vertical")
 					.addClass("ui-slider-" + this.orientation);
-				this._refreshValue(animated);
+				this._refreshValue();
 				break;
 			case 'value':
-				this._refreshValue(animated);
+				this._animateOff = true;
+				this._refreshValue();
+				this._animateOff = false;
+				break;
+			case 'values':
+				this._animateOff = true;
+				this._refreshValue();
+				this._animateOff = false;
 				break;
 		}
 
@@ -506,10 +519,11 @@ $.widget("ui.slider", $.extend({}, $.ui.mouse, {
 		var valueMax = this.options.max;
 		return valueMax;
 	},
-
-	_refreshValue: function(animate) {
+	
+	_refreshValue: function() {
 
 		var oRange = this.options.range, o = this.options, self = this;
+		var animate = (!this._animateOff) ? o.animate : false;
 
 		if (this.options.values && this.options.values.length) {
 			var vp0, vp1;