From 2df094527ec12fe9ebec938c27661eda3e999e63 Mon Sep 17 00:00:00 2001 From: jzaefferer Date: Tue, 26 Oct 2010 12:14:45 +0200 Subject: Spinner: Changed default for numberformat to null. Fixed disabled option to not prevent changing value via step and page methods. OVerhauled testsuite. --- demos/spinner/decimal.html | 3 +- tests/unit/spinner/spinner.html | 1 + tests/unit/spinner/spinner_core.js | 304 +++++++-------------------------- tests/unit/spinner/spinner_defaults.js | 11 +- tests/unit/spinner/spinner_events.js | 16 +- tests/unit/spinner/spinner_methods.js | 91 ++++------ tests/unit/spinner/spinner_options.js | 119 +++++-------- ui/jquery.ui.spinner.js | 80 ++++++--- 8 files changed, 200 insertions(+), 425 deletions(-) diff --git a/demos/spinner/decimal.html b/demos/spinner/decimal.html index c47251552..ae45da1e7 100644 --- a/demos/spinner/decimal.html +++ b/demos/spinner/decimal.html @@ -17,7 +17,8 @@ + diff --git a/tests/unit/spinner/spinner_core.js b/tests/unit/spinner/spinner_core.js index 2996ad128..5a29b411a 100644 --- a/tests/unit/spinner/spinner_core.js +++ b/tests/unit/spinner/spinner_core.js @@ -2,332 +2,151 @@ * spinner_core.js */ -var el, - options, - simulateKeyDownUp = function(el, kCode, shift) { - el.simulate("keydown",{keyCode:kCode, shiftKey: shift || false }) - .simulate("keyup",{keyCode:kCode, shiftKey: shift || false }); - }, - wrapper = function() { - return el.closest('.ui-spinner'); - }, - upButton = function() { - return wrapper().find('.ui-spinner-up'); - }, - downButton = function() { - return wrapper().find('.ui-spinner-down'); - }, - box = function() { - return $('.ui-spinner-input', wrapper()); - }; +var simulateKeyDownUp = function(el, kCode, shift) { + el.simulate("keydown",{keyCode:kCode, shiftKey: shift || false }) + .simulate("keyup",{keyCode:kCode, shiftKey: shift || false }); +}; (function($) { // Spinner Tests module("spinner: core"); -test("init", function() { - expect(3); - - $("").appendTo('body').spinner().remove(); - ok(true, '.spinner() called on element'); - - $('').spinner().remove(); - ok(true, '.spinner() called on disconnected element'); - - el = $('').spinner(); - ok(el.hasClass('ui-spinner-input'), 'input gets ui-spinner-input class on init'); - -}); - test("destroy", function() { - expect(3); - - $("").appendTo('body').spinner().spinner("destroy").remove(); - ok(true, '.spinner("destroy") called on element'); - - $('').spinner().spinner("destroy").remove(); - ok(true, '.spinner().spinner("destroy") called on disconnected element'); - - el = $('').spinner().spinner('destroy'); - ok(!el.hasClass('ui-spinner-input'), 'ui-spinner-input class removed on destroy'); -}); - -test("re-attach", function() { - expect(2); - - el = $("").spinner().spinner("destroy").spinner(); - ok(true, '.spinner().spinner("destroy").spinner() called on element'); - - el = $('').spinner().spinner("destroy").spinner().remove(); - ok(true, '.spinner().spinner("destroy").spinner() called on disconnected element'); - + var beforeHtml = $("#spin").parent().html(); + var afterHtml = $("#spin").spinner().spinner("destroy").parent().html(); + // Opera 9 outputs role="" instead of removing the attribute like everyone else + /* + if ($.browser.opera) { + afterHtml = afterHtml.replace(/ role=""/g, ""); + } + */ + equal( afterHtml, beforeHtml, "before/after html should be the same" ); }); test("keydown UP on input, increases value not greater than max", function() { - expect(3); - - el = $("#spin"); - options = { + var el = $("#spin").spinner({ max:100, value:50, step:10 - } - el.spinner(options); + }); simulateKeyDownUp(el, $.ui.keyCode.UP); - equals(el.val(), 60); for (i = 0; i<11; i++) { simulateKeyDownUp(el, $.ui.keyCode.UP); } - equals(el.val(), 100); el.val(50); - simulateKeyDownUp(el, $.ui.keyCode.UP); - equals(el.val(), 60); }); test("keydown DOWN on input, decreases value not less than min", function() { - expect(3); - - el = $("#spin"); - options = { + var el = $("#spin").spinner({ min:-100, value:50, step:10 - } - el.spinner(options); + }); simulateKeyDownUp(el, $.ui.keyCode.DOWN); - equals(el.val(), 40); for (i = 0; i<21; i++) { simulateKeyDownUp(el, $.ui.keyCode.DOWN); } - equals(el.val(), -100); el.val(50); - simulateKeyDownUp(el, $.ui.keyCode.DOWN); - equals(el.val(), 40); - }); test("keydown PGUP on input, increases value not greater than max", function() { - expect(3); + var el = $("#spin").spinner({ + max: 500, + value: 0, + step: 10 + }); - el = $("#spin"); - options = { - max:100, - value:0, - step:10 - } - el.spinner(options); - simulateKeyDownUp(el, $.ui.keyCode.PAGE_UP); - - equals(el.val(), 50); + equal(el.val(), 100); for (i = 0; i<5; i++) { simulateKeyDownUp(el, $.ui.keyCode.PAGE_UP); } + equal(el.val(), 500); - equals(el.val(), 100); - el.val(0); - simulateKeyDownUp(el, $.ui.keyCode.PAGE_UP); - - equals(el.val(), 50); + equals(el.val(), 100); }); test("keydown PGDN on input, decreases value not less than min", function() { - expect(3); - - el = $("#spin"); - options = { - min:-100, + var el = $("#spin").spinner({ + min:-500, value:0, step:10 - } - el.spinner(options); + }); simulateKeyDownUp(el, $.ui.keyCode.PAGE_DOWN); - - equals(el.val(), -50); + equals(el.val(), -100); for (i = 0; i<5; i++) { simulateKeyDownUp(el, $.ui.keyCode.PAGE_DOWN); } - - equals(el.val(), -100); + equals(el.val(), -500); el.val(0); - simulateKeyDownUp(el, $.ui.keyCode.PAGE_DOWN); - - equals(el.val(), -50); -}); - -test("hold SHIFT and keydown UP, increments value but no greater than max", function() { - expect(2); - - el = $("#spin"); - options = { - max:100, - value:0, - step:10 - } - el.spinner(options); - - simulateKeyDownUp(el, $.ui.keyCode.UP, true); - - equals(el.val(), 50); - - for (i = 0; i<5; i++) { - simulateKeyDownUp(el, $.ui.keyCode.UP, true); - } - - equals(el.val(), 100); -}); - -test("hold SHIFT and keydown DOWN, decreases value but no less than min", function() { - expect(2); - - el = $("#spin"); - options = { - min:-100, - value:0, - step:10 - } - el.spinner(options); - - simulateKeyDownUp(el, $.ui.keyCode.DOWN, true); - - equals(el.val(), -50); - - for (i = 0; i<5; i++) { - simulateKeyDownUp(el, $.ui.keyCode.DOWN, true); - } - - equals(el.val(), -100); -}); - -test("keydown HOME on input, sets value to minimum", function() { - el = $("#spin"); - options = { - min:-100, - value:50, - step:10 - } - el.spinner(options); - - simulateKeyDownUp(el, $.ui.keyCode.HOME); equals(el.val(), -100); - - el.spinner('option', 'min', -200); - - simulateKeyDownUp(el, $.ui.keyCode.HOME); - - equals(el.val(), -200); -}); - -test("keydown END on input, sets value to maximum", function() { - el = $("#spin"); - options = { - max:100, - value:50, - step:10 - } - el.spinner(options); - - simulateKeyDownUp(el, $.ui.keyCode.END); - equals(el.val(), 100); - - el.spinner('option', 'max', 200); - - simulateKeyDownUp(el, $.ui.keyCode.END); - - equals(el.val(), 200); -}); - -test("keydown LEFT on input has no effect", function() { - el = $("#spin"); - el.spinner(); - var value = el.val(); - - simulateKeyDownUp(el, $.ui.keyCode.LEFT); - equals(el.val(), value); - - for (i = 0; i<5; i++) { - simulateKeyDownUp(el, $.ui.keyCode.LEFT); - } - - equals(el.val(), value); -}); - -test("keydown RIGHT on input has no effect", function() { - expect(2); - - el = $("#spin"); - el.spinner(); - var value = el.val(); - - simulateKeyDownUp(el, $.ui.keyCode.RIGHT); - equals(el.val(), value); - - for (i = 0; i<5; i++) { - simulateKeyDownUp(el, $.ui.keyCode.RIGHT); - } - - equals(el.val(), value); }); test("mouse click on buttons", function() { - expect(4); - - el = $("#spin").spinner(); - val = 0; + var el = $("#spin").spinner(), + val = 0; $(".ui-spinner-up").trigger("mousedown").trigger("mouseup"); - equals(el.val(), ++val, "mouse click to up"); $(".ui-spinner-down").trigger("mousedown").trigger("mouseup"); - equals(el.val(), --val, "mouse click to down"); el.val(50); - $(".ui-spinner-up").trigger("mousedown").trigger("mouseup"); - equals(el.val(), 51); el.val(50); - $(".ui-spinner-down").trigger("mousedown").trigger("mouseup"); - equals(el.val(), 49); - }); test("mouse wheel on input", function() { - ok(false, 'missing test - untested code is broken code'); + expect(3); + + var el = $("#spin").spinner(); + el.trigger("mousewheel", 1); + equal(el.val(), 1); + + // mousewheel handler uses a timeout, need to accomodate that + stop(); + setTimeout(function() { + el.trigger("mousewheel", -1); + equal(el.val(), 0); + + setTimeout(function() { + el.trigger("mousewheel", -1); + equal(el.val(), -1); + start(); + }, 100); + }, 100); + }); test("reading HTML5 attributes", function() { - expect(4); - - el = $('').spinner(); - + var el = $('').spinner(); equals(el.spinner('option', 'value'), 5, 'value'); equals(el.spinner('option', 'max'), 100, 'max'); equals(el.spinner('option', 'min'), -100, 'min'); @@ -335,23 +154,22 @@ test("reading HTML5 attributes", function() { }); test("ARIA attributes", function() { - expect(7); - - el = $('#spin').spinner({ min: -5, max: 5, value: 2 }); + var el = $('#spin').spinner({ min: -5, max: 5, value: 2 }), + wrapper = el.spinner("widget"); - equals(wrapper().attr('role'), 'spinbutton', 'role'); - equals(wrapper().attr('aria-valuemin'), -5, 'aria-valuemin'); - equals(wrapper().attr('aria-valuemax'), 5, 'aria-valuemax'); - equals(wrapper().attr('aria-valuenow'), 2, 'aria-valuenow'); + equals(wrapper.attr('role'), 'spinbutton', 'role'); + equals(wrapper.attr('aria-valuemin'), -5, 'aria-valuemin'); + equals(wrapper.attr('aria-valuemax'), 5, 'aria-valuemax'); + equals(wrapper.attr('aria-valuenow'), 2, 'aria-valuenow'); el.spinner('stepUp'); - equals(wrapper().attr('aria-valuenow'), 3, 'stepUp 1 step changes aria-valuenow'); + equals(wrapper.attr('aria-valuenow'), 3, 'stepUp 1 step changes aria-valuenow'); el.spinner('option', { min: -10, max: 10 }); - equals(wrapper().attr('aria-valuemin'), -10, 'min option changed aria-valuemin changes'); - equals(wrapper().attr('aria-valuemax'), 10, 'max option changed aria-valuemax changes'); + equals(wrapper.attr('aria-valuemin'), -10, 'min option changed aria-valuemin changes'); + equals(wrapper.attr('aria-valuemax'), 10, 'max option changed aria-valuemax changes'); }); })(jQuery); diff --git a/tests/unit/spinner/spinner_defaults.js b/tests/unit/spinner/spinner_defaults.js index aa88fd649..0b3368c00 100644 --- a/tests/unit/spinner/spinner_defaults.js +++ b/tests/unit/spinner/spinner_defaults.js @@ -3,15 +3,12 @@ */ var spinner_defaults = { - dir: 'ltr', disabled: false, incremental: true, - max: null, - min: null, - mouseWheel: true, - numberformat: "n", - page: 5, - step: null, + max: Number.MAX_VALUE, + min: -Number.MAX_VALUE, + numberformat: null, + step: 1, value: null }; diff --git a/tests/unit/spinner/spinner_events.js b/tests/unit/spinner/spinner_events.js index ae80801e6..1a006a3dc 100644 --- a/tests/unit/spinner/spinner_events.js +++ b/tests/unit/spinner/spinner_events.js @@ -6,11 +6,9 @@ module("spinner: events"); test("start", function() { - expect(1); - var start = 0; - el = $("#spin").spinner({ + var el = $("#spin").spinner({ start: function(){ start++; } @@ -22,11 +20,9 @@ test("start", function() { }); test("spin", function() { - expect(1); - var spin = 0; - el = $("#spin").spinner({ + var el = $("#spin").spinner({ spin: function(){ spin++; } @@ -38,11 +34,9 @@ test("spin", function() { }); test("stop", function() { - expect(1); - var stop = 0; - el = $("#spin").spinner({ + var el = $("#spin").spinner({ stop: function(){ stop++; } @@ -54,11 +48,9 @@ test("stop", function() { }); test("change", function() { - expect(1); - var start = spin = stop = change = 0; - el = $("#spin").spinner({ + var el = $("#spin").spinner({ change: function(){ change++; } diff --git a/tests/unit/spinner/spinner_methods.js b/tests/unit/spinner/spinner_methods.js index faeab75f3..fb58edbdf 100644 --- a/tests/unit/spinner/spinner_methods.js +++ b/tests/unit/spinner/spinner_methods.js @@ -6,17 +6,16 @@ module("spinner: methods"); test("disable", function() { - expect(14); - - el = $("#spin").spinner({ disabled: false }); - var val = el.val(); + var el = $("#spin").spinner({ disabled: false }), + val = el.val(), + wrapper = $("#spin").spinner("widget"); - ok(!wrapper().hasClass(".ui-spinner-disabled"), "before: wrapper does not have ui-spinner-disabled class"); - ok(!box().is(':disabled'), "before: input does not have disabled attribute"); + ok(!wrapper.hasClass("ui-spinner-disabled"), "before: wrapper does not have ui-spinner-disabled class"); + ok(!el.is(':disabled'), "before: input does not have disabled attribute"); el.spinner("disable"); - ok(wrapper().hasClass(".ui-spinner-disabled"), "after: wrapper has ui-spinner-disabled class"); - ok(box().is(':disabled'), "after: input has disabled attribute"); + ok(wrapper.hasClass("ui-spinner-disabled"), "after: wrapper has ui-spinner-disabled class"); + ok(el.is(':disabled'), "after: input has disabled attribute"); simulateKeyDownUp(el, $.ui.keyCode.UP); equals(val, el.val(), "keyboard - value does not change on key UP"); @@ -30,10 +29,10 @@ test("disable", function() { simulateKeyDownUp(el, $.ui.keyCode.PAGE_DOWN); equals(val, el.val(), "keyboard - value does not change on key PGDN"); - upButton().trigger('mousedown').trigger('mouseup'); + wrapper.find(":ui-button").first().trigger('mousedown').trigger('mouseup'); equals(val, el.val(), "mouse - value does not change on clicking up button"); - downButton().trigger('mousedown').trigger('mouseup'); + wrapper.find(":ui-button").last().trigger('mousedown').trigger('mouseup'); equals(val, el.val(), "mouse - value does not change on clicking down button"); el.spinner('stepUp', 6); @@ -43,7 +42,7 @@ test("disable", function() { equals(5, el.val(), "script - stepDown 1 step changes value"); el.spinner('pageUp'); - equals(10, el.val(), "script - pageUp 1 page changes value"); + equals(15, el.val(), "script - pageUp 1 page changes value"); el.spinner('pageDown'); equals(5, el.val(), "script - pageDown 1 page changes value"); @@ -51,61 +50,31 @@ test("disable", function() { }); test("enable", function() { - expect(14); + var el = $("#spin").spinner({ disabled: true }) + val = el.val(), + wrapper = el.spinner("widget"); - el = $("#spin").spinner({ disabled: true }); - var val = el.val(); - - ok(wrapper().hasClass(".ui-spinner-disabled"), "before: wrapper has ui-spinner-disabled class"); - ok(box().is(':disabled'), "before: input has disabled attribute"); + ok(wrapper.hasClass("ui-spinner-disabled"), "before: wrapper has ui-spinner-disabled class"); + ok(el.is(':disabled'), "before: input has disabled attribute"); el.spinner("enable"); - ok(!wrapper().hasClass(".ui-spinner-disabled"), "after: wrapper does not have ui-spinner-disabled class"); - ok(!box().is(':disabled'), "after: input does not have disabled attribute"); - - simulateKeyDownUp(el, $.ui.keyCode.UP); - equals(1, el.val(), "keyboard - value changes on key UP"); - - simulateKeyDownUp(el, $.ui.keyCode.DOWN); - equals(0, el.val(), "keyboard - value changes on key DOWN"); - - simulateKeyDownUp(el, $.ui.keyCode.PAGE_UP); - equals(5, el.val(), "keyboard - value changes on key PGUP"); - - simulateKeyDownUp(el, $.ui.keyCode.PAGE_DOWN); - equals(0, el.val(), "keyboard - value changes on key PGDN"); - - upButton().trigger('mousedown').trigger('mouseup'); - equals(1, el.val(), "mouse - value changes on clicking up button"); - - downButton().trigger('mousedown').trigger('mouseup'); - equals(0, el.val(), "mouse - value changes on clicking down button"); - - el.spinner('stepUp', 6); - equals(6, el.val(), "script - stepUp 6 steps changes value"); - - el.spinner('stepDown'); - equals(5, el.val(), "script - stepDown 1 step changes value"); - - el.spinner('pageUp'); - equals(10, el.val(), "script - pageUp 1 page changes value"); - - el.spinner('pageDown'); - equals(5, el.val(), "script - pageDown 1 page changes value"); - + ok(!wrapper.hasClass(".ui-spinner-disabled"), "after: wrapper does not have ui-spinner-disabled class"); + ok(!el.is(':disabled'), "after: input does not have disabled attribute"); }); test("pageDown", function() { - expect(4); - - el = $('#spin').spinner({ step: 2, page: 5, value: 0, min: -100 }); + var el = $('#spin').spinner({ + step: 2, + value: 0, + min: -100 + }); el.spinner('pageDown'); - equals(el.val(), -10, "pageDown 1 page"); + equals(el.val(), -20, "pageDown 1 page"); el.spinner('pageDown', 3); - equals(el.val(), -40, "pageDown 3 pages"); + equals(el.val(), -80, "pageDown 3 pages"); el.val(-91).spinner('pageDown'); equals(el.val(), -100, "value close to min and pageDown 1 page"); @@ -115,15 +84,17 @@ test("pageDown", function() { }); test("pageUp", function() { - expect(4); - - el = $('#spin').spinner({ step: 2, page: 5, value: 0, max: 100 }); + var el = $('#spin').spinner({ + step: 2, + value: 0, + max: 100 + }); el.spinner('pageUp'); - equals(el.val(), 10, "pageUp 1 page"); + equals(el.val(), 20, "pageUp 1 page"); el.spinner('pageUp', 3); - equals(el.val(), 40, "pageUp 3 pages"); + equals(el.val(), 80, "pageUp 3 pages"); el.val(91).spinner('pageUp'); equals(el.val(), 100, "value close to max and pageUp 1 page"); diff --git a/tests/unit/spinner/spinner_options.js b/tests/unit/spinner/spinner_options.js index 48fea3203..3db7e5c55 100644 --- a/tests/unit/spinner/spinner_options.js +++ b/tests/unit/spinner/spinner_options.js @@ -5,36 +5,33 @@ module("spinner: options"); -test("numberformat", function() { - ok( false, "tests for numberformat!"); +test("numberformat, number", function() { + var el = $("#spin").spinner({ + value: "1", + numberformat: "n" + }); + equal(el.val(), "1.00"); }); -test("dir - left-to-right (default)", function() { - expect(3); - - el = $("#spin"); - el.spinner(); - - ok(upButton().position().left > box().position().left, 'input on left up button on right'); - ok(downButton().position().left > box().position().left, 'input on left down button on right'); - ok(wrapper().hasClass('ui-spinner-ltr'), 'container has correct text direction class setting'); +test("numberformat, number, simple", function() { + var el = $("#spin").spinner({ + value: "1", + numberformat: "n0" + }); + equal(el.val(), "1"); }); -test("dir - right-to-left", function() { - expect(3); - - el = $("#spin"); - el.spinner({ dir: 'rtl' }); - - ok(upButton().position().left < box().position().left, 'input on right up button on left'); - ok(downButton().position().left < box().position().left, 'input on right down button on left'); - ok(wrapper().hasClass('ui-spinner-rtl'), 'container has correct text direction class setting'); +test("numberformat, currency", function() { + var el = $("#spin").spinner({ + value: "1", + numberformat: "C" + }); + equal(el.val(), "$1.00"); }); +/* TODO figure out how to test this properly test("incremental - false (default)", function() { - expect(2); - - el = $("#spin").spinner({ incremental:false }); + var el = $("#spin").spinner({ incremental:false }); for ( var i = 1 ; i<=120 ; i++ ) { el.simulate("keydown",{keyCode:$.ui.keyCode.UP}); @@ -51,10 +48,8 @@ test("incremental - false (default)", function() { equals(el.val(), -90, "incremental false - keydown 210 times"); }); -test("incremental - true", function() { - expect(2); - - el.spinner('option', 'incremental', true ); +test("incremental - true (default)", function() { + var el = $("#spin").spinner(); for ( var i = 1 ; i<=120 ; i++ ) { el.simulate("keydown",{keyCode:$.ui.keyCode.UP}); @@ -70,11 +65,10 @@ test("incremental - true", function() { equals(el.val(), -1800, "incremental true - keydown 210 times (300-100-100*10-10*100)"); }); +*/ test("max", function() { - expect(3); - - el = $("#spin").spinner({ max: 100, value: 1000 }); + var el = $("#spin").spinner({ max: 100, value: 1000 }); equals(el.val(), 100, "max constrained if value option is greater"); el.spinner('value', 1000); @@ -85,9 +79,7 @@ test("max", function() { }); test("min", function() { - expect(3); - - el = $("#spin").spinner({ min: -100, value: -1000 }); + var el = $("#spin").spinner({ min: -100, value: -1000 }); equals(el.val(), -100, "min constrained if value option is greater"); el.spinner('value', -1000); @@ -97,53 +89,14 @@ test("min", function() { equals(el.val(), -100, "min constrained if manual entry"); }); -test("mouseWheel", function() { - ok(false, 'missing test - untested code is broken code'); -}); - -test("page", function() { - expect(3); - - el = $("#spin").spinner({ step: 2, page:2.5 }); - - equals(el.val(), "0", "start number"); - - simulateKeyDownUp(el, $.ui.keyCode.PAGE_DOWN); - - equals(el.val(), "-5", "PAGE_DOWN on spinner once"); - - for ( var i = 1 ; i<=11 ; i++ ) { - simulateKeyDownUp(el, $.ui.keyCode.PAGE_UP); - } - - equals(el.val(), "50", "PAGE_UP 11 times on spinner"); -}); - -test("step", function() { - expect(7); - - el = $("#spin").spinner({ step:0.7 }); - equals(el.val(), "0.0", "value initialized to"); - - simulateKeyDownUp(el, $.ui.keyCode.DOWN); - equals(el.val(), "-0.7", "DOWN 1 time with step: 0.7"); - - for ( var i = 0 ; i < 11 ; i++ ) { - simulateKeyDownUp(el, $.ui.keyCode.UP); - } - equals(el.val(), "7.0", "UP 11 times with step: 0.7"); - - el.spinner('option', 'step', 1); - for ( var i = 0 ; i < 3 ; i++ ) { - simulateKeyDownUp(el, $.ui.keyCode.UP); - } - equals(el.val(), "10.0", "UP 3 times with step: 1"); +test("step, 2", function() { + var el = $("#spin").spinner({ step: 2 }); + equals(el.val(), "0", "value initialized to"); - el.spinner('option', 'step', 2); for ( var i = 0 ; i < 5 ; i++ ) { simulateKeyDownUp(el, $.ui.keyCode.UP); } - equals(el.val(), "20.0", "UP 5 times with step: 2"); + equals(el.val(), "10", "UP 5 times with step: 2"); el.spinner('value', '10.5'); equals(el.val(), "10.5", "value reset to"); @@ -153,8 +106,22 @@ test("step", function() { simulateKeyDownUp(el, $.ui.keyCode.UP); } equals(el.val(), "20.5", "UP 5 times with step: 2"); +}); +test("step, 0.7", function() { + var el = $("#spin").spinner({ + step: 0.7, + numberformat: "n1" + }); + equals(el.val(), "0.0", "value initialized to"); + + simulateKeyDownUp(el, $.ui.keyCode.DOWN); + equals(el.val(), "-0.7", "DOWN 1 time with step: 0.7"); + for ( var i = 0 ; i < 11 ; i++ ) { + simulateKeyDownUp(el, $.ui.keyCode.UP); + } + equals(el.val(), "7.0", "UP 11 times with step: 0.7"); }); test("value, default, specified in markup", function() { diff --git a/ui/jquery.ui.spinner.js b/ui/jquery.ui.spinner.js index 2c2da22d1..09d056f50 100644 --- a/ui/jquery.ui.spinner.js +++ b/ui/jquery.ui.spinner.js @@ -24,13 +24,27 @@ $.widget('ui.spinner', { incremental: true, max: Number.MAX_VALUE, min: -Number.MAX_VALUE, - numberformat: "n", + numberformat: null, step: 1, value: null }, - _create: function() { - this.value(this.options.value !== null ? this.options.value : this.element.val()); + _create: function() { + // html5 attributes initalization + // TODO refactor + var min = this.element.attr("min"); + if (typeof min == "string" && min.length > 0) { + this.options.min = this._parse(min); + } + var max = this.element.attr("max"); + if (typeof max == "string" && max.length > 0) { + this.options.max = this._parse(max); + } + var step = this.element.attr("step"); + if (typeof step == "string" && step.length > 0) { + this.options.step = this._parse(step); + } + this.value(this.options.value !== null ? this.options.value : this.element.val() || 0); this._draw(); this._mousewheel(); this._aria(); @@ -39,7 +53,7 @@ $.widget('ui.spinner', { var self = this, options = self.options; - var uiSpinner = self.element + var uiSpinner = this.uiSpinner = self.element .addClass('ui-spinner-input') .attr('autocomplete', 'off') .wrap(self._uiSpinnerHtml()) @@ -65,12 +79,18 @@ $.widget('ui.spinner', { this.element .bind('keydown'+namespace, function(event) { + if (self.options.disabled) { + return; + } if (self._start(event)) { return self._keydown(event); } return true; }) .bind('keyup'+namespace, function(event) { + if (self.options.disabled) { + return; + } if (self.spinning) { self._stop(event); self._change(event); @@ -88,11 +108,6 @@ $.widget('ui.spinner', { self.focused = false; }); - // disable spinner if element was already disabled - if (options.disabled) { - this.disable(); - } - // button bindings this.buttons = uiSpinner.find('.ui-spinner-button') .attr("tabIndex", -1) @@ -103,13 +118,19 @@ $.widget('ui.spinner', { .last() .removeClass("ui-corner-all") .end() - .bind('mousedown', function(event) { + .bind('mousedown', function(event) { + if (self.options.disabled) { + return; + } if (self._start(event) === false) { return false; } self._repeat(null, $(this).hasClass('ui-spinner-up') ? 1 : -1, event); }) .bind('mouseup', function(event) { + if (self.options.disabled) { + return; + } if (self.counter == 1) { self._spin(($(this).hasClass('ui-spinner-up') ? 1 : -1) * self.options.step, event); } @@ -119,6 +140,9 @@ $.widget('ui.spinner', { } }) .bind("mouseenter", function() { + if (self.options.disabled) { + return; + } // button will add ui-state-active if mouse was down while mouseleave and kept down if ($(this).hasClass("ui-state-active")) { if (self._start(event) === false) { @@ -132,9 +156,12 @@ $.widget('ui.spinner', { self._stop(event); self._change(event); } - }) + }); - self.uiSpinner = uiSpinner; + // disable spinner if element was already disabled + if (options.disabled) { + this.disable(); + } }, _uiSpinnerHtml: function() { return ''; @@ -154,9 +181,6 @@ $.widget('ui.spinner', { return false; }, _spin: function(step, event) { - if (this.options.disabled) { - return; - } if (!this.counter) { this.counter = 1; } @@ -176,7 +200,7 @@ $.widget('ui.spinner', { _stop: function(event) { this.counter = 0; if (this.timer) { - window.clearInterval(this.timer); + window.clearTimeout(this.timer); } this.element[0].focus(); this.spinning = false; @@ -226,6 +250,9 @@ $.widget('ui.spinner', { _mousewheel: function() { var self = this; this.element.bind("mousewheel", function(event, delta) { + if (self.options.disabled) { + return; + } if (!self._start(event)) { return false; } @@ -233,12 +260,13 @@ $.widget('ui.spinner', { if (self.timeout) { window.clearTimeout(self.timeout); } + // TODO can we implement that without a timeout? self.timeout = window.setTimeout(function() { if (self.spinning) { self._stop(event); self._change(event); } - }, 50); + }, 13); event.preventDefault(); }); }, @@ -286,11 +314,13 @@ $.widget('ui.spinner', { break; case 'value': this._format(this._parse(this.options.value)); + this._aria(); break; } }, _aria: function() { - this.uiSpinner + // TODO remove check, as soon as this method doesn't get called anymore before uiSpinner is initalized + this.uiSpinner && this.uiSpinner .attr('aria-valuemin', this.options.min) .attr('aria-valuemax', this.options.max) .attr('aria-valuenow', this.value()); @@ -305,13 +335,13 @@ $.widget('ui.spinner', { var culture = Globalization.culture || Globalization.cultures['default']; val = val.replace(culture.numberFormat.currency.symbol, ""); } - val = window.Globalization ? Globalization.parseFloat(val) : +val; + val = window.Globalization && this.options.numberformat ? Globalization.parseFloat(val) : +val; } console.log("input", input, "parsed", val) return isNaN(val) ? null : val; }, _format: function(num) { - this.element.val( window.Globalization ? Globalization.format(num, this.options.numberformat) : num ); + this.element.val( window.Globalization && this.options.numberformat ? Globalization.format(num, this.options.numberformat) : num ); }, destroy: function() { @@ -331,20 +361,18 @@ $.widget('ui.spinner', { enable: function() { this.element .removeAttr('disabled') - .siblings() - .removeAttr('disabled') .parent() .removeClass('ui-spinner-disabled ui-state-disabled'); this.options.disabled = false; + this.buttons.button("enable"); }, disable: function() { this.element .attr('disabled', true) - .siblings() - .attr('disabled', true) .parent() .addClass('ui-spinner-disabled ui-state-disabled'); this.options.disabled = true; + this.buttons.button("disable"); }, stepUp: function(steps) { this._spin((steps || 1) * this.options.step, null); @@ -355,10 +383,10 @@ $.widget('ui.spinner', { return this; }, pageUp: function(pages) { - return this.stepUp((pages || 1) * this.options.page); + return this.stepUp((pages || 1) * pageModifier); }, pageDown: function(pages) { - return this.stepDown((pages || 1) * this.options.page); + return this.stepDown((pages || 1) * pageModifier); }, widget: function() { -- cgit v1.2.3