Author: pazu2k@gmail.com
Date: Sun Jun 7 10:03:52 2009
New Revision: 2672
Added:
branches/dev/spinner/tests/visual/spinner/spinner_methods_test.html
(contents, props changed)
Modified:
branches/dev/spinner/tests/visual/spinner/spinner_method_pageUp_pageDown.html
branches/dev/spinner/ui/ui.spinner.js
Log:
spinner: fixed pageUp/pageDown and page option implementation. added a
visual methods test.
Modified:
branches/dev/spinner/tests/visual/spinner/spinner_method_pageUp_pageDown.html
==============================================================================
---
branches/dev/spinner/tests/visual/spinner/spinner_method_pageUp_pageDown.html
(original)
+++
branches/dev/spinner/tests/visual/spinner/spinner_method_pageUp_pageDown.html
Sun Jun 7 10:03:52 2009
@@ -9,8 +9,13 @@
<script type="text/javascript" src="../../../ui/ui.spinner.js"></script>
<script type="text/javascript">
$(function() {
- $('#spinner').spinner();
+ $('#spinner').spinner({step: 2, page: 5});
+ $('#step').change(function(){
+ $('#spinner')
+ .spinner('option','step',$(this).val());
+ });
+
$('#page').change(function(){
$('#spinner')
.spinner('option','page',$(this).val());
@@ -18,12 +23,14 @@
$('#pageUpButton').click(function() {
$('#spinner')
+ .spinner('option','step',$('#step').val())
.spinner('option','page',$('#page').val())
.spinner('pageUp', $('#pages').val());
});
- $('#oageDownButton').click(function() {
+ $('#pageDownButton').click(function() {
$('#spinner')
+ .spinner('option','step',$('#step').val())
.spinner('option','page',$('#page').val())
.spinner('pageDown', $('#pages').val());
});
@@ -34,8 +41,9 @@
<div class="ui-widget">
<input id="spinner" type="text">
-page size: <input id="page" type="text" value="5" size="5">
-pages: <input id="pages" type="text" value="1" size="5">
+step size: <input id="step" type="text" value="2" size="5">
+page: <input id="page" type="text" value="5" size="5">
+page jump: <input id="pages" type="text" value="1" size="5">
<button id="pageUpButton" class="ui-state-default ui-corner-all">Page
Up</button>
<button id="pageDownButton" class="ui-state-default ui-corner-all">Page
Down</button>
Added: branches/dev/spinner/tests/visual/spinner/spinner_methods_test.html
==============================================================================
--- (empty file)
+++ branches/dev/spinner/tests/visual/spinner/spinner_methods_test.html Sun
Jun 7 10:03:52 2009
@@ -0,0 +1,54 @@
+<!doctype html>
+<html lang="en">
+<head>
+ <title>Spinner Visual Test : Spinner methods test</title>
+ <link rel="stylesheet" href="../visual.css" type="text/css">
+ <link rel="stylesheet" href="../../../themes/base/ui.all.css"
type="text/css">
+ <script type="text/javascript" src="../../../jquery-1.3.2.js"></script>
+ <script type="text/javascript"
src="../../../external/simulate/jquery.simulate.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() {
+ $('#spinner1')
+ .spinner({
+ step: 2,
+ page: 5,
+ value: 0
+ })
+ .spinner('stepUp') // value = 2
+ .spinner('stepUp', 4) // value = 10
+ .spinner('pageUp') // value = 20
+ .spinner('pageUp', 2) // value = 40
+ .simulate("keydown",{keyCode:$.simulate.VK_PGUP})
+ .simulate("keyup",{keyCode:$.simulate.VK_PGUP}) // value = 50
+ ;
+
+ $('#spinner2')
+ .spinner({
+ step: 2,
+ page: 5,
+ value: 50
+ })
+ .simulate("keydown",{keyCode:$.simulate.VK_PGDN})
+ .simulate("keyup",{keyCode:$.simulate.VK_PGDN}) // value = 40
+ .spinner('pageDown', 2) // value = 20
+ .spinner('pageDown') // value = 10
+ .spinner('stepDown', 4) // value = 2
+ .spinner('stepDown') // value = 0
+ ;
+
+ });
+ </script>
+</head>
+<body>
+<div class="ui-widget">
+
You should see this spinner's value equal <strong>50</strong> on load.
If not there's a problem.
+<input id="spinner1" type="text">
+
+You should see this spinner's value equal <strong>0</strong> on load.
If not there's a problem.
+<input id="spinner2" type="text">
+
+</div>
+</body>
+</html>
\ No newline at end of file
Modified: branches/dev/spinner/ui/ui.spinner.js
==============================================================================
--- branches/dev/spinner/ui/ui.spinner.js (original)
+++ branches/dev/spinner/ui/ui.spinner.js Sun Jun 7 10:03:52 2009
@@ -310,27 +310,29 @@
this._trigger('change', event, this.ui());
},
_keydown: function(event) {
- var KEYS = $.ui.keyCode;
+ var o = this.options,
+ jump = o.page * o.step;
+ KEYS = $.ui.keyCode;
if (event.keyCode == KEYS.UP) {
- this._up(this.options[event.shiftKey ? 'page' : 'step'], event);
+ this._up(event.shiftKey ? jump : o.step, event);
}
if (event.keyCode == KEYS.DOWN) {
- this._down(this.options[event.shiftKey ? 'page' : 'step'], event);
+ this._down(event.shiftKey ? jump : o.step, event);
}
if (event.keyCode == KEYS.PAGE_UP) {
- this._up(this.options.page, event);
+ this._up(jump, event);
}
if (event.keyCode == KEYS.PAGE_DOWN) {
- this._down(this.options.page, event);
+ this._down(jump, event);
}
if (event.keyCode == KEYS.HOME) {
- //Home key goes to min, if defined, else to options.value
- this._setValue(this.options.min || this.options.value);
+ //Home key goes to min
+ this._setValue(o.min);
}
- if (event.keyCode == KEYS.END && this.options.max != null) {
+ if (event.keyCode == KEYS.END && o.max != null) {
//End key goes to maximum
- this._setValue(this.options.max);
+ this._setValue(o.max);
}
return (event.keyCode == KEYS.TAB || event.keyCode == KEYS.BACKSPACE ||
event.keyCode == KEYS.LEFT || event.keyCode == KEYS.RIGHT ||
event.keyCode == KEYS.PERIOD ||
@@ -539,15 +541,19 @@
},
stepUp: function(steps) {
this._up((steps || 1) * this.options.step, null);
+ return this;
},
stepDown: function(steps) {
this._down((steps || 1) * this.options.step, null);
+ return this;
},
pageUp: function(pages) {
- this._up((pages || 1) * this.options.page, null);
+ this.stepUp((pages || 1) * this.options.page);
+ return this;
},
pageDown: function(pages) {
- this._down((pages || 1) * this.options.page, null);
+ this.stepDown((pages || 1) * this.options.page);
+ return this;
}
});