mirror of
https://github.com/jquery/jquery-ui.git
synced 2025-01-07 20:34:24 +00:00
Removed spinner from trunk. See /branches/dev/spinner
This commit is contained in:
parent
29f7dc9a2c
commit
027e4d57b7
@ -66,7 +66,6 @@
|
|||||||
<script type="text/javascript" src="../../ui/ui.progressbar.js"></script>
|
<script type="text/javascript" src="../../ui/ui.progressbar.js"></script>
|
||||||
<script type="text/javascript" src="../../ui/ui.selectable.js"></script>
|
<script type="text/javascript" src="../../ui/ui.selectable.js"></script>
|
||||||
<script type="text/javascript" src="../../ui/ui.slider.js"></script>
|
<script type="text/javascript" src="../../ui/ui.slider.js"></script>
|
||||||
<script type="text/javascript" src="../../ui/ui.spinner.js"></script>
|
|
||||||
<script type="text/javascript" src="../../ui/ui.sortable.js"></script>
|
<script type="text/javascript" src="../../ui/ui.sortable.js"></script>
|
||||||
<script type="text/javascript" src="../../ui/ui.tabs.js"></script>
|
<script type="text/javascript" src="../../ui/ui.tabs.js"></script>
|
||||||
<script type="text/javascript" src="../../ui/effects.core.js"></script>
|
<script type="text/javascript" src="../../ui/effects.core.js"></script>
|
||||||
@ -221,7 +220,6 @@
|
|||||||
<li><a href="#ui.dialog" title="Goto Dialog's Component Page">Dialog</a></li>
|
<li><a href="#ui.dialog" title="Goto Dialog's Component Page">Dialog</a></li>
|
||||||
<li><a href="#ui.progressbar" title="Goto ProgressBar Component Page">Progressbar</a></li>
|
<li><a href="#ui.progressbar" title="Goto ProgressBar Component Page">Progressbar</a></li>
|
||||||
<li><a href="#ui.slider" title="Goto Slider Component Page">Slider</a></li>
|
<li><a href="#ui.slider" title="Goto Slider Component Page">Slider</a></li>
|
||||||
<li><a href="#ui.spinner" title="Goto Spinner Component Page">Spinner</a></li>
|
|
||||||
<li><a href="#ui.tabs" title="Goto Tabs Component Page">Tabs</a></li>
|
<li><a href="#ui.tabs" title="Goto Tabs Component Page">Tabs</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
</div>
|
</div>
|
||||||
|
@ -1,36 +0,0 @@
|
|||||||
<script type="text/javascript">
|
|
||||||
|
|
||||||
var model = {
|
|
||||||
|
|
||||||
renderAt: '#containerDemo',
|
|
||||||
|
|
||||||
title: 'Spinner Demos',
|
|
||||||
|
|
||||||
demos: [
|
|
||||||
|
|
||||||
{
|
|
||||||
title: 'Simple spinner',
|
|
||||||
desc: 'With few lines of code you could build a spinner. You can try more options on the fly!',
|
|
||||||
html: '<input id="spinner" type="text" />',
|
|
||||||
destroy: '$("#spinner").spinner("destroy");',
|
|
||||||
options: [
|
|
||||||
{ desc: 'Make a spinner', source: '$("#spinner").spinner();' },
|
|
||||||
{ desc: 'A spinner with min and max value', source: '$("#spinner").spinner({min:-100, max:150});' },
|
|
||||||
{ desc: 'Big stepping', source: '$("#spinner").spinner({stepping:100});' },
|
|
||||||
{ desc: 'Currency option', source: '$("#spinner").spinner({currency:"$"});' },
|
|
||||||
{ desc: 'Disable incremental option', source: '$("#spinner").spinner({incremental:false});' },
|
|
||||||
{ desc: 'Disable the spinner', source: '$("#spinner").spinner().spinner("disable");' },
|
|
||||||
{ desc: 'Enable the spinner', source: '$("#spinner").spinner().spinner("enable");' }
|
|
||||||
]
|
|
||||||
}
|
|
||||||
|
|
||||||
]
|
|
||||||
};
|
|
||||||
|
|
||||||
$(function(){
|
|
||||||
|
|
||||||
uiRenderDemo(model);
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
|
@ -16,7 +16,6 @@
|
|||||||
<script type="text/javascript" src="../ui/ui.selectable.js"></script>
|
<script type="text/javascript" src="../ui/ui.selectable.js"></script>
|
||||||
<script type="text/javascript" src="../ui/ui.slider.js"></script>
|
<script type="text/javascript" src="../ui/ui.slider.js"></script>
|
||||||
<script type="text/javascript" src="../ui/ui.sortable.js"></script>
|
<script type="text/javascript" src="../ui/ui.sortable.js"></script>
|
||||||
<script type="text/javascript" src="../ui/ui.spinner.js"></script>
|
|
||||||
<script type="text/javascript" src="../ui/ui.tabs.js"></script>
|
<script type="text/javascript" src="../ui/ui.tabs.js"></script>
|
||||||
|
|
||||||
<script type="text/javascript" src="qunit/testrunner.js"></script>
|
<script type="text/javascript" src="qunit/testrunner.js"></script>
|
||||||
@ -32,7 +31,6 @@
|
|||||||
<script type="text/javascript" src="selectable.js"></script>
|
<script type="text/javascript" src="selectable.js"></script>
|
||||||
<script type="text/javascript" src="slider.js"></script>
|
<script type="text/javascript" src="slider.js"></script>
|
||||||
<script type="text/javascript" src="sortable.js"></script>
|
<script type="text/javascript" src="sortable.js"></script>
|
||||||
<script type="text/javascript" src="spinner.js"></script>
|
|
||||||
<script type="text/javascript" src="tabs.js"></script>
|
<script type="text/javascript" src="tabs.js"></script>
|
||||||
|
|
||||||
<style type="text/css">
|
<style type="text/css">
|
||||||
@ -58,7 +56,6 @@
|
|||||||
<li><a href="selectable.html">Selectable</a></li>
|
<li><a href="selectable.html">Selectable</a></li>
|
||||||
<li><a href="slider.html">Slider</a></li>
|
<li><a href="slider.html">Slider</a></li>
|
||||||
<li><a href="sortable.html">Sortable</a></li>
|
<li><a href="sortable.html">Sortable</a></li>
|
||||||
<li><a href="spinner.html">Spinner</a></li>
|
|
||||||
<li><a href="tabs.html">Tabs</a></li>
|
<li><a href="tabs.html">Tabs</a></li>
|
||||||
</ul>
|
</ul>
|
||||||
|
|
||||||
|
@ -8,7 +8,7 @@
|
|||||||
<script type="text/javascript" src="../ui/ui.core.js"></script>
|
<script type="text/javascript" src="../ui/ui.core.js"></script>
|
||||||
|
|
||||||
<script type="text/javascript">
|
<script type="text/javascript">
|
||||||
var components = ["accordion","datepicker","dialog","draggable","progressbar","resizable","selectable","slider","sortable","spinner","tabs"];
|
var components = ["accordion","datepicker","dialog","draggable","progressbar","resizable","selectable","slider","sortable","tabs"];
|
||||||
|
|
||||||
$(function() {
|
$(function() {
|
||||||
|
|
||||||
@ -49,7 +49,6 @@
|
|||||||
<script type="text/javascript" src="../ui/ui.selectable.js"></script>
|
<script type="text/javascript" src="../ui/ui.selectable.js"></script>
|
||||||
<script type="text/javascript" src="../ui/ui.slider.js"></script>
|
<script type="text/javascript" src="../ui/ui.slider.js"></script>
|
||||||
<script type="text/javascript" src="../ui/ui.sortable.js"></script>
|
<script type="text/javascript" src="../ui/ui.sortable.js"></script>
|
||||||
<script type="text/javascript" src="../ui/ui.spinner.js"></script>
|
|
||||||
<script type="text/javascript" src="../ui/ui.tabs.js"></script>
|
<script type="text/javascript" src="../ui/ui.tabs.js"></script>
|
||||||
|
|
||||||
<script type="text/javascript" src="qunit/testrunner.js"></script>
|
<script type="text/javascript" src="qunit/testrunner.js"></script>
|
||||||
|
@ -1,39 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<title>jQuery UI Spinner Test Suite</title>
|
|
||||||
|
|
||||||
<link rel="stylesheet" href="qunit/testsuite.css" type="text/css" media="screen">
|
|
||||||
|
|
||||||
<script type="text/javascript" src="../jquery-1.2.6.js"></script>
|
|
||||||
<script type="text/javascript" src="../ui/ui.core.js"></script>
|
|
||||||
<script type="text/javascript" src="../ui/ui.spinner.js"></script>
|
|
||||||
|
|
||||||
<script type="text/javascript" src="qunit/testrunner.js"></script>
|
|
||||||
<script type="text/javascript" src="simulate/jquery.simulate.js"></script>
|
|
||||||
|
|
||||||
<script type="text/javascript" src="spinner.js"></script>
|
|
||||||
|
|
||||||
<style type="text/css">
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</style>
|
|
||||||
|
|
||||||
|
|
||||||
|
|
||||||
</head>
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<h1 id="header">jQuery UI Spinner Test Suite</h1>
|
|
||||||
<h2 id="banner"></h2>
|
|
||||||
<h2 id="userAgent"></h2>
|
|
||||||
|
|
||||||
<ol id="tests"></ol>
|
|
||||||
|
|
||||||
<div id="main" style="position:absolute;top:-20000px">
|
|
||||||
<input type="text" id="spin" />
|
|
||||||
</div>
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</html>
|
|
393
tests/spinner.js
393
tests/spinner.js
@ -1,393 +0,0 @@
|
|||||||
/*
|
|
||||||
* spinner unit tests
|
|
||||||
*/
|
|
||||||
(function($) {
|
|
||||||
//
|
|
||||||
// Spinner Test Helper Functions
|
|
||||||
//
|
|
||||||
|
|
||||||
var defaults = {
|
|
||||||
currency: false,
|
|
||||||
decimals: 0,
|
|
||||||
disabled: false,
|
|
||||||
format: "%",
|
|
||||||
group: "",
|
|
||||||
incremental: true,
|
|
||||||
items: null,
|
|
||||||
max: null,
|
|
||||||
min: null,
|
|
||||||
point: ".",
|
|
||||||
start: 0,
|
|
||||||
stepping: 1
|
|
||||||
};
|
|
||||||
|
|
||||||
var el;
|
|
||||||
|
|
||||||
// Spinner Tests
|
|
||||||
module("spinner");
|
|
||||||
|
|
||||||
test("init", function() {
|
|
||||||
expect(2);
|
|
||||||
|
|
||||||
$("<div></div>").appendTo('body').spinner().remove();
|
|
||||||
ok(true, '.spinner() called on element');
|
|
||||||
|
|
||||||
$('<input id="spinner_dis">').spinner().remove();
|
|
||||||
ok(true, '.spinner() called on disconnected element');
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("destroy", function() {
|
|
||||||
expect(2);
|
|
||||||
|
|
||||||
$("<div></div>").appendTo('body').spinner().spinner("destroy").remove();
|
|
||||||
ok(true, '.spinner("destroy") called on element');
|
|
||||||
|
|
||||||
$('<input id="spinner_dis">').spinner().spinner("destroy").remove();
|
|
||||||
ok(true, '.spinner().spinner("destroy") called on disconnected element');
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("defaults", function() {
|
|
||||||
el = $('<div></div>').spinner();
|
|
||||||
$.each(defaults, function(key, val) {
|
|
||||||
var actual = el.data(key + ".spinner"), expected = val;
|
|
||||||
same(actual, expected, key);
|
|
||||||
});
|
|
||||||
el.remove();
|
|
||||||
});
|
|
||||||
|
|
||||||
test("re-attach", function() {
|
|
||||||
expect(2);
|
|
||||||
|
|
||||||
el = $("#spin").spinner().spinner("destroy").spinner();
|
|
||||||
ok(true, '.spinner().spinner("destroy").spinner() called on element');
|
|
||||||
|
|
||||||
$('<input id="spinner_dis">').spinner().spinner("destroy").spinner().remove();
|
|
||||||
ok(true, '.spinner().spinner("destroy").spinner() called on disconnected element');
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("disable", function() {
|
|
||||||
expect(1);
|
|
||||||
|
|
||||||
$("#spin").spinner().spinner("disable");
|
|
||||||
ok(true, '.spinner("disable") called on element');
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("enable", function() {
|
|
||||||
expect(1);
|
|
||||||
|
|
||||||
$("#spin").spinner().spinner("disable").spinner("enable");
|
|
||||||
ok(true, '.spinner("enable") called on element');
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("defaults", function() {
|
|
||||||
expect(12);
|
|
||||||
el = $("#spin").spinner();
|
|
||||||
|
|
||||||
equals(el.data("currency.spinner"), false, "currency");
|
|
||||||
equals(el.data("disabled.spinner"), false, "disabled");
|
|
||||||
equals(el.data("incremental.spinner"), true, "incremental");
|
|
||||||
equals(el.data("max.spinner"), undefined, "max");
|
|
||||||
equals(el.data("min.spinner"), undefined, "min");
|
|
||||||
equals(el.data("start.spinner"), 0, "start");
|
|
||||||
equals(el.data("stepping.spinner"), 1, "stepping");
|
|
||||||
equals(el.data("decimals.spinner"), 0, "decimals");
|
|
||||||
equals(el.data("format.spinner"), '%', "format");
|
|
||||||
equals(el.data("items.spinner"), false, "items");
|
|
||||||
equals(el.data("group.spinner"), '', "group");
|
|
||||||
equals(el.data("point.spinner"), '.', "point");
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("set defaults on init", function() {
|
|
||||||
expect(7);
|
|
||||||
el = $("#spin").spinner({ currency:"£¤", disabled:true, incremental:false, max:200, min:-100, start:50, stepping:2 });
|
|
||||||
|
|
||||||
equals(el.data("currency.spinner"), "£¤", "currency");
|
|
||||||
equals(el.data("disabled.spinner"), true, "disabled");
|
|
||||||
equals(el.data("incremental.spinner"), false, "incremental");
|
|
||||||
equals(el.data("max.spinner"), 200, "max");
|
|
||||||
equals(el.data("min.spinner"), -100, "min");
|
|
||||||
equals(el.data("start.spinner"), 50, "start");
|
|
||||||
equals(el.data("stepping.spinner"), 2, "stepping");
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("keydown on input", function() {
|
|
||||||
expect(6);
|
|
||||||
el = $("#spin").spinner();
|
|
||||||
|
|
||||||
equals(el.val(), 0, "start number");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), 1, "Up key");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_RIGHT})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_RIGHT});
|
|
||||||
|
|
||||||
equals(el.val(), 1, "Right key");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_HOME})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_HOME});
|
|
||||||
|
|
||||||
equals(el.val(), 0, "Home key to start");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_DOWN})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_DOWN});
|
|
||||||
|
|
||||||
equals(el.val(), -1, "Down Key");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_LEFT})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_LEFT});
|
|
||||||
|
|
||||||
equals(el.val(), -1, "Left Key");
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("keydown on input with options", function() {
|
|
||||||
expect(4);
|
|
||||||
|
|
||||||
el = $("#spin").spinner({ incremental:false, max:200, min:-100, start:50, stepping:10 });
|
|
||||||
|
|
||||||
equals(el.val(), 50, "start number");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), 60, "stepping 10 on 50");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_END})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_END});
|
|
||||||
|
|
||||||
equals(el.val(), 200, "End key to max");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_HOME})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_HOME});
|
|
||||||
|
|
||||||
equals(el.val(), -100, "Home key to min");
|
|
||||||
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("currency and decimal options", function() {
|
|
||||||
expect(5);
|
|
||||||
|
|
||||||
el = $("#spin").spinner({ currency:"$", incremental:false, max:120, min:-50, stepping:0.3 });
|
|
||||||
|
|
||||||
equals(el.val(), "$0.00", "start number");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), "$0.30", "stepping 0.30");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_END})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_END});
|
|
||||||
|
|
||||||
equals(el.val(), "$120.00", "End key to max");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_HOME})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_HOME});
|
|
||||||
|
|
||||||
equals(el.val(), "-$50.00", "Home key to min");
|
|
||||||
|
|
||||||
for ( var i = 1 ; i<=120 ; i++ ) {
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP});
|
|
||||||
}
|
|
||||||
|
|
||||||
el.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), "-$14.00", "keydown 120 times");
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("decimal options", function() {
|
|
||||||
expect(3);
|
|
||||||
|
|
||||||
el = $("#spin").spinner({ currency:false, incremental:false, stepping:0.7 });
|
|
||||||
|
|
||||||
equals(el.val(), "0.0", "start number");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_DOWN})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_DOWN});
|
|
||||||
|
|
||||||
equals(el.val(), "-0.7", "stepping 0.7");
|
|
||||||
|
|
||||||
for ( var i = 1 ; i<=11 ; i++ ) {
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP});
|
|
||||||
}
|
|
||||||
|
|
||||||
el.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), "7.0", "keydown 11 times");
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("spin without auto-incremental stepping", function() {
|
|
||||||
expect(2);
|
|
||||||
|
|
||||||
el = $("#spin").spinner({ incremental:false });
|
|
||||||
|
|
||||||
for ( var i = 1 ; i<=120 ; i++ ) {
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP});
|
|
||||||
}
|
|
||||||
|
|
||||||
el.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), 120, "keydown 120 times");
|
|
||||||
|
|
||||||
for ( var i = 1 ; i<=210 ; i++ ) {
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_DOWN});
|
|
||||||
}
|
|
||||||
|
|
||||||
el.simulate("keyup",{keyCode:$.simulate.VK_DOWN});
|
|
||||||
|
|
||||||
equals(el.val(), -90, "keydown 210 times");
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("spin with auto-incremental stepping", function() {
|
|
||||||
expect(2);
|
|
||||||
|
|
||||||
el = $("#spin").spinner();
|
|
||||||
|
|
||||||
for ( var i = 1 ; i<=120 ; i++ ) {
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP});
|
|
||||||
}
|
|
||||||
|
|
||||||
el.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), 300, "keydown 120 times (100+20*10)");
|
|
||||||
|
|
||||||
for ( var i = 1 ; i<=210 ; i++ ) {
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_DOWN});
|
|
||||||
}
|
|
||||||
|
|
||||||
el.simulate("keyup",{keyCode:$.simulate.VK_DOWN});
|
|
||||||
|
|
||||||
equals(el.val(), -1800, "keydown 210 times (300-100-100*10-10*100)");
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("mouse click on buttons", function() {
|
|
||||||
expect(4);
|
|
||||||
el = $("#spin").spinner();
|
|
||||||
|
|
||||||
$(".ui-spinner-up").trigger("mousedown").trigger("mouseup");
|
|
||||||
|
|
||||||
equals(el.val(), 1, "mouse click to up");
|
|
||||||
|
|
||||||
$(".ui-spinner-up").trigger("dblclick");
|
|
||||||
|
|
||||||
equals(el.val(), 2, "mouse double click to up");
|
|
||||||
|
|
||||||
$(".ui-spinner-down").trigger("mousedown").trigger("mouseup");
|
|
||||||
|
|
||||||
equals(el.val(), 1, "mouse click to down");
|
|
||||||
|
|
||||||
$(".ui-spinner-down").trigger("dblclick");
|
|
||||||
|
|
||||||
equals(el.val(), 0, "mouse double click to down");
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("callback", function() {
|
|
||||||
expect(4);
|
|
||||||
|
|
||||||
var s = c = d = u = 0;
|
|
||||||
|
|
||||||
el = $("#spin").spinner({
|
|
||||||
spin: function(){
|
|
||||||
s++;
|
|
||||||
},
|
|
||||||
change: function(){
|
|
||||||
c++;
|
|
||||||
},
|
|
||||||
up: function(){
|
|
||||||
u++;
|
|
||||||
},
|
|
||||||
down: function(){
|
|
||||||
d++;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP}).simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(u, 1, "Up 1 time");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_DOWN}).simulate("keyup",{keyCode:$.simulate.VK_DOWN});
|
|
||||||
|
|
||||||
equals(d, 1, "Down 1 time");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP}).simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(s, 3, "Spin 3 times");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP}).simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(c, 4, "Change 4 times");
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("mouse wheel on input", function() {
|
|
||||||
expect(0);
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
test("currency formats", function() {
|
|
||||||
expect(8);
|
|
||||||
|
|
||||||
// default
|
|
||||||
|
|
||||||
el = $("#spin").spinner({ currency: 'HK$', stepping: 1500.50, start: 1000 });
|
|
||||||
|
|
||||||
equals(el.val(), "HK$1,000.00", "Hong Kong Dollar");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), "HK$2,500.50", "Hong Kong Dollar step-up once");
|
|
||||||
|
|
||||||
// space and comma
|
|
||||||
|
|
||||||
el.spinner('destroy').val('').spinner({ currency: '$', group: ' ', point: '.', stepping: 1500.50, start: 1000 });
|
|
||||||
|
|
||||||
equals(el.val(), "$1 000.00", "Australian Dollar");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), "$2 500.50", "Australian Dollar step-up once");
|
|
||||||
|
|
||||||
// apos and point
|
|
||||||
|
|
||||||
el.spinner('destroy').val('').spinner({ currency: 'Fr ', group: "'", point: '.', stepping: 1500.50, start: 1000 });
|
|
||||||
|
|
||||||
equals(el.val(), "Fr 1'000.00", "Swiss Franc");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), "Fr 2'500.50", "Swiss Franc step-up once");
|
|
||||||
|
|
||||||
// point and comma
|
|
||||||
|
|
||||||
el.spinner('destroy').val('').spinner({ currency: 'RUB', group: ".", point: ',', stepping: 1.5, start: 1000 });
|
|
||||||
|
|
||||||
equals(el.val(), "RUB1.000,00", "Russian Ruble");
|
|
||||||
|
|
||||||
el.simulate("keydown",{keyCode:$.simulate.VK_UP})
|
|
||||||
.simulate("keyup",{keyCode:$.simulate.VK_UP});
|
|
||||||
|
|
||||||
equals(el.val(), "RUB1.001,50", "Russian Ruble step-up once");
|
|
||||||
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
})(jQuery);
|
|
@ -17,7 +17,6 @@
|
|||||||
<script type="text/javascript" src="../ui/ui.selectable.js"></script>
|
<script type="text/javascript" src="../ui/ui.selectable.js"></script>
|
||||||
<script type="text/javascript" src="../ui/ui.slider.js"></script>
|
<script type="text/javascript" src="../ui/ui.slider.js"></script>
|
||||||
<script type="text/javascript" src="../ui/ui.sortable.js"></script>
|
<script type="text/javascript" src="../ui/ui.sortable.js"></script>
|
||||||
<script type="text/javascript" src="../ui/ui.spinner.js"></script>
|
|
||||||
<script type="text/javascript" src="../ui/ui.tabs.js"></script>
|
<script type="text/javascript" src="../ui/ui.tabs.js"></script>
|
||||||
|
|
||||||
<script type="text/javascript" src="qunit/testrunner.js"></script>
|
<script type="text/javascript" src="qunit/testrunner.js"></script>
|
||||||
|
@ -14,7 +14,6 @@ var plugins = [
|
|||||||
"selectable",
|
"selectable",
|
||||||
"slider",
|
"slider",
|
||||||
"sortable",
|
"sortable",
|
||||||
"spinner",
|
|
||||||
"tabs"
|
"tabs"
|
||||||
];
|
];
|
||||||
|
|
||||||
|
@ -1,272 +0,0 @@
|
|||||||
<!doctype html>
|
|
||||||
<html lang="en">
|
|
||||||
<head>
|
|
||||||
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
|
|
||||||
<title>jQuery UI Spinner Test page</title>
|
|
||||||
<script type="text/javascript" src="../../jquery-1.2.6.js"></script>
|
|
||||||
<script type="text/javascript" src="../../ui/ui.core.js"></script>
|
|
||||||
<script type="text/javascript" src="../../ui/ui.spinner.js"></script>
|
|
||||||
|
|
||||||
|
|
||||||
<script type="text/javascript">
|
|
||||||
$(function(){
|
|
||||||
|
|
||||||
if(!window.console) {
|
|
||||||
$('#log').css({overflow:'auto',width:'300px',height:'100px',fontSize:'10px',border:'2px inset #ccc',backgroundColor:'#f4f4f4'});
|
|
||||||
window.console = {
|
|
||||||
log: function() {
|
|
||||||
$('#log').append(arguments[0]+"<br>");
|
|
||||||
$('#log').scrollTop(999999);
|
|
||||||
}
|
|
||||||
};
|
|
||||||
}
|
|
||||||
|
|
||||||
var itemList = [
|
|
||||||
{url: "http://ejohn.org", title: "John Resig"},
|
|
||||||
{url: "http://bassistance.de/", title: "Jörn Zaefferer"},
|
|
||||||
{url: "http://snook.ca/jonathan/", title: "Jonathan Snook"},
|
|
||||||
{url: "http://rdworth.org/", title: "Richard Worth"},
|
|
||||||
{url: "http://www.paulbakaus.com/", title: "Paul Bakaus"},
|
|
||||||
{url: "http://www.yehudakatz.com/", title: "Yehuda Katz"},
|
|
||||||
{url: "http://www.azarask.in/", title: "Aza Raskin"},
|
|
||||||
{url: "http://www.karlswedberg.com/", title: "Karl Swedberg"},
|
|
||||||
{url: "http://scottjehl.com/", title: "Scott Jehl"},
|
|
||||||
{url: "http://jdsharp.us/", title: "Jonathan Sharp"},
|
|
||||||
{url: "http://www.kevinhoyt.org/", title: "Kevin Hoyt"},
|
|
||||||
{url: "http://www.codylindley.com/", title: "Cody Lindley"},
|
|
||||||
{url: "http://malsup.com/jquery/", title: "Mike Alsup"}
|
|
||||||
];
|
|
||||||
|
|
||||||
var opts = {
|
|
||||||
's1': {},
|
|
||||||
's2': {stepping: 0.25},
|
|
||||||
's3': {currency: '$'},
|
|
||||||
's4': {},
|
|
||||||
's5': {
|
|
||||||
//
|
|
||||||
// Two methods of adding external items to the spinner
|
|
||||||
//
|
|
||||||
// method 1: on initalisation call the add method directly and format html manually
|
|
||||||
init: function(event, ui) {
|
|
||||||
for (var i=0; i<itemList.length; i++) {
|
|
||||||
ui.add('<a href="'+ itemList[i].url +'" target="_blank">'+ itemList[i].title +'</a>');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
// method 2: use the format and items options in combination
|
|
||||||
format: '%(title) <a href="%(url)" target="_blank">»</a>',
|
|
||||||
items: itemList
|
|
||||||
},
|
|
||||||
// callbacks
|
|
||||||
's6': {
|
|
||||||
init: function(event, ui) {
|
|
||||||
console.log('init: '+ ui.value);
|
|
||||||
},
|
|
||||||
up: function(event, ui) {
|
|
||||||
console.log('up: '+ ui.value);
|
|
||||||
},
|
|
||||||
down: function(event, ui) {
|
|
||||||
console.log('down: '+ ui.value);
|
|
||||||
},
|
|
||||||
spin: function(event, ui) {
|
|
||||||
console.log('spin: '+ ui.value);
|
|
||||||
},
|
|
||||||
change: function(event, ui) {
|
|
||||||
console.log('change: '+ ui.value);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
};
|
|
||||||
|
|
||||||
for (var n in opts)
|
|
||||||
$("#"+n).spinner(opts[n]);
|
|
||||||
|
|
||||||
$("button").click(function(event){
|
|
||||||
var ns = $(this).attr('id').match(/(s\d)\-(\w+)$/);
|
|
||||||
if (ns != null)
|
|
||||||
$('#'+ns[1]).spinner( (ns[2] == 'create') ? opts[ns[1]] : ns[2]);
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<style type="text/css">
|
|
||||||
|
|
||||||
body
|
|
||||||
{
|
|
||||||
background: #fff;
|
|
||||||
font-family: Arial;
|
|
||||||
}
|
|
||||||
|
|
||||||
label {
|
|
||||||
float: left;
|
|
||||||
margin-right: .5em;
|
|
||||||
padding: .15em 0;
|
|
||||||
font-weight: bold;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ui-spinner {
|
|
||||||
width: 15em;
|
|
||||||
display: block;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
border: 1px solid #999;
|
|
||||||
background: #FEFEFE url(../images/spinner-bg.gif) repeat-x left bottom;
|
|
||||||
padding: 0 5px;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ui-spinner-disabled {
|
|
||||||
background: #F4F4F4;
|
|
||||||
color: #CCC;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ui-spinner-box {
|
|
||||||
width: 90%;
|
|
||||||
height: 100%;
|
|
||||||
float: left;
|
|
||||||
font-size: 125%;
|
|
||||||
border: none;
|
|
||||||
background: none;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ui-spinner-up,
|
|
||||||
.ui-spinner-down {
|
|
||||||
width: 10%;
|
|
||||||
height: 50%;
|
|
||||||
font-size: 0.5em;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
z-index: 100;
|
|
||||||
text-align: center;
|
|
||||||
vertical-align: middle;
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
cursor: default;
|
|
||||||
border: 1px solid #999;
|
|
||||||
border-right: none;
|
|
||||||
border-top: none;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ui-spinner-down {
|
|
||||||
bottom: 0;
|
|
||||||
border-bottom: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ui-spinner-pressed {
|
|
||||||
background: #FEFEFE;
|
|
||||||
}
|
|
||||||
|
|
||||||
.ui-spinner-list,
|
|
||||||
.ui-spinner-listitem {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
</style>
|
|
||||||
</head>
|
|
||||||
|
|
||||||
<body>
|
|
||||||
|
|
||||||
<h1>jQuery UI Spinner Test Page</h1>
|
|
||||||
|
|
||||||
<p>This is a visual test page for developers and demonstrates some of the features included in ui.spinner. Mousewheel support is provided by the <a href="http://plugins.jquery.com/project/mousewheel">mousewheel plugin</a>.</p>
|
|
||||||
|
|
||||||
<p><label for="s1">Basic: </label>
|
|
||||||
<input type="text" id="s1" value="10" /></p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<button id="s1-disable">disable</button>
|
|
||||||
<button id="s1-enable">enable</button>
|
|
||||||
<button id="s1-destroy">destroy</button>
|
|
||||||
<button id="s1-create">create</button>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<hr />
|
|
||||||
|
|
||||||
<p><label for="s2">Decimal: </label>
|
|
||||||
<input type="text" id="s2" value="10.25" /></p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<button id="s2-disable">disable</button>
|
|
||||||
<button id="s2-enable">enable</button>
|
|
||||||
<button id="s2-destroy">destroy</button>
|
|
||||||
<button id="s2-create">create</button>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<hr />
|
|
||||||
|
|
||||||
<p><label for="s3">Currency: </label>
|
|
||||||
<input type="text" id="s3" /></p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<button id="s3-disable">disable</button>
|
|
||||||
<button id="s3-enable">enable</button>
|
|
||||||
<button id="s3-destroy">destroy</button>
|
|
||||||
<button id="s3-create">create</button>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<hr />
|
|
||||||
|
|
||||||
|
|
||||||
<p><label for="s4">Data List: </label>
|
|
||||||
<ul id="s4">
|
|
||||||
<li>item 1</li>
|
|
||||||
<li>item 2</li>
|
|
||||||
<li>item 3</li>
|
|
||||||
<li>item 4</li>
|
|
||||||
<li>item 5</li>
|
|
||||||
<li>item 6</li>
|
|
||||||
<li>item 7</li>
|
|
||||||
<li>item 8</li>
|
|
||||||
<li>item 9</li>
|
|
||||||
<li>item 10</li>
|
|
||||||
<li>item 11</li>
|
|
||||||
<li>item 12</li>
|
|
||||||
<li>item 13</li>
|
|
||||||
<li>item 14</li>
|
|
||||||
<li>item 15</li>
|
|
||||||
<li>item 16</li>
|
|
||||||
<li>item 17</li>
|
|
||||||
<li>item 18</li>
|
|
||||||
<li>item 19</li>
|
|
||||||
<li>item 20</li>
|
|
||||||
</ul></p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<button id="s4-disable">disable</button>
|
|
||||||
<button id="s4-enable">enable</button>
|
|
||||||
<button id="s4-destroy">destroy</button>
|
|
||||||
<button id="s4-create">create</button>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<hr />
|
|
||||||
|
|
||||||
<div><label for="s5">Presenters: </label>
|
|
||||||
<div id="s5"></div></div>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<button id="s5-disable">disable</button>
|
|
||||||
<button id="s5-enable">enable</button>
|
|
||||||
<button id="s5-destroy">destroy</button>
|
|
||||||
<button id="s5-create">create</button>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<hr />
|
|
||||||
|
|
||||||
<p><label for="s6">Callbacks: </label>
|
|
||||||
<input type="text" id="s6" /></p>
|
|
||||||
|
|
||||||
<p>
|
|
||||||
<button id="s6-disable">disable</button>
|
|
||||||
<button id="s6-enable">enable</button>
|
|
||||||
<button id="s6-destroy">destroy</button>
|
|
||||||
<button id="s6-create">create</button>
|
|
||||||
</p>
|
|
||||||
|
|
||||||
<div id="log"></div>
|
|
||||||
|
|
||||||
<hr />
|
|
||||||
|
|
||||||
</body>
|
|
||||||
</html>
|
|
@ -432,60 +432,6 @@ body .ui-resizable-autohide .ui-resizable-handle { display: none; } /* use 'body
|
|||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
/* Spinner */
|
|
||||||
.ui-spinner {
|
|
||||||
width: 15em;
|
|
||||||
display: block;
|
|
||||||
position: relative;
|
|
||||||
overflow: hidden;
|
|
||||||
border: 1px solid #999;
|
|
||||||
background: #FEFEFE url(./images/spinner-bg.gif) repeat-x left bottom;
|
|
||||||
padding: 0 5px;
|
|
||||||
}
|
|
||||||
.ui-spinner-disabled {
|
|
||||||
background: #F4F4F4;
|
|
||||||
color: #CCC;
|
|
||||||
}
|
|
||||||
.ui-spinner-box {
|
|
||||||
width: 90%;
|
|
||||||
height: 100%;
|
|
||||||
float: left;
|
|
||||||
font-size: 125%;
|
|
||||||
border: none;
|
|
||||||
background: none;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
.ui-spinner-up,
|
|
||||||
.ui-spinner-down {
|
|
||||||
width: 10%;
|
|
||||||
height: 50%;
|
|
||||||
font-size: 0.5em;
|
|
||||||
padding: 0;
|
|
||||||
margin: 0;
|
|
||||||
z-index: 100;
|
|
||||||
text-align: center;
|
|
||||||
vertical-align: middle;
|
|
||||||
position: absolute;
|
|
||||||
right: 0;
|
|
||||||
cursor: default;
|
|
||||||
border: 1px solid #999;
|
|
||||||
border-right: none;
|
|
||||||
border-top: none;
|
|
||||||
}
|
|
||||||
.ui-spinner-down {
|
|
||||||
bottom: 0;
|
|
||||||
border-bottom: 0;
|
|
||||||
}
|
|
||||||
.ui-spinner-pressed {
|
|
||||||
background: #FEFEFE;
|
|
||||||
}
|
|
||||||
.ui-spinner-list,
|
|
||||||
.ui-spinner-listitem {
|
|
||||||
margin: 0;
|
|
||||||
padding: 0;
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
/*
|
/*
|
||||||
Generic ThemeRoller Classes
|
Generic ThemeRoller Classes
|
||||||
>> Make your jQuery Components ThemeRoller-Compatible!
|
>> Make your jQuery Components ThemeRoller-Compatible!
|
||||||
|
424
ui/ui.spinner.js
424
ui/ui.spinner.js
@ -1,424 +0,0 @@
|
|||||||
/*
|
|
||||||
* jQuery UI Spinner @VERSION
|
|
||||||
*
|
|
||||||
* Copyright (c) 2008 jQuery
|
|
||||||
* Dual licensed under the MIT (MIT-LICENSE.txt)
|
|
||||||
* and GPL (GPL-LICENSE.txt) licenses.
|
|
||||||
*
|
|
||||||
* http://docs.jquery.com/UI/Spinner
|
|
||||||
*
|
|
||||||
* Depends:
|
|
||||||
* ui.core.js
|
|
||||||
*/
|
|
||||||
(function($) {
|
|
||||||
|
|
||||||
$.widget('ui.spinner', {
|
|
||||||
_init: function() {
|
|
||||||
this._trigger('init', null, this.ui(null));
|
|
||||||
|
|
||||||
// perform data bind on generic objects
|
|
||||||
if (typeof this.options.items[0] == 'object' && !this.element.is('input')) {
|
|
||||||
var data = this.options.items;
|
|
||||||
for (var i=0; i<data.length; i++) {
|
|
||||||
this._addItem(data[i]);
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
// check for decimals in steppinng and set _decimals as internal
|
|
||||||
this._decimals = parseInt(this.options.decimals, 10);
|
|
||||||
if (this.options.stepping.toString().indexOf('.') != -1 && this._decimals == 0) {
|
|
||||||
var s = this.options.stepping.toString();
|
|
||||||
this._decimals = s.slice(s.indexOf('.')+1, s.length).length;
|
|
||||||
}
|
|
||||||
|
|
||||||
//Initialize needed constants
|
|
||||||
var self = this;
|
|
||||||
this.element
|
|
||||||
.addClass('ui-spinner-box')
|
|
||||||
.attr('autocomplete', 'off'); // switch off autocomplete in opera
|
|
||||||
|
|
||||||
this._setValue( isNaN(this._getValue()) ? this.options.start : this._getValue() );
|
|
||||||
|
|
||||||
this.element
|
|
||||||
.wrap('<div>')
|
|
||||||
.parent()
|
|
||||||
.addClass('ui-spinner')
|
|
||||||
.append('<button class="ui-spinner-up" type="button">▲</button>')
|
|
||||||
.find('.ui-spinner-up')
|
|
||||||
.bind('mousedown', function(event) {
|
|
||||||
$(this).addClass('ui-spinner-pressed');
|
|
||||||
if (!self.counter) {
|
|
||||||
self.counter = 1;
|
|
||||||
}
|
|
||||||
self._mousedown(100, '_up', event);
|
|
||||||
})
|
|
||||||
.bind('mouseup', function(event) {
|
|
||||||
$(this).removeClass('ui-spinner-pressed');
|
|
||||||
if (self.counter == 1) {
|
|
||||||
self._up(event);
|
|
||||||
}
|
|
||||||
self._mouseup(event);
|
|
||||||
})
|
|
||||||
.bind('mouseout', function(event) {
|
|
||||||
$(this).removeClass('ui-spinner-pressed');
|
|
||||||
if (self.timer) {
|
|
||||||
self._mouseup(event);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
// mousedown/mouseup capture first click, now handle second click
|
|
||||||
.bind('dblclick', function(event) {
|
|
||||||
$(this).removeClass('ui-spinner-pressed');
|
|
||||||
self._up(event);
|
|
||||||
self._mouseup(event);
|
|
||||||
})
|
|
||||||
.bind('keydown.spinner', function(event) {
|
|
||||||
var KEYS = $.keyCode;
|
|
||||||
if (event.keyCode == KEYS.SPACE || event.keyCode == KEYS.ENTER) {
|
|
||||||
$(this).addClass('ui-spinner-pressed');
|
|
||||||
if (!self.counter) {
|
|
||||||
self.counter = 1;
|
|
||||||
}
|
|
||||||
self._up.call(self, event);
|
|
||||||
} else if (event.keyCode == KEYS.DOWN || event.keyCode == KEYS.RIGHT) {
|
|
||||||
self.element.siblings('.ui-spinner-down').focus();
|
|
||||||
} else if (event.keyCode == KEYS.LEFT) {
|
|
||||||
self.element.focus();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.bind('keyup.spinner', function(event) {
|
|
||||||
$(this).removeClass('ui-spinner-pressed');
|
|
||||||
self.counter = 0;
|
|
||||||
self._propagate('change', event);
|
|
||||||
})
|
|
||||||
.end()
|
|
||||||
.append('<button class="ui-spinner-down" type="button">▼</button>')
|
|
||||||
.find('.ui-spinner-down')
|
|
||||||
.bind('mousedown', function(event) {
|
|
||||||
$(this).addClass('ui-spinner-pressed');
|
|
||||||
if (!self.counter) {
|
|
||||||
self.counter = 1;
|
|
||||||
}
|
|
||||||
self._mousedown(100, '_down', event);
|
|
||||||
})
|
|
||||||
.bind('mouseup', function(event) {
|
|
||||||
$(this).removeClass('ui-spinner-pressed');
|
|
||||||
if (self.counter == 1) {
|
|
||||||
self._down();
|
|
||||||
}
|
|
||||||
self._mouseup(event);
|
|
||||||
})
|
|
||||||
.bind('mouseout', function(event) {
|
|
||||||
$(this).removeClass('ui-spinner-pressed');
|
|
||||||
if (self.timer) {
|
|
||||||
self._mouseup(event);
|
|
||||||
}
|
|
||||||
})
|
|
||||||
// mousedown/mouseup capture first click, now handle second click
|
|
||||||
.bind('dblclick', function(event) {
|
|
||||||
$(this).removeClass('ui-spinner-pressed');
|
|
||||||
self._down(event);
|
|
||||||
self._mouseup(event);
|
|
||||||
})
|
|
||||||
.bind('keydown.spinner', function(event) {
|
|
||||||
var KEYS = $.keyCode;
|
|
||||||
if (event.keyCode == KEYS.SPACE || event.keyCode == KEYS.ENTER) {
|
|
||||||
$(this).addClass('ui-spinner-pressed');
|
|
||||||
if (!self.counter) {
|
|
||||||
self.counter = 1;
|
|
||||||
}
|
|
||||||
self._down.call(self, event);
|
|
||||||
} else if (event.keyCode == KEYS.UP || event.keyCode == KEYS.LEFT) {
|
|
||||||
self.element.siblings('.ui-spinner-up').focus();
|
|
||||||
}
|
|
||||||
})
|
|
||||||
.bind('keyup.spinner', function(event) {
|
|
||||||
$(this).removeClass('ui-spinner-pressed');
|
|
||||||
self.counter = 0;
|
|
||||||
self._propagate('change', event);
|
|
||||||
})
|
|
||||||
.end();
|
|
||||||
|
|
||||||
// Give the spinner casing a unique id only if one exists in original input
|
|
||||||
// - this should aid targetted customisations if a page contains multiple instances
|
|
||||||
this.element.attr('id', function(){
|
|
||||||
if (this.id) {
|
|
||||||
$(this).parent().attr('id', this.id+'-ui-spinner');
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
// DataList: Set contraints for object length and step size.
|
|
||||||
// Manipulate height of spinner.
|
|
||||||
this._items = this.element.children().length;
|
|
||||||
if (this._items > 1) {
|
|
||||||
var height = this.element.outerHeight()/this._items;
|
|
||||||
this.element
|
|
||||||
.addClass('ui-spinner-list')
|
|
||||||
.height(height)
|
|
||||||
.children()
|
|
||||||
.addClass('ui-spinner-listitem')
|
|
||||||
.height(height)
|
|
||||||
.css('overflow', 'hidden')
|
|
||||||
.end()
|
|
||||||
.parent()
|
|
||||||
.height(height)
|
|
||||||
.end();
|
|
||||||
this.options.stepping = 1;
|
|
||||||
this.options.min = 0;
|
|
||||||
this.options.max = this._items-1;
|
|
||||||
}
|
|
||||||
|
|
||||||
this.element
|
|
||||||
.bind('keydown.spinner', function(event) {
|
|
||||||
if (!self.counter) {
|
|
||||||
self.counter = 1;
|
|
||||||
}
|
|
||||||
return self._keydown.call(self, event);
|
|
||||||
})
|
|
||||||
.bind('keyup.spinner', function(event) {
|
|
||||||
self.counter = 0;
|
|
||||||
self._propagate('change', event);
|
|
||||||
})
|
|
||||||
.bind('blur.spinner', function(event) {
|
|
||||||
self._cleanUp();
|
|
||||||
});
|
|
||||||
|
|
||||||
if ($.fn.mousewheel) {
|
|
||||||
this.element.mousewheel(function(event, delta) {
|
|
||||||
self._mousewheel(event, delta);
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
_constrain: function() {
|
|
||||||
if (this.options.min != undefined && this._getValue() < this.options.min) {
|
|
||||||
this._setValue(this.options.min);
|
|
||||||
}
|
|
||||||
if (this.options.max != undefined && this._getValue() > this.options.max) {
|
|
||||||
this._setValue(this.options.max);
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_cleanUp: function() {
|
|
||||||
this._setValue(this._getValue());
|
|
||||||
this._constrain();
|
|
||||||
},
|
|
||||||
_spin: function(d, event) {
|
|
||||||
if (this.disabled) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
if (isNaN(this._getValue())) {
|
|
||||||
this._setValue(this.options.start);
|
|
||||||
}
|
|
||||||
this._setValue(this._getValue() + (d == 'up' ? 1:-1) *(this.options.incremental && this.counter > 100 ? (this.counter > 200 ? 100 : 10) : 1) * this.options.stepping);
|
|
||||||
this._animate(d);
|
|
||||||
this._constrain();
|
|
||||||
if (this.counter) {
|
|
||||||
this.counter++;
|
|
||||||
}
|
|
||||||
this._propagate('spin', event);
|
|
||||||
},
|
|
||||||
_down: function(event) {
|
|
||||||
this._spin('down', event);
|
|
||||||
this._propagate('down', event);
|
|
||||||
},
|
|
||||||
_up: function(event) {
|
|
||||||
this._spin('up', event);
|
|
||||||
this._propagate('up', event);
|
|
||||||
},
|
|
||||||
_mousedown: function(i, d, event) {
|
|
||||||
var self = this;
|
|
||||||
i = i || 100;
|
|
||||||
if (this.timer) {
|
|
||||||
window.clearInterval(this.timer);
|
|
||||||
this.timer = 0;
|
|
||||||
}
|
|
||||||
this.timer = window.setInterval(function() {
|
|
||||||
self[d](event);
|
|
||||||
if (self.options.incremental && self.counter > 20) {
|
|
||||||
self._mousedown(20, d, event);
|
|
||||||
}
|
|
||||||
}, i);
|
|
||||||
},
|
|
||||||
_mouseup: function(event) {
|
|
||||||
this.counter = 0;
|
|
||||||
if (this.timer) {
|
|
||||||
window.clearInterval(this.timer);
|
|
||||||
this.timer = 0;
|
|
||||||
}
|
|
||||||
this.element[0].focus();
|
|
||||||
this._propagate('change', event);
|
|
||||||
},
|
|
||||||
_keydown: function(event) {
|
|
||||||
var KEYS = $.keyCode;
|
|
||||||
|
|
||||||
if (event.keyCode == KEYS.UP) {
|
|
||||||
this._up(event);
|
|
||||||
}
|
|
||||||
if (event.keyCode == KEYS.DOWN) {
|
|
||||||
this._down(event);
|
|
||||||
}
|
|
||||||
if (event.keyCode == KEYS.HOME) {
|
|
||||||
//Home key goes to min, if defined, else to start
|
|
||||||
this._setValue(this.options.min || this.options.start);
|
|
||||||
}
|
|
||||||
if (event.keyCode == KEYS.END && this.options.max != undefined) {
|
|
||||||
//End key goes to maximum
|
|
||||||
this._setValue(this.options.max);
|
|
||||||
}
|
|
||||||
return (event.keyCode == KEYS.TAB || event.keyCode == KEYS.BACKSPACE ||
|
|
||||||
event.keyCode == KEYS.LEFT || event.keyCode == KEYS.RIGHT || event.keyCode == KEYS.PERIOD ||
|
|
||||||
event.keyCode == KEYS.NUMPAD_DECIMAL || event.keyCode == KEYS.NUMPAD_SUBTRACT ||
|
|
||||||
(event.keyCode >= 96 && event.keyCode <= 105) || // add support for numeric keypad 0-9
|
|
||||||
(/[0-9\-\.]/).test(String.fromCharCode(event.keyCode))) ? true : false;
|
|
||||||
},
|
|
||||||
_mousewheel: function(event, delta) {
|
|
||||||
var self = this;
|
|
||||||
delta = ($.browser.opera ? -delta / Math.abs(delta) : delta);
|
|
||||||
(delta > 0 ? self._up(event) : self._down(event));
|
|
||||||
if (self.timeout) {
|
|
||||||
window.clearTimeout(self.timeout);
|
|
||||||
self.timeout = 0;
|
|
||||||
}
|
|
||||||
self.timeout = window.setTimeout(function(){self._propagate('change', event);}, 400);
|
|
||||||
event.preventDefault();
|
|
||||||
},
|
|
||||||
_getValue: function() {
|
|
||||||
var val = this.element.val().replace(this.options.point, '.');
|
|
||||||
if (this.options.group === '.') {
|
|
||||||
val = val.replace('.','');
|
|
||||||
}
|
|
||||||
return parseFloat(val.replace(/[^0-9\-\.]/g, ''));
|
|
||||||
},
|
|
||||||
_setValue: function(newVal) {
|
|
||||||
if (isNaN(newVal)) {
|
|
||||||
newVal = this.options.start;
|
|
||||||
}
|
|
||||||
this.element.val(
|
|
||||||
this.options.currency ?
|
|
||||||
$.ui.spinner.format.currency(newVal, this.options.currency, this.options.group, this.options.point) :
|
|
||||||
$.ui.spinner.format.number(newVal, this._decimals, this.options.group, this.options.point)
|
|
||||||
);
|
|
||||||
},
|
|
||||||
_animate: function(d) {
|
|
||||||
if (this.element.hasClass('ui-spinner-list') && ((d == 'up' && this._getValue() <= this.options.max) || (d == 'down' && this._getValue() >= this.options.min)) ) {
|
|
||||||
this.element.animate({marginTop: '-' + this._getValue() * this.element.parent().height() }, {
|
|
||||||
duration: 'fast',
|
|
||||||
queue: false
|
|
||||||
});
|
|
||||||
}
|
|
||||||
},
|
|
||||||
_addItem: function(obj, fmt) {
|
|
||||||
if (!this.element.is('input')) {
|
|
||||||
var wrapper = 'div';
|
|
||||||
if (this.element.is('ol') || this.element.is('ul')) {
|
|
||||||
wrapper = 'li';
|
|
||||||
}
|
|
||||||
var html = obj; // string or object set it to html first
|
|
||||||
|
|
||||||
if (typeof obj == 'object') {
|
|
||||||
var format = (fmt !== undefined ? fmt : this.options.format);
|
|
||||||
|
|
||||||
html = format.replace(/%(\(([^)]+)\))?/g,
|
|
||||||
(function(data){
|
|
||||||
return function(match, a, lbl) {
|
|
||||||
if (!lbl) {
|
|
||||||
for (var itm in data) {
|
|
||||||
return data[itm]; // return the first item only
|
|
||||||
}
|
|
||||||
} else {
|
|
||||||
return data[lbl];
|
|
||||||
}
|
|
||||||
};
|
|
||||||
})(obj)
|
|
||||||
);
|
|
||||||
}
|
|
||||||
this.element.append('<'+ wrapper +' class="ui-spinner-dyn">'+ html + '</'+ wrapper +'>');
|
|
||||||
}
|
|
||||||
},
|
|
||||||
|
|
||||||
plugins: {},
|
|
||||||
ui: function(event) {
|
|
||||||
return {
|
|
||||||
options: this.options,
|
|
||||||
element: this.element,
|
|
||||||
value: this._getValue(),
|
|
||||||
add: this._addItem
|
|
||||||
};
|
|
||||||
},
|
|
||||||
_propagate: function(n,event) {
|
|
||||||
$.ui.plugin.call(this, n, [event, this.ui()]);
|
|
||||||
return this.element.triggerHandler(n == 'spin' ? n : 'spin'+n, [event, this.ui()], this.options[n]);
|
|
||||||
},
|
|
||||||
destroy: function() {
|
|
||||||
if (!$.data(this.element[0], 'spinner')) {
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
if ($.fn.mousewheel) {
|
|
||||||
this.element.unmousewheel();
|
|
||||||
}
|
|
||||||
this.element
|
|
||||||
.removeClass('ui-spinner-box ui-spinner-list')
|
|
||||||
.removeAttr('disabled')
|
|
||||||
.removeAttr('autocomplete')
|
|
||||||
.removeData('spinner')
|
|
||||||
.unbind('.spinner')
|
|
||||||
.siblings()
|
|
||||||
.remove()
|
|
||||||
.end()
|
|
||||||
.children()
|
|
||||||
.removeClass('ui-spinner-listitem')
|
|
||||||
.remove('.ui-spinner-dyn')
|
|
||||||
.end()
|
|
||||||
.parent()
|
|
||||||
.removeClass('ui-spinner ui-spinner-disabled')
|
|
||||||
.before(this.element.clone())
|
|
||||||
.remove()
|
|
||||||
.end();
|
|
||||||
},
|
|
||||||
enable: function() {
|
|
||||||
this.element
|
|
||||||
.removeAttr('disabled')
|
|
||||||
.siblings()
|
|
||||||
.removeAttr('disabled')
|
|
||||||
.parent()
|
|
||||||
.removeClass('ui-spinner-disabled');
|
|
||||||
this.disabled = false;
|
|
||||||
},
|
|
||||||
disable: function() {
|
|
||||||
this.element
|
|
||||||
.attr('disabled', true)
|
|
||||||
.siblings()
|
|
||||||
.attr('disabled', true)
|
|
||||||
.parent()
|
|
||||||
.addClass('ui-spinner-disabled');
|
|
||||||
this.disabled = true;
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
$.extend($.ui.spinner, {
|
|
||||||
version: "@VERSION",
|
|
||||||
defaults: {
|
|
||||||
decimals: 0,
|
|
||||||
stepping: 1,
|
|
||||||
start: 0,
|
|
||||||
incremental: true,
|
|
||||||
currency: false,
|
|
||||||
format: '%',
|
|
||||||
items: [],
|
|
||||||
group: '',
|
|
||||||
point: '.'
|
|
||||||
},
|
|
||||||
format: {
|
|
||||||
currency: function(num, sym, group, pt) {
|
|
||||||
num = isNaN(num) ? 0 : num;
|
|
||||||
return (num !== Math.abs(num) ? '-' : '') + sym + this.number(Math.abs(num), 2, group || ',', pt);
|
|
||||||
},
|
|
||||||
number: function(num, dec, group, pt) {
|
|
||||||
var regex = /(\d+)(\d{3})/;
|
|
||||||
for (num = isNaN(num) ? 0 : parseFloat(num,10).toFixed(dec), num = num.replace('.', pt); regex.test(num) && group; num=num.replace(regex, '$1'+group+'$2'));
|
|
||||||
return num;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
});
|
|
||||||
|
|
||||||
})(jQuery);
|
|
Loading…
Reference in New Issue
Block a user