From b7bf4b4527d3e849b55274e38e62c0d893779a1a Mon Sep 17 00:00:00 2001 From: Richard Worth Date: Mon, 12 Oct 2009 10:50:38 +0000 Subject: [PATCH] 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 --- .../slider/slider_option_animate_true.html | 45 +++++++++++++++++-- ui/jquery.ui.slider.js | 34 +++++++++----- 2 files changed, 66 insertions(+), 13 deletions(-) diff --git a/tests/visual/slider/slider_option_animate_true.html b/tests/visual/slider/slider_option_animate_true.html index 40bbb55b6..dba82c083 100644 --- a/tests/visual/slider/slider_option_animate_true.html +++ b/tests/visual/slider/slider_option_animate_true.html @@ -7,17 +7,56 @@ + + + -
+
+ $("#slider1").slider({ + animate: true, + step: 10 + }); +
+ + + + +
+ +
+ $("#slider2").slider({ + animate: true, + orientation: 'vertical', + step: 5, + values: [5, 15, 35, 75] + }); +
+ + + + +
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;