mirror of
https://github.com/jquery/jquery-ui.git
synced 2024-11-21 11:04:24 +00:00
Replaced hexadecimal demo with decimal demo. Updated that and the currency demo (previously donation) to use globalization plugin with a select for three different cultures (probably more to come). Updated spinner widget to use Globalization when available, replacing all number formatting related options with a single numberformat option.
This commit is contained in:
jzaefferer
parent
af8ca4ed0e
commit
bc3d283d2c
62
demos/spinner/currency.html
Normal file
62
demos/spinner/currency.html
Normal file
@ -0,0 +1,62 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery UI Spinner - Default functionality</title>
|
||||
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
|
||||
<script type="text/javascript" src="../../jquery-1.4.3.js"></script>
|
||||
<script type="text/javascript" src="../../external/jquery.mousewheel-3.0.2.js"></script>
|
||||
<script type="text/javascript" src="../../external/glob.js"></script>
|
||||
<script type="text/javascript" src="../../external/glob.de-DE.js"></script>
|
||||
<script type="text/javascript" src="../../external/glob.ja-JP.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script>
|
||||
<link type="text/css" href="../demos.css" rel="stylesheet" />
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
$("#currency").change(function() {
|
||||
var current = $("#spinner").spinner("value");
|
||||
console.log("before!!", current)
|
||||
Globalization.preferCulture($(this).val());
|
||||
$("#spinner").spinner("value", current);
|
||||
})
|
||||
|
||||
$("#spinner").spinner({
|
||||
min: 5,
|
||||
max: 2500,
|
||||
step: 25,
|
||||
start: 1000,
|
||||
numberformat: "C"
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="demo">
|
||||
|
||||
<p>
|
||||
<label for="currency">Currency to donate</label>
|
||||
<select id="currency" name="currency">
|
||||
<option value="en-US">US $</option>
|
||||
<option value="de-DE">EUR €</option>
|
||||
<option value="ja-JP">YEN ¥</option>
|
||||
</select>
|
||||
</p>
|
||||
<p>
|
||||
<label for="spinner">Amount to donate:</label>
|
||||
<input id="spinner" name="spinner" value="5" />
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="demo-description">
|
||||
<p>
|
||||
Example of a donation form, with currency selection and amout spinner.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
58
demos/spinner/decimal.html
Normal file
58
demos/spinner/decimal.html
Normal file
@ -0,0 +1,58 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery UI Spinner - decimal</title>
|
||||
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
|
||||
<script type="text/javascript" src="../../jquery-1.4.3.js"></script>
|
||||
<script type="text/javascript" src="../../external/jquery.mousewheel-3.0.2.js"></script>
|
||||
<script type="text/javascript" src="../../external/glob.js"></script>
|
||||
<script type="text/javascript" src="../../external/glob.de-DE.js"></script>
|
||||
<script type="text/javascript" src="../../external/glob.ja-JP.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script>
|
||||
<link type="text/css" href="../demos.css" rel="stylesheet" />
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
$("#spinner").spinner({
|
||||
step: 0.01
|
||||
});
|
||||
|
||||
$("#culture").change(function() {
|
||||
var current = $("#spinner").spinner("value");
|
||||
Globalization.preferCulture($(this).val());
|
||||
$("#spinner").spinner("value", current);
|
||||
})
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="demo">
|
||||
<p>
|
||||
<label for="spinner">Decimal spinner:</label>
|
||||
<input id="spinner" name="spinner" value="5.06" />
|
||||
</p>
|
||||
<p>
|
||||
<label for="culture">Select a culture to use for formatting:</label>
|
||||
<select id="culture">
|
||||
<option value="en-EN" selected="selected">English</option>
|
||||
<option value="de-DE">German</option>
|
||||
<option value="ja-JP">Japanese</option>
|
||||
</select>
|
||||
</p>
|
||||
</div>
|
||||
|
||||
<div class="demo-description">
|
||||
<p>
|
||||
Example of a decimal spinner. Step is set to 0.01.
|
||||
<br/>The code handling the culture change reads the current spinner value,
|
||||
then changes the culture, then sets the value again, resulting in an updated
|
||||
formatting, based on the new culture.
|
||||
</p>
|
||||
</div>
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,74 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery UI Spinner - Default functionality</title>
|
||||
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
|
||||
<script type="text/javascript" src="../../jquery-1.4.3.js"></script>
|
||||
<script type="text/javascript" src="../../external/jquery.mousewheel-3.0.2.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script>
|
||||
<link type="text/css" href="../demos.css" rel="stylesheet" />
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
|
||||
var opts = {
|
||||
's1': { currency: '$' },
|
||||
's2': { currency: '€' },
|
||||
's3': { currency: '¥' },
|
||||
's4': { currency: '$', groupSeparator: ' ', radixPoint: '.' },
|
||||
's5': { currency: 'Fr ', groupSeparator: "'", radixPoint: '.' },
|
||||
's6': { currency: 'RUB', groupSeparator: ".", radixPoint: ',' }
|
||||
};
|
||||
|
||||
var currency = $("#currency").change(function() {
|
||||
var val = $(this).val();
|
||||
$("#amount")
|
||||
.spinner("option", "currency", opts[val].currency)
|
||||
.spinner("option", "groupSeparator", opts[val].groupSeparator ? opts[val].groupSeparator : ',')
|
||||
.spinner("option", "radixPoint", opts[val].radixPoint ? opts[val].radixPoint : '.')
|
||||
.blur();
|
||||
});
|
||||
$("#amount").spinner({
|
||||
currency: opts[currency.val()].currency,
|
||||
min: 5,
|
||||
max: 2500,
|
||||
step: 25,
|
||||
start: 1000,
|
||||
width: '10em'
|
||||
});
|
||||
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="demo">
|
||||
|
||||
<p>
|
||||
<label for="currency">Currency</label>
|
||||
<select id="currency" name="currency">
|
||||
<option value="s1">US $</option>
|
||||
<option value="s2">EUR €</option>
|
||||
<option value="s3">YEN ¥</option>
|
||||
<option value="s4">Australian $</option>
|
||||
<option value="s5">Swiss Franc Fr</option>
|
||||
<option value="s6">Russian Ruble RUB</option>
|
||||
</select>
|
||||
</p>
|
||||
<p>
|
||||
<label for="amount">Select the amount to donate:</label>
|
||||
<input id="amount" name="amount" value="5" />
|
||||
</p>
|
||||
</div><!-- End demo -->
|
||||
|
||||
<div class="demo-description">
|
||||
<p>
|
||||
Example of a donation form, with currency selection and amout spinner.
|
||||
</p>
|
||||
</div><!-- End demo-description -->
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -1,37 +0,0 @@
|
||||
<!doctype html>
|
||||
<html lang="en">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<title>jQuery UI Spinner - Hexadecimal</title>
|
||||
<link type="text/css" href="../../themes/base/jquery.ui.all.css" rel="stylesheet" />
|
||||
<script type="text/javascript" src="../../jquery-1.4.3.js"></script>
|
||||
<script type="text/javascript" src="../../external/jquery.mousewheel-3.0.2.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.core.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.widget.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.button.js"></script>
|
||||
<script type="text/javascript" src="../../ui/jquery.ui.spinner.js"></script>
|
||||
<link type="text/css" href="../demos.css" rel="stylesheet" />
|
||||
<script type="text/javascript">
|
||||
$(function() {
|
||||
$("#hexadecimal").spinner({radix: 16, padLength: 6, precision: 2, step: '0.01'});
|
||||
});
|
||||
</script>
|
||||
</head>
|
||||
<body>
|
||||
|
||||
<div class="demo">
|
||||
|
||||
<p>
|
||||
<label for="hexadecimal">Hexadecimal spinner:</label>
|
||||
<input id="hexadecimal" name="hexadecimal" value="0" />
|
||||
</p>
|
||||
</div><!-- End demo -->
|
||||
|
||||
<div class="demo-description">
|
||||
<p>
|
||||
Example of a hexadecimal spinner.
|
||||
</p>
|
||||
</div><!-- End demo-description -->
|
||||
|
||||
</body>
|
||||
</html>
|
||||
@ -9,8 +9,8 @@
|
||||
<h4>Examples</h4>
|
||||
<ul>
|
||||
<li class="demo-config-on"><a href="default.html">Default functionality</a></li>
|
||||
<li><a href="donation.html">Donation</a></li>
|
||||
<li><a href="hexadecimal.html">Hexadecimal</a></li>
|
||||
<li><a href="decimal.html">Decimal</a></li>
|
||||
<li><a href="currency.html">Currency</a></li>
|
||||
<li><a href="latlong.html">Map</a></li>
|
||||
<li><a href="mousewheel-disabled.html">Mousewheel Disabled</a></li>
|
||||
<li><a href="rtl.html">RTL</a></li>
|
||||
|
||||
55
external/glob.de-DE.js
vendored
Normal file
55
external/glob.de-DE.js
vendored
Normal file
@ -0,0 +1,55 @@
|
||||
(function($) {
|
||||
var cultures = $.cultures,
|
||||
en = cultures.en,
|
||||
standard = en.calendars.standard,
|
||||
culture = cultures["de-DE"] = $.extend(true, {}, en, {
|
||||
name: "de-DE",
|
||||
englishName: "German (Germany)",
|
||||
nativeName: "Deutsch (Deutschland)",
|
||||
language: "de",
|
||||
numberFormat: {
|
||||
',': ".",
|
||||
'.': ",",
|
||||
percent: {
|
||||
pattern: ["-n%","n%"],
|
||||
',': ".",
|
||||
'.': ","
|
||||
},
|
||||
currency: {
|
||||
pattern: ["-n $","n $"],
|
||||
',': ".",
|
||||
'.': ",",
|
||||
symbol: "€"
|
||||
}
|
||||
},
|
||||
calendars: {
|
||||
standard: $.extend(true, {}, standard, {
|
||||
'/': ".",
|
||||
firstDay: 1,
|
||||
days: {
|
||||
names: ["Sonntag","Montag","Dienstag","Mittwoch","Donnerstag","Freitag","Samstag"],
|
||||
namesAbbr: ["So","Mo","Di","Mi","Do","Fr","Sa"],
|
||||
namesShort: ["So","Mo","Di","Mi","Do","Fr","Sa"]
|
||||
},
|
||||
months: {
|
||||
names: ["Januar","Februar","März","April","Mai","Juni","Juli","August","September","Oktober","November","Dezember",""],
|
||||
namesAbbr: ["Jan","Feb","Mrz","Apr","Mai","Jun","Jul","Aug","Sep","Okt","Nov","Dez",""]
|
||||
},
|
||||
AM: null,
|
||||
PM: null,
|
||||
eras: [{"name":"n. Chr.","start":null,"offset":0}],
|
||||
patterns: {
|
||||
d: "dd.MM.yyyy",
|
||||
D: "dddd, d. MMMM yyyy",
|
||||
t: "HH:mm",
|
||||
T: "HH:mm:ss",
|
||||
f: "dddd, d. MMMM yyyy HH:mm",
|
||||
F: "dddd, d. MMMM yyyy HH:mm:ss",
|
||||
M: "dd MMMM",
|
||||
Y: "MMMM yyyy"
|
||||
}
|
||||
})
|
||||
}
|
||||
}, cultures["de-DE"]);
|
||||
culture.calendar = culture.calendars.standard;
|
||||
})(Globalization);
|
||||
74
external/glob.ja-JP.js
vendored
Normal file
74
external/glob.ja-JP.js
vendored
Normal file
@ -0,0 +1,74 @@
|
||||
(function($) {
|
||||
var cultures = $.cultures,
|
||||
en = cultures.en,
|
||||
standard = en.calendars.standard,
|
||||
culture = cultures["ja-JP"] = $.extend(true, {}, en, {
|
||||
name: "ja-JP",
|
||||
englishName: "Japanese (Japan)",
|
||||
nativeName: "日本語 (日本)",
|
||||
language: "ja",
|
||||
numberFormat: {
|
||||
percent: {
|
||||
pattern: ["-n%","n%"]
|
||||
},
|
||||
currency: {
|
||||
pattern: ["-$n","$n"],
|
||||
decimals: 0,
|
||||
symbol: "¥"
|
||||
}
|
||||
},
|
||||
calendars: {
|
||||
standard: $.extend(true, {}, standard, {
|
||||
days: {
|
||||
names: ["日曜日","月曜日","火曜日","水曜日","木曜日","金曜日","土曜日"],
|
||||
namesAbbr: ["日","月","火","水","木","金","土"],
|
||||
namesShort: ["日","月","火","水","木","金","土"]
|
||||
},
|
||||
months: {
|
||||
names: ["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月",""],
|
||||
namesAbbr: ["1","2","3","4","5","6","7","8","9","10","11","12",""]
|
||||
},
|
||||
AM: ["午前","午前","午前"],
|
||||
PM: ["午後","午後","午後"],
|
||||
eras: [{"name":"西暦","start":null,"offset":0}],
|
||||
patterns: {
|
||||
d: "yyyy/MM/dd",
|
||||
D: "yyyy'年'M'月'd'日'",
|
||||
t: "H:mm",
|
||||
T: "H:mm:ss",
|
||||
f: "yyyy'年'M'月'd'日' H:mm",
|
||||
F: "yyyy'年'M'月'd'日' H:mm:ss",
|
||||
M: "M'月'd'日'",
|
||||
Y: "yyyy'年'M'月'"
|
||||
}
|
||||
}),
|
||||
Japanese: $.extend(true, {}, standard, {
|
||||
name: "Japanese",
|
||||
days: {
|
||||
names: ["日曜日","月曜日","火曜日","水曜日","木曜日","金曜日","土曜日"],
|
||||
namesAbbr: ["日","月","火","水","木","金","土"],
|
||||
namesShort: ["日","月","火","水","木","金","土"]
|
||||
},
|
||||
months: {
|
||||
names: ["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月",""],
|
||||
namesAbbr: ["1","2","3","4","5","6","7","8","9","10","11","12",""]
|
||||
},
|
||||
AM: ["午前","午前","午前"],
|
||||
PM: ["午後","午後","午後"],
|
||||
eras: [{"name":"平成","start":null,"offset":1867},{"name":"昭和","start":-1812153600000,"offset":1911},{"name":"大正","start":-1357603200000,"offset":1925},{"name":"明治","start":60022080000,"offset":1988}],
|
||||
twoDigitYearMax: 99,
|
||||
patterns: {
|
||||
d: "gg y/M/d",
|
||||
D: "gg y'年'M'月'd'日'",
|
||||
t: "H:mm",
|
||||
T: "H:mm:ss",
|
||||
f: "gg y'年'M'月'd'日' H:mm",
|
||||
F: "gg y'年'M'月'd'日' H:mm:ss",
|
||||
M: "M'月'd'日'",
|
||||
Y: "gg y'年'M'月'"
|
||||
}
|
||||
})
|
||||
}
|
||||
}, cultures["ja-JP"]);
|
||||
culture.calendar = culture.calendars.standard;
|
||||
})(Globalization);
|
||||
1333
external/glob.js
vendored
Normal file
1333
external/glob.js
vendored
Normal file
File diff suppressed because it is too large
Load Diff
174
ui/jquery.ui.spinner.js
vendored
174
ui/jquery.ui.spinner.js
vendored
@ -17,60 +17,29 @@
|
||||
var hover = 'ui-state-hover',
|
||||
active = 'ui-state-active',
|
||||
namespace = '.spinner',
|
||||
buttonRegex = /hide|auto|fast|slow|(\d+)/,
|
||||
uiSpinnerClasses = 'ui-spinner ui-state-default ui-widget ui-widget-content ui-corner-all ';
|
||||
|
||||
$.widget('ui.spinner', {
|
||||
options: {
|
||||
currency: false,
|
||||
dir: 'ltr',
|
||||
groupSeparator: '',
|
||||
incremental: true,
|
||||
max: null,
|
||||
min: null,
|
||||
mouseWheel: true,
|
||||
numberformat: "n",
|
||||
padding: 0,
|
||||
page: 5,
|
||||
precision: 0,
|
||||
radix: 10,
|
||||
radixPoint: '.',
|
||||
spinnerClass: null,
|
||||
step: null,
|
||||
value: 0,
|
||||
width: false
|
||||
value: 0
|
||||
},
|
||||
|
||||
_create: function() {
|
||||
this._initOptions();
|
||||
|
||||
this.value(this._parse(this.element.val() || this.options.value));
|
||||
|
||||
this._draw();
|
||||
|
||||
this._mousewheel();
|
||||
|
||||
this._aria();
|
||||
},
|
||||
_initOptions: function() {
|
||||
var self = this,
|
||||
options = self.options;
|
||||
|
||||
// check for precision in stepping and set _precision as internal
|
||||
var precision = parseInt(options.precision, 10);
|
||||
|
||||
if (self._step().toString().indexOf('.') != -1 && precision === 0) {
|
||||
var s = self._step().toString();
|
||||
precision = s.slice(s.indexOf('.')+1, s.length).length;
|
||||
}
|
||||
|
||||
// set currency options
|
||||
if (options.currency) {
|
||||
precision = 2;
|
||||
options.radix = 10;
|
||||
options.groupSeparator = options.groupSeparator || (options.radixPoint === ',' ? '' : ',');
|
||||
}
|
||||
options.precision = precision;
|
||||
},
|
||||
_draw: function() {
|
||||
var self = this,
|
||||
options = self.options;
|
||||
@ -101,7 +70,10 @@ $.widget('ui.spinner', {
|
||||
|
||||
this.element
|
||||
.bind('keydown'+namespace, function(event) {
|
||||
return self._start(event) ? self._keydown(event) : false;
|
||||
if (self._start(event)) {
|
||||
return self._keydown(event);
|
||||
}
|
||||
return true;
|
||||
})
|
||||
.bind('keyup'+namespace, function(event) {
|
||||
if (self.spinning) {
|
||||
@ -114,18 +86,13 @@ $.widget('ui.spinner', {
|
||||
self.focused = true;
|
||||
})
|
||||
.bind('blur'+namespace, function(event) {
|
||||
self._value(self.element.val());
|
||||
self.value(self.element.val());
|
||||
if (!self.hovered) {
|
||||
uiSpinner.removeClass(active);
|
||||
}
|
||||
self.focused = false;
|
||||
});
|
||||
|
||||
// force width if passed through options
|
||||
if (options.width) {
|
||||
this.element.width(options.width);
|
||||
}
|
||||
|
||||
// disable spinner if element was already disabled
|
||||
if (options.disabled) {
|
||||
this.disable();
|
||||
@ -133,6 +100,7 @@ $.widget('ui.spinner', {
|
||||
|
||||
// button bindings
|
||||
this.buttons = uiSpinner.find('.ui-spinner-button')
|
||||
.attr("tabIndex", -1)
|
||||
.bind('mousedown', function(event) {
|
||||
if (self._start(event) === false) {
|
||||
return false;
|
||||
@ -198,7 +166,7 @@ $.widget('ui.spinner', {
|
||||
this.counter = 1;
|
||||
}
|
||||
|
||||
var newVal = this._value() + step * (this.options.incremental && this.counter > 100
|
||||
var newVal = this.value() + step * (this.options.incremental && this.counter > 100
|
||||
? this.counter > 200
|
||||
? 100
|
||||
: 10
|
||||
@ -206,7 +174,7 @@ $.widget('ui.spinner', {
|
||||
|
||||
// cancelable
|
||||
if (this._trigger('spin', event, { value: newVal }) !== false) {
|
||||
this._value(newVal);
|
||||
this.value(newVal);
|
||||
this.counter++;
|
||||
}
|
||||
},
|
||||
@ -227,10 +195,10 @@ $.widget('ui.spinner', {
|
||||
i = i || 100;
|
||||
|
||||
if (this.timer) {
|
||||
window.clearInterval(this.timer);
|
||||
window.clearTimeout(this.timer);
|
||||
}
|
||||
|
||||
this.timer = window.setInterval(function() {
|
||||
this.timer = window.setTimeout(function() {
|
||||
self._repeat(self.options.incremental && self.counter > 20 ? 20 : i, steps, event);
|
||||
}, i);
|
||||
|
||||
@ -241,40 +209,32 @@ $.widget('ui.spinner', {
|
||||
KEYS = $.ui.keyCode;
|
||||
|
||||
switch (event.keyCode) {
|
||||
case KEYS.UP: this._repeat(null, event.shiftKey ? o.page : 1, event); break;
|
||||
case KEYS.DOWN: this._repeat(null, event.shiftKey ? -o.page : -1, event); break;
|
||||
case KEYS.PAGE_UP: this._repeat(null, o.page, event); break;
|
||||
case KEYS.PAGE_DOWN: this._repeat(null, -o.page, event); break;
|
||||
case KEYS.UP:
|
||||
this._repeat(null, event.shiftKey ? o.page : 1, event);
|
||||
return false;
|
||||
case KEYS.DOWN:
|
||||
this._repeat(null, event.shiftKey ? -o.page : -1, event);
|
||||
return false;
|
||||
case KEYS.PAGE_UP:
|
||||
this._repeat(null, o.page, event);
|
||||
return false;
|
||||
case KEYS.PAGE_DOWN:
|
||||
this._repeat(null, -o.page, event);
|
||||
return false;
|
||||
|
||||
case KEYS.HOME:
|
||||
case KEYS.END:
|
||||
if (event.shiftKey) {
|
||||
return true;
|
||||
}
|
||||
this._value(this['_' + (event.keyCode == KEYS.HOME ? 'min':'max')]());
|
||||
break;
|
||||
|
||||
case KEYS.TAB:
|
||||
case KEYS.BACKSPACE:
|
||||
case KEYS.LEFT:
|
||||
case KEYS.RIGHT:
|
||||
case KEYS.PERIOD:
|
||||
case KEYS.NUMPAD_DECIMAL:
|
||||
case KEYS.NUMPAD_SUBTRACT:
|
||||
case KEYS.HOME:
|
||||
case KEYS.END:
|
||||
if (event.shiftKey) {
|
||||
return true;
|
||||
}
|
||||
this.value(this['_' + (event.keyCode == KEYS.HOME ? 'min' : 'max')]());
|
||||
return false;
|
||||
|
||||
case KEYS.ENTER:
|
||||
this.value(this.element.val());
|
||||
return true;
|
||||
|
||||
default:
|
||||
if ((event.keyCode >= 96 && event.keyCode <= 105) || // numeric keypad 0-9
|
||||
(new RegExp('[' + this._validChars() + ']', 'i').test(String.fromCharCode(event.keyCode)))) {
|
||||
return true;
|
||||
};
|
||||
case KEYS.ENTER:
|
||||
this.value(this.element.val());
|
||||
}
|
||||
|
||||
return false;
|
||||
return true;
|
||||
},
|
||||
_mousewheel: function() {
|
||||
var self = this;
|
||||
@ -298,7 +258,7 @@ $.widget('ui.spinner', {
|
||||
});
|
||||
}
|
||||
},
|
||||
_value: function(newVal) {
|
||||
value: function(newVal) {
|
||||
if (!arguments.length) {
|
||||
return this._parse(this.element.val());
|
||||
}
|
||||
@ -349,10 +309,6 @@ $.widget('ui.spinner', {
|
||||
}
|
||||
this._aria();
|
||||
break;
|
||||
case 'width':
|
||||
this.element.width(value);
|
||||
break;
|
||||
case 'precision':
|
||||
case 'value':
|
||||
this._format(this._parse(this.options.value));
|
||||
break;
|
||||
@ -364,59 +320,23 @@ $.widget('ui.spinner', {
|
||||
.attr('aria-valuemax', this._max())
|
||||
.attr('aria-valuenow', this.value());
|
||||
},
|
||||
_validChars: function() {
|
||||
var radix = parseInt(this.options.radix);
|
||||
return '\\-\\' + this.options.radixPoint + (this.options.groupSeparator
|
||||
? '\\' + this.options.groupSeparator
|
||||
:'') + (radix < 10
|
||||
? '0-' + radix
|
||||
: '0-9' + (radix > 10
|
||||
? 'a-' + String.fromCharCode('a'.charCodeAt(0) + radix - 11)
|
||||
:''));
|
||||
},
|
||||
|
||||
_parse: function(val) {
|
||||
var input = val;
|
||||
if (typeof val == 'string') {
|
||||
if (this.options.groupSeparator) {
|
||||
val = val.replace(new RegExp('\\'+this.options.groupSeparator,'g'), '');
|
||||
// special case for currency formatting until Globalization handles currencies
|
||||
if (this.options.numberformat == "C" && window.Globalization) {
|
||||
// parseFloat should accept number format, including currency
|
||||
var culture = Globalization.culture || Globalization.cultures['default'];
|
||||
val = val.replace(culture.numberFormat.currency.symbol, "");
|
||||
}
|
||||
val = val.replace(new RegExp('[^' + this._validChars() + ']', 'gi'), '').split(this.options.radixPoint);
|
||||
result = parseInt(val[0] == '-' ? 0 : val[0] || 0, this.options.radix);
|
||||
if (val.length > 1) {
|
||||
result += parseInt(val[1], this.options.radix) / Math.pow(this.options.radix, val[1].length) *
|
||||
// must test first character of val[0] for minus sign because -0 is parsed as 0 in result
|
||||
(val[0].substr(0,1) == '-' ? -1 : 1);
|
||||
}
|
||||
val = result;
|
||||
val = window.Globalization ? Globalization.parseFloat(val) : +val;
|
||||
}
|
||||
console.log("input", input, "parsed", val)
|
||||
return isNaN(val) ? null : val;
|
||||
},
|
||||
_format: function(num) {
|
||||
var regex = /(\d+)(\d{3})/,
|
||||
options = this.options,
|
||||
sym = options.currency || '',
|
||||
dec = options.precision,
|
||||
radix = options.radix,
|
||||
group = options.groupSeparator,
|
||||
pt = options.radixPoint,
|
||||
neg = num < 0 ? '-' : '';
|
||||
|
||||
for (
|
||||
num = (
|
||||
isNaN(num)
|
||||
? options.value
|
||||
: radix === 10
|
||||
? parseFloat(num, radix).toFixed(dec)
|
||||
: parseInt(num, radix)
|
||||
).toString(radix).replace('.', pt);
|
||||
regex.test(num) && group;
|
||||
num = num.replace(regex, '$1'+group+'$2')
|
||||
);
|
||||
|
||||
result = num.replace('-','');
|
||||
while (options.padding && (result.length < options.padding)) {
|
||||
result = '0' + result;
|
||||
}
|
||||
this.element.val(neg + sym + result);
|
||||
this.element.val( window.Globalization ? Globalization.format(num, this.options.numberformat) : num );
|
||||
},
|
||||
_getOption: function(key, defaultValue) {
|
||||
return this._parse(this.options[key] !== null
|
||||
@ -476,12 +396,6 @@ $.widget('ui.spinner', {
|
||||
.addClass('ui-spinner-disabled ui-state-disabled');
|
||||
this.options.disabled = true;
|
||||
},
|
||||
value: function(newVal) {
|
||||
if (!arguments.length) {
|
||||
return this._value();
|
||||
}
|
||||
this._value(newVal);
|
||||
},
|
||||
stepUp: function(steps) {
|
||||
this._spin((steps || 1) * this._step(), null);
|
||||
return this;
|
||||
|
||||
Loading…
Reference in New Issue
Block a user