Slider: Fix handle order when setting values of range slider to max

author Ablay Keldibek <atomio.ak@gmail.com>

Mon, 16 Mar 2015 09:10:23 +0000 (15:10 +0600)

committer Scott González <scott.gonzalez@gmail.com>

Wed, 18 Mar 2015 14:49:01 +0000 (10:49 -0400)
author Ablay Keldibek <atomio.ak@gmail.com>
Mon, 16 Mar 2015 09:10:23 +0000 (15:10 +0600)
committer Scott González <scott.gonzalez@gmail.com>
Wed, 18 Mar 2015 14:49:01 +0000 (10:49 -0400)
diff --git a/tests/unit/slider/slider_events.js b/tests/unit/slider/slider_events.js

index d020d8ac616885b3c0295434e2beae5ea2f42cd1..cc5546a9f6f406dd82741a1cbb938a8bfa56908f 100644 (file)
--- a/tests/unit/slider/slider_events.js
+++ b/tests/unit/slider/slider_events.js
@@ -99,7 +99,7 @@ test( "programmatic event triggers", function() {
  });
  
  test( "mouse based interaction part two: when handles overlap", function() {
-       expect( 4 );
+       expect( 6 );
  
         var element = $( "#slider1" )
                 .slider({
@@ -147,6 +147,22 @@ test( "mouse based interaction part two: when handles overlap", function() {
         });
         handles.eq( 0 ).simulate( "drag", { dx: 10 } );
  
+       element = $( "#slider1" )
+               .slider({
+                       range: true,
+                       min: 0,
+                       max: 100,
+                       values: [ 0, 50 ]
+               }),
+               handles = element.find( ".ui-slider-handle" );
+
+       element.slider( "option", { values: [ 100, 100 ] } );
+       handles.eq( 0 ).simulate( "drag", { dx: -10 } );
+       equal( element.slider( "values" )[ 0 ], 99, "setting both values of range slider to the maximum doesn't lock slider" );
+
+       element.slider( "option", { values: [ 0, 0 ] } );
+       handles.eq( 1 ).simulate( "drag", { dx: 10 } );
+       equal( element.slider( "values" )[ 1 ], 1, "setting both values of range slider to the minimum  doesn't lock slider" );
  });
  
  test( "event data", function() {
diff --git a/tests/visual/slider/range_slider.html b/tests/visual/slider/range_slider.html

new file mode 100644 (file)

index 0000000..2b041f3
--- /dev/null
+++ b/tests/visual/slider/range_slider.html
@@ -0,0 +1,47 @@
+<!DOCTYPE html>
+<html>
+<head lang="en">
+       <meta charset="UTF-8">
+       <title>jQuery UI Slider - Range slider</title>
+       <link rel="stylesheet" href="../../../themes/base/all.css">
+       <style>
+               #wrapper {
+                       font-family: Arial;
+                       width: 500px;
+                       margin: 20px auto;
+               }
+       </style>
+       <script src="../../../external/jquery/jquery.js"></script>
+       <script src="../../../ui/core.js"></script>
+       <script src="../../../ui/widget.js"></script>
+       <script src="../../../ui/mouse.js"></script>
+       <script src="../../../ui/slider.js"></script>
+</head>
+<body>
+<div id="wrapper">
+       <h1>Range Slider</h1>
+       <h3>When set both values of range slider to the maximum, slider should not lock</h3>
+       <div id="slider"></div>
+       <br>
+       <button id="set-max-values">set values to max</button>
+       <button id="set-min-values">set values to min</button>
+</div>
+
+<script>
+       var el = $( "#slider" ).slider({
+               range: true,
+               min: 0,
+               max: 100,
+               values: [ 0, 50 ]
+       });
+
+       $( "#set-max-values" ).on( "click", function() {
+               el.slider( "option", { values: [ 100, 100 ] } );
+       });
+
+       $( "#set-min-values" ).on( "click", function() {
+               el.slider( "option", { values: [ 0, 0 ] } );
+       });
+</script>
+</body>
+</html>
diff --git a/ui/slider.js b/ui/slider.js

index 094f0135d47a7a4e92c5fb7fd4eb9b6f910889e7..4ca9c60022bbe0d0b883f406e27076a564117b19 100644 (file)
--- a/ui/slider.js
+++ b/ui/slider.js
@@ -453,7 +453,9 @@ return $.widget( "ui.slider", $.ui.mouse, {
                         case "values":
                                 this._animateOff = true;
                                 this._refreshValue();
-                               for ( i = 0; i < valsLength; i += 1 ) {
+
+                               // Start from the last handle to prevent unreachable handles (#9046)
+                               for ( i = valsLength - 1; i >= 0; i-- ) {
                                         this._change( null, i );
                                 }
                                 this._animateOff = false;
author	Ablay Keldibek <atomio.ak@gmail.com>
	Mon, 16 Mar 2015 09:10:23 +0000 (15:10 +0600)
committer	Scott González <scott.gonzalez@gmail.com>
	Wed, 18 Mar 2015 14:49:01 +0000 (10:49 -0400)
tests/unit/slider/slider_events.js		patch \| blob \| history
tests/visual/slider/range_slider.html	[new file with mode: 0644]	patch \| blob
ui/slider.js		patch \| blob \| history