diff options
-rw-r--r-- | bower.json | 2 | ||||
-rw-r--r-- | demos/spinner/currency.html | 2 | ||||
-rw-r--r-- | demos/spinner/decimal.html | 2 | ||||
-rw-r--r-- | demos/spinner/default.html | 2 | ||||
-rw-r--r-- | demos/spinner/latlong.html | 2 | ||||
-rw-r--r-- | demos/spinner/overflow.html | 2 | ||||
-rw-r--r-- | demos/spinner/time.html | 2 | ||||
-rw-r--r-- | external/jquery-mousewheel/LICENSE.txt | 18 | ||||
-rw-r--r-- | external/jquery-mousewheel/jquery.mousewheel.js | 181 | ||||
-rw-r--r-- | tests/lib/helper.js | 59 | ||||
-rw-r--r-- | tests/lib/qunit.js | 23 | ||||
-rw-r--r-- | tests/lib/testIframe.js | 7 | ||||
-rw-r--r-- | tests/unit/spinner/core.js | 56 | ||||
-rw-r--r-- | tests/unit/spinner/mousewheel-wheel.html | 72 | ||||
-rw-r--r-- | ui/widgets/spinner.js | 26 |
15 files changed, 357 insertions, 99 deletions
diff --git a/bower.json b/bower.json index eec454dea..eb3187e0c 100644 --- a/bower.json +++ b/bower.json @@ -13,7 +13,7 @@ }, "devDependencies": { "jquery-color": "3.0.0", - "jquery-mousewheel": "3.1.12", + "jquery-mousewheel": "3.2.2", "jquery-simulate": "1.1.1", "qunit": "2.19.4", "requirejs": "2.1.14", diff --git a/demos/spinner/currency.html b/demos/spinner/currency.html index 4180b12e1..fa3744ba5 100644 --- a/demos/spinner/currency.html +++ b/demos/spinner/currency.html @@ -7,7 +7,7 @@ <link rel="stylesheet" href="../../themes/base/all.css"> <link rel="stylesheet" href="../demos.css"> <script src="../../external/requirejs/require.js"></script> - <script src="../bootstrap.js" data-modules="external/globalize/globalize external/globalize/globalize.culture.de-DE external/globalize/globalize.culture.ja-JP external/jquery-mousewheel/jquery.mousewheel"> + <script src="../bootstrap.js" data-modules="external/globalize/globalize external/globalize/globalize.culture.de-DE external/globalize/globalize.culture.ja-JP"> $( "#currency" ).on( "change", function() { $( "#spinner" ).spinner( "option", "culture", $( this ).val() ); }); diff --git a/demos/spinner/decimal.html b/demos/spinner/decimal.html index 0b39f2bac..af86bbbe7 100644 --- a/demos/spinner/decimal.html +++ b/demos/spinner/decimal.html @@ -7,7 +7,7 @@ <link rel="stylesheet" href="../../themes/base/all.css"> <link rel="stylesheet" href="../demos.css"> <script src="../../external/requirejs/require.js"></script> - <script src="../bootstrap.js" data-modules="external/globalize/globalize external/globalize/globalize.culture.de-DE external/globalize/globalize.culture.ja-JP external/jquery-mousewheel/jquery.mousewheel"> + <script src="../bootstrap.js" data-modules="external/globalize/globalize external/globalize/globalize.culture.de-DE external/globalize/globalize.culture.ja-JP"> $( "#spinner" ).spinner({ step: 0.01, numberFormat: "n" diff --git a/demos/spinner/default.html b/demos/spinner/default.html index 39684fb5e..2011b84ba 100644 --- a/demos/spinner/default.html +++ b/demos/spinner/default.html @@ -7,7 +7,7 @@ <link rel="stylesheet" href="../../themes/base/all.css"> <link rel="stylesheet" href="../demos.css"> <script src="../../external/requirejs/require.js"></script> - <script src="../bootstrap.js" data-modules="external/jquery-mousewheel/jquery.mousewheel"> + <script src="../bootstrap.js"> var spinner = $( "#spinner" ).spinner(); $( "#disable" ).on( "click", function() { diff --git a/demos/spinner/latlong.html b/demos/spinner/latlong.html index 0ee747eee..cdaf65f3c 100644 --- a/demos/spinner/latlong.html +++ b/demos/spinner/latlong.html @@ -8,7 +8,7 @@ <link rel="stylesheet" href="../demos.css"> <script src="https://maps.google.com/maps/api/js?sensor=false"></script> <script src="../../external/requirejs/require.js"></script> - <script src="../bootstrap.js" data-modules="external/jquery-mousewheel/jquery.mousewheel"> + <script src="../bootstrap.js"> function latlong() { return new google.maps.LatLng( $("#lat").val(), $("#lng").val() ); } diff --git a/demos/spinner/overflow.html b/demos/spinner/overflow.html index 1def62da0..76e107836 100644 --- a/demos/spinner/overflow.html +++ b/demos/spinner/overflow.html @@ -7,7 +7,7 @@ <link rel="stylesheet" href="../../themes/base/all.css"> <link rel="stylesheet" href="../demos.css"> <script src="../../external/requirejs/require.js"></script> - <script src="../bootstrap.js" data-modules="external/jquery-mousewheel/jquery.mousewheel"> + <script src="../bootstrap.js"> $( "#spinner" ).spinner({ spin: function( event, ui ) { if ( ui.value > 10 ) { diff --git a/demos/spinner/time.html b/demos/spinner/time.html index 5836784d1..c7ceb7116 100644 --- a/demos/spinner/time.html +++ b/demos/spinner/time.html @@ -7,7 +7,7 @@ <link rel="stylesheet" href="../../themes/base/all.css"> <link rel="stylesheet" href="../demos.css"> <script src="../../external/requirejs/require.js"></script> - <script src="../bootstrap.js" data-modules="external/globalize/globalize external/globalize/globalize.culture.de-DE external/jquery-mousewheel/jquery.mousewheel"> + <script src="../bootstrap.js" data-modules="external/globalize/globalize external/globalize/globalize.culture.de-DE"> $.widget( "ui.timespinner", $.ui.spinner, { options: { // seconds diff --git a/external/jquery-mousewheel/LICENSE.txt b/external/jquery-mousewheel/LICENSE.txt index ad2020df4..f56b79ae0 100644 --- a/external/jquery-mousewheel/LICENSE.txt +++ b/external/jquery-mousewheel/LICENSE.txt @@ -1,4 +1,13 @@ -Copyright (c) 2013, Brandon Aaron (http://brandon.aaron.sh) +Copyright OpenJS Foundation and other contributors, https://openjsf.org/ + +This software consists of voluntary contributions made by many +individuals. For exact contribution history, see the revision history +available at https://github.com/jquery/jquery-mousewheel + +The following license applies to all parts of this software except as +documented below: + +==== Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the @@ -18,3 +27,10 @@ NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE. + +==== + +All files located in the node_modules and external directories are +externally maintained libraries used by this software which have their +own licenses; we recommend you read them, as their terms may differ from +the terms above. diff --git a/external/jquery-mousewheel/jquery.mousewheel.js b/external/jquery-mousewheel/jquery.mousewheel.js index 6756fa610..aec55baf8 100644 --- a/external/jquery-mousewheel/jquery.mousewheel.js +++ b/external/jquery-mousewheel/jquery.mousewheel.js @@ -1,76 +1,83 @@ -/*! Copyright (c) 2013 Brandon Aaron (http://brandon.aaron.sh) - * Licensed under the MIT License (LICENSE.txt). - * - * Version: 3.1.12 - * - * Requires: jQuery 1.2.2+ +/*! + * jQuery Mousewheel 3.2.2 + * Copyright OpenJS Foundation and other contributors */ -(function (factory) { - if ( typeof define === 'function' && define.amd ) { +( function( factory ) { + "use strict"; + + if ( typeof define === "function" && define.amd ) { + // AMD. Register as an anonymous module. - define(['jquery'], factory); - } else if (typeof exports === 'object') { + define( [ "jquery" ], factory ); + } else if ( typeof exports === "object" ) { + // Node/CommonJS style for Browserify module.exports = factory; } else { + // Browser globals - factory(jQuery); + factory( jQuery ); } -}(function ($) { +} )( function( $ ) { + "use strict"; - var toFix = ['wheel', 'mousewheel', 'DOMMouseScroll', 'MozMousePixelScroll'], - toBind = ( 'onwheel' in document || document.documentMode >= 9 ) ? - ['wheel'] : ['mousewheel', 'DomMouseScroll', 'MozMousePixelScroll'], - slice = Array.prototype.slice, - nullLowestDeltaTimeout, lowestDelta; + var nullLowestDeltaTimeout, lowestDelta, + modernEvents = !!$.fn.on, + toFix = [ "wheel", "mousewheel", "DOMMouseScroll", "MozMousePixelScroll" ], + toBind = ( "onwheel" in window.document || window.document.documentMode >= 9 ) ? + [ "wheel" ] : [ "mousewheel", "DomMouseScroll", "MozMousePixelScroll" ], + slice = Array.prototype.slice; if ( $.event.fixHooks ) { for ( var i = toFix.length; i; ) { - $.event.fixHooks[ toFix[--i] ] = $.event.mouseHooks; + $.event.fixHooks[ toFix[ --i ] ] = $.event.mouseHooks; } } var special = $.event.special.mousewheel = { - version: '3.1.12', + version: "3.2.2", setup: function() { if ( this.addEventListener ) { for ( var i = toBind.length; i; ) { - this.addEventListener( toBind[--i], handler, false ); + this.addEventListener( toBind[ --i ], handler, false ); } } else { this.onmousewheel = handler; } + // Store the line height and page height for this particular element - $.data(this, 'mousewheel-line-height', special.getLineHeight(this)); - $.data(this, 'mousewheel-page-height', special.getPageHeight(this)); + $.data( this, "mousewheel-line-height", special.getLineHeight( this ) ); + $.data( this, "mousewheel-page-height", special.getPageHeight( this ) ); }, teardown: function() { if ( this.removeEventListener ) { for ( var i = toBind.length; i; ) { - this.removeEventListener( toBind[--i], handler, false ); + this.removeEventListener( toBind[ --i ], handler, false ); } } else { this.onmousewheel = null; } + // Clean up the data we added to the element - $.removeData(this, 'mousewheel-line-height'); - $.removeData(this, 'mousewheel-page-height'); + $.removeData( this, "mousewheel-line-height" ); + $.removeData( this, "mousewheel-page-height" ); }, - getLineHeight: function(elem) { - var $elem = $(elem), - $parent = $elem['offsetParent' in $.fn ? 'offsetParent' : 'parent'](); - if (!$parent.length) { - $parent = $('body'); + getLineHeight: function( elem ) { + var $elem = $( elem ), + $parent = $elem[ "offsetParent" in $.fn ? "offsetParent" : "parent" ](); + if ( !$parent.length ) { + $parent = $( "body" ); } - return parseInt($parent.css('fontSize'), 10) || parseInt($elem.css('fontSize'), 10) || 16; + return parseInt( $parent.css( "fontSize" ), 10 ) || + parseInt( $elem.css( "fontSize" ), 10 ) || 16; }, - getPageHeight: function(elem) { - return $(elem).height(); + getPageHeight: function( elem ) { + return $( elem ).height(); }, settings: { @@ -79,56 +86,68 @@ } }; - $.fn.extend({ - mousewheel: function(fn) { - return fn ? this.bind('mousewheel', fn) : this.trigger('mousewheel'); + $.fn.extend( { + mousewheel: function( fn ) { + return fn ? + this[ modernEvents ? "on" : "bind" ]( "mousewheel", fn ) : + this.trigger( "mousewheel" ); }, - unmousewheel: function(fn) { - return this.unbind('mousewheel', fn); + unmousewheel: function( fn ) { + return this[ modernEvents ? "off" : "unbind" ]( "mousewheel", fn ); } - }); + } ); - function handler(event) { + function handler( event ) { var orgEvent = event || window.event, - args = slice.call(arguments, 1), + args = slice.call( arguments, 1 ), delta = 0, deltaX = 0, deltaY = 0, - absDelta = 0, - offsetX = 0, - offsetY = 0; - event = $.event.fix(orgEvent); - event.type = 'mousewheel'; + absDelta = 0; + event = $.event.fix( orgEvent ); + event.type = "mousewheel"; // Old school scrollwheel delta - if ( 'detail' in orgEvent ) { deltaY = orgEvent.detail * -1; } - if ( 'wheelDelta' in orgEvent ) { deltaY = orgEvent.wheelDelta; } - if ( 'wheelDeltaY' in orgEvent ) { deltaY = orgEvent.wheelDeltaY; } - if ( 'wheelDeltaX' in orgEvent ) { deltaX = orgEvent.wheelDeltaX * -1; } + if ( "detail" in orgEvent ) { + deltaY = orgEvent.detail * -1; + } + if ( "wheelDelta" in orgEvent ) { + deltaY = orgEvent.wheelDelta; + } + if ( "wheelDeltaY" in orgEvent ) { + deltaY = orgEvent.wheelDeltaY; + } + if ( "wheelDeltaX" in orgEvent ) { + deltaX = orgEvent.wheelDeltaX * -1; + } // Firefox < 17 horizontal scrolling related to DOMMouseScroll event - if ( 'axis' in orgEvent && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) { + if ( "axis" in orgEvent && orgEvent.axis === orgEvent.HORIZONTAL_AXIS ) { deltaX = deltaY * -1; deltaY = 0; } - // Set delta to be deltaY or deltaX if deltaY is 0 for backwards compatabilitiy + // Set delta to be deltaY or deltaX if deltaY is 0 for backwards compatability delta = deltaY === 0 ? deltaX : deltaY; // New school wheel delta (wheel event) - if ( 'deltaY' in orgEvent ) { + if ( "deltaY" in orgEvent ) { deltaY = orgEvent.deltaY * -1; delta = deltaY; } - if ( 'deltaX' in orgEvent ) { + if ( "deltaX" in orgEvent ) { deltaX = orgEvent.deltaX; - if ( deltaY === 0 ) { delta = deltaX * -1; } + if ( deltaY === 0 ) { + delta = deltaX * -1; + } } // No change actually happened, no reason to go any further - if ( deltaY === 0 && deltaX === 0 ) { return; } + if ( deltaY === 0 && deltaX === 0 ) { + return; + } // Need to convert lines and pages to pixels if we aren't already in pixels // There are three delta modes: @@ -136,31 +155,32 @@ // * deltaMode 1 is by lines // * deltaMode 2 is by pages if ( orgEvent.deltaMode === 1 ) { - var lineHeight = $.data(this, 'mousewheel-line-height'); + var lineHeight = $.data( this, "mousewheel-line-height" ); delta *= lineHeight; deltaY *= lineHeight; deltaX *= lineHeight; } else if ( orgEvent.deltaMode === 2 ) { - var pageHeight = $.data(this, 'mousewheel-page-height'); + var pageHeight = $.data( this, "mousewheel-page-height" ); delta *= pageHeight; deltaY *= pageHeight; deltaX *= pageHeight; } // Store lowest absolute delta to normalize the delta values - absDelta = Math.max( Math.abs(deltaY), Math.abs(deltaX) ); + absDelta = Math.max( Math.abs( deltaY ), Math.abs( deltaX ) ); if ( !lowestDelta || absDelta < lowestDelta ) { lowestDelta = absDelta; // Adjust older deltas if necessary - if ( shouldAdjustOldDeltas(orgEvent, absDelta) ) { + if ( shouldAdjustOldDeltas( orgEvent, absDelta ) ) { lowestDelta /= 40; } } // Adjust older deltas if necessary - if ( shouldAdjustOldDeltas(orgEvent, absDelta) ) { + if ( shouldAdjustOldDeltas( orgEvent, absDelta ) ) { + // Divide all the things by 40! delta /= 40; deltaX /= 40; @@ -168,54 +188,55 @@ } // Get a whole, normalized value for the deltas - delta = Math[ delta >= 1 ? 'floor' : 'ceil' ](delta / lowestDelta); - deltaX = Math[ deltaX >= 1 ? 'floor' : 'ceil' ](deltaX / lowestDelta); - deltaY = Math[ deltaY >= 1 ? 'floor' : 'ceil' ](deltaY / lowestDelta); + delta = Math[ delta >= 1 ? "floor" : "ceil" ]( delta / lowestDelta ); + deltaX = Math[ deltaX >= 1 ? "floor" : "ceil" ]( deltaX / lowestDelta ); + deltaY = Math[ deltaY >= 1 ? "floor" : "ceil" ]( deltaY / lowestDelta ); // Normalise offsetX and offsetY properties if ( special.settings.normalizeOffset && this.getBoundingClientRect ) { var boundingRect = this.getBoundingClientRect(); - offsetX = event.clientX - boundingRect.left; - offsetY = event.clientY - boundingRect.top; + event.offsetX = event.clientX - boundingRect.left; + event.offsetY = event.clientY - boundingRect.top; } // Add information to the event object event.deltaX = deltaX; event.deltaY = deltaY; event.deltaFactor = lowestDelta; - event.offsetX = offsetX; - event.offsetY = offsetY; + // Go ahead and set deltaMode to 0 since we converted to pixels // Although this is a little odd since we overwrite the deltaX/Y // properties with normalized deltas. event.deltaMode = 0; // Add event and delta to the front of the arguments - args.unshift(event, delta, deltaX, deltaY); + args.unshift( event, delta, deltaX, deltaY ); - // Clearout lowestDelta after sometime to better + // Clear out lowestDelta after sometime to better // handle multiple device types that give different // a different lowestDelta // Ex: trackpad = 3 and mouse wheel = 120 - if (nullLowestDeltaTimeout) { clearTimeout(nullLowestDeltaTimeout); } - nullLowestDeltaTimeout = setTimeout(nullLowestDelta, 200); + if ( nullLowestDeltaTimeout ) { + window.clearTimeout( nullLowestDeltaTimeout ); + } + nullLowestDeltaTimeout = window.setTimeout( function() { + lowestDelta = null; + }, 200 ); - return ($.event.dispatch || $.event.handle).apply(this, args); + return ( $.event.dispatch || $.event.handle ).apply( this, args ); } - function nullLowestDelta() { - lowestDelta = null; - } + function shouldAdjustOldDeltas( orgEvent, absDelta ) { - function shouldAdjustOldDeltas(orgEvent, absDelta) { - // If this is an older event and the delta is divisable by 120, + // If this is an older event and the delta is divisible by 120, // then we are assuming that the browser is treating this as an // older mouse wheel event and that we should divide the deltas // by 40 to try and get a more usable deltaFactor. // Side note, this actually impacts the reported scroll distance // in older browsers and can cause scrolling to be slower than native. // Turn this off by setting $.event.special.mousewheel.settings.adjustOldDeltas to false. - return special.settings.adjustOldDeltas && orgEvent.type === 'mousewheel' && absDelta % 120 === 0; + return special.settings.adjustOldDeltas && orgEvent.type === "mousewheel" && + absDelta % 120 === 0; } -})); +} ); diff --git a/tests/lib/helper.js b/tests/lib/helper.js index 2315c5e19..2be4c48de 100644 --- a/tests/lib/helper.js +++ b/tests/lib/helper.js @@ -51,6 +51,65 @@ exports.moduleAfterEach = function( assert ) { } }; +exports.testIframe = function( title, fileName, func, wrapper, iframeStyles ) { + if ( !wrapper ) { + wrapper = QUnit.test; + } + wrapper.call( QUnit, title, function( assert ) { + var done = assert.async(), + $iframe = jQuery( "<iframe></iframe>" ) + .css( { + position: "absolute", + top: "0", + left: "-600px", + width: "500px", + zIndex: 1, + background: "white" + } ) + .attr( { id: "qunit-fixture-iframe", src: fileName } ); + + // Add other iframe styles + if ( iframeStyles ) { + $iframe.css( iframeStyles ); + } + + // Test iframes are expected to invoke this via startIframeTest + // (cf. iframeTest.js) + window.iframeCallback = function() { + var args = Array.prototype.slice.call( arguments ); + + args.unshift( assert ); + + setTimeout( function() { + var result; + + this.iframeCallback = undefined; + + result = func.apply( this, args ); + + function finish() { + func = function() {}; + $iframe.remove(); + done(); + } + + // Wait for promises returned by `func`. + if ( result && result.then ) { + result.then( finish ); + } else { + finish(); + } + } ); + }; + + // Attach iframe to the body for visibility-dependent code. + // It will be removed by either the above code, or the testDone + // callback in qunit.js. + $iframe.prependTo( document.body ); + } ); +}; +window.iframeCallback = undefined; + return exports; } ); diff --git a/tests/lib/qunit.js b/tests/lib/qunit.js index 6441019bd..c4c96ef58 100644 --- a/tests/lib/qunit.js +++ b/tests/lib/qunit.js @@ -7,6 +7,8 @@ define( [ ], function( QUnit, $ ) { "use strict"; +var ajaxSettings = $.ajaxSettings; + QUnit.config.autostart = false; QUnit.config.requireExpects = true; @@ -34,16 +36,21 @@ QUnit.config.urlConfig.push( { label: "Enable jquery-migrate" } ); -QUnit.reset = ( function( reset ) { - return function() { +QUnit.testDone( function() { + + // Ensure jQuery events and data on the fixture are properly removed + $( "#qunit-fixture" ).empty(); - // Ensure jQuery events and data on the fixture are properly removed - $( "#qunit-fixture" ).empty(); + // Remove the iframe fixture + $( "#qunit-fixture-iframe" ).remove(); - // Let QUnit reset the fixture - reset.apply( this, arguments ); - }; -} )( QUnit.reset ); + // Reset internal $ state + if ( ajaxSettings ) { + $.ajaxSettings = $.extend( true, {}, ajaxSettings ); + } else { + delete $.ajaxSettings; + } +} ); return QUnit; diff --git a/tests/lib/testIframe.js b/tests/lib/testIframe.js new file mode 100644 index 000000000..4db56833c --- /dev/null +++ b/tests/lib/testIframe.js @@ -0,0 +1,7 @@ +window.startIframeTest = function() { + var args = Array.prototype.slice.call( arguments ); + + // Note: jQuery may be undefined if page did not load it + args.unshift( window.jQuery, window, document ); + window.parent.iframeCallback.apply( null, args ); +}; diff --git a/tests/unit/spinner/core.js b/tests/unit/spinner/core.js index e9f7bc3d2..42bcc7bb5 100644 --- a/tests/unit/spinner/core.js +++ b/tests/unit/spinner/core.js @@ -163,7 +163,47 @@ QUnit.test( "mouse click on up button, increases value not greater than max", fu assert.equal( element.val(), 0 ); } ); -QUnit.test( "mousewheel on input", function( assert ) { +QUnit.test( "wheel on input", function( assert ) { + var ready = assert.async(); + assert.expect( 5 ); + + var element = $( "#spin" ).val( 0 ).spinner( { + step: 2 + } ); + + element.simulate( "focus" ); + setTimeout( step1 ); + + function getWheelEvent( deltaY ) { + return jQuery.Event( new WheelEvent( "wheel", { deltaY: deltaY } ) ); + } + + function step1() { + element.trigger( getWheelEvent() ); + assert.equal( element.val(), 0, "wheel event without delta does not change value" ); + + element.trigger( getWheelEvent( -1 ) ); + assert.equal( element.val(), 2, "delta -1" ); + + element.trigger( getWheelEvent( 0.2 ) ); + assert.equal( element.val(), 0, "delta 0.2" ); + + element.trigger( getWheelEvent( 15 ) ); + assert.equal( element.val(), -2, "delta 15" ); + + element.simulate( "blur" ); + setTimeout( step2 ); + } + + function step2() { + element.trigger( "wheel", -1 ); + assert.equal( element.val(), -2, "wheel when not focused" ); + + ready(); + } +} ); + +QUnit.test( "mousewheel on input (DEPRECATED)", function( assert ) { var ready = assert.async(); assert.expect( 5 ); @@ -199,6 +239,20 @@ QUnit.test( "mousewheel on input", function( assert ) { } } ); +helper.testIframe( + "wheel & mousewheel conflicts", + "mousewheel-wheel.html", + function( assert, jQuery, window, document, values ) { + assert.expect( 5 ); + + assert.equal( values[ 0 ], 0, "wheel event without delta does not change value" ); + assert.equal( values[ 1 ], 2, "delta -1" ); + assert.equal( values[ 2 ], 0, "delta 0.2" ); + assert.equal( values[ 3 ], -2, "delta 15" ); + assert.equal( values[ 4 ], -2, "wheel when not focused" ); + } +); + QUnit.test( "reading HTML5 attributes", function( assert ) { assert.expect( 6 ); var markup = "<input type='number' min='-100' max='100' value='5' step='2'>", diff --git a/tests/unit/spinner/mousewheel-wheel.html b/tests/unit/spinner/mousewheel-wheel.html new file mode 100644 index 000000000..e512a36cc --- /dev/null +++ b/tests/unit/spinner/mousewheel-wheel.html @@ -0,0 +1,72 @@ +<!doctype html> +<html lang="en"> +<head> + <meta charset="utf-8"> + <title>jQuery UI Spinner Test Suite</title> + + <script src="../../../external/requirejs/require.js"></script> + <script src="../../../external/jquery/jquery.js"></script> + <script src="../../lib/css.js" data-modules="core button spinner theme"></script> + <script src="../../lib/testIframe.js"></script> +</head> +<body> + +<input id="spin" class="foo"> + +<script> + function runTest() { + var values = [], + element = $( "#spin" ).val( 0 ).spinner( { + step: 2 + } ); + + element.focus(); + setTimeout( step1 ); + + function dispatchWheelEvent( elem, deltaY ) { + elem[ 0 ].dispatchEvent( new WheelEvent( "wheel", { + deltaY: deltaY + } ) ); + } + + function step1() { + dispatchWheelEvent( element ); + values.push( element.val() ); + + dispatchWheelEvent( element, -1 ); + values.push( element.val() ); + + dispatchWheelEvent( element, 0.2 ); + values.push( element.val() ); + + dispatchWheelEvent( element, 15 ); + values.push( element.val() ); + + element.blur(); + setTimeout( step2 ); + } + + function step2() { + dispatchWheelEvent( element, -1 ); + values.push( element.val() ); + + startIframeTest( values ); + } + } + + requirejs.config( { + paths: { + "jquery-mousewheel": "../../../external/jquery-mousewheel/jquery.mousewheel", + "ui": "../../../ui" + }, + } ); + + require( [ + "jquery-mousewheel", + "ui/widgets/spinner" + ], function() { + runTest(); + } ); +</script> +</body> +</html> diff --git a/ui/widgets/spinner.js b/ui/widgets/spinner.js index d999d85d7..d4034b458 100644 --- a/ui/widgets/spinner.js +++ b/ui/widgets/spinner.js @@ -136,9 +136,10 @@ $.widget( "ui.spinner", { this._trigger( "change", event ); } }, - mousewheel: function( event, delta ) { + wheel: function( event ) { var activeElement = this.document[ 0 ].activeElement; var isActive = this.element[ 0 ] === activeElement; + var delta = event.deltaY || event.originalEvent && event.originalEvent.deltaY; if ( !isActive || !delta ) { return; @@ -148,7 +149,7 @@ $.widget( "ui.spinner", { return false; } - this._spin( ( delta > 0 ? 1 : -1 ) * this.options.step, event ); + this._spin( ( delta > 0 ? -1 : 1 ) * this.options.step, event ); clearTimeout( this.mousewheelTimer ); this.mousewheelTimer = this._delay( function() { if ( this.spinning ) { @@ -157,6 +158,27 @@ $.widget( "ui.spinner", { }, 100 ); event.preventDefault(); }, + + // DEPRECATED + // Kept for backwards compatibility. Please use the modern `wheel` + // event. The `delta` parameter is provided by the jQuery Mousewheel + // plugin if one is loaded. + mousewheel: function( event, delta ) { + if ( !event.isTrigger ) { + + // If this is not a trigger call, the `wheel` handler will + // fire as well, let's not duplicate it. + return; + } + + var wheelEvent = $.Event( event ); + wheelEvent.type = "wheel"; + if ( delta ) { + wheelEvent.deltaY = -delta; + } + return this._events.wheel.call( this, wheelEvent ); + }, + "mousedown .ui-spinner-button": function( event ) { var previous; |