📄 spinner.js
字号:
/*
Copyright (c) 2004-2006, The Dojo Foundation
All Rights Reserved.
Licensed under the Academic Free License version 2.1 or above OR the
modified BSD license. For more information on Dojo licensing, see:
http://dojotoolkit.org/community/licensing.shtml
*/
dojo.provide("dojo.widget.Spinner");
dojo.require("dojo.io.*");
dojo.require("dojo.lfx.*");
dojo.require("dojo.html.*");
dojo.require("dojo.html.layout");
dojo.require("dojo.string");
dojo.require("dojo.widget.*");
dojo.require("dojo.widget.IntegerTextbox");
dojo.require("dojo.widget.RealNumberTextbox");
dojo.require("dojo.widget.DateTextbox");
dojo.require("dojo.experimental");
dojo.declare("dojo.widget.Spinner", null, {_typamaticTimer:null, _typamaticFunction:null, _currentTimeout:this.defaultTimeout, _eventCount:0, defaultTimeout:500, timeoutChangeRate:0.9, templateString:"<span _=\"weird end tag formatting is to prevent whitespace from becoming \"\n\tstyle='float:${this.htmlfloat};'\n\t><table cellpadding=0 cellspacing=0 class=\"dojoSpinner\">\n\t\t<tr>\n\t\t\t<td\n\t\t\t\t><input\n\t\t\t\t\tdojoAttachPoint='textbox' type='${this.type}'\n\t\t\t\t\tdojoAttachEvent='onblur;onfocus;onkey:_handleKeyEvents;onKeyUp:_onSpinnerKeyUp;onresize:_resize'\n\t\t\t\t\tid='${this.widgetId}' name='${this.name}' size='${this.size}' maxlength='${this.maxlength}'\n\t\t\t\t\tvalue='${this.value}' class='${this.className}' autocomplete=\"off\"\n\t\t\t></td>\n\t\t\t<td\n\t\t\t\t><img dojoAttachPoint=\"upArrowNode\"\n\t\t\t\t\tdojoAttachEvent=\"onDblClick: _upArrowDoubleClicked; onMouseDown: _upArrowPressed; onMouseUp: _arrowReleased; onMouseOut: _arrowReleased; onMouseMove: _discardEvent;\"\n\t\t\t\t\tsrc=\"${this.incrementSrc}\" style=\"width: ${this.buttonSize.width}px; height: ${this.buttonSize.height}px;\"\n\t\t\t\t><img dojoAttachPoint=\"downArrowNode\"\n\t\t\t\t\tdojoAttachEvent=\"onDblClick: _downArrowDoubleClicked; onMouseDown: _downArrowPressed; onMouseUp: _arrowReleased; onMouseOut: _arrowReleased; onMouseMove: _discardEvent;\"\n\t\t\t\t\tsrc=\"${this.decrementSrc}\" style=\"width: ${this.buttonSize.width}px; height: ${this.buttonSize.height}px;\"\n\t\t\t></td>\n\t\t</tr>\n\t</table\n\t><span dojoAttachPoint='invalidSpan' class='${this.invalidClass}'>${this.messages.invalidMessage}</span\n\t><span dojoAttachPoint='missingSpan' class='${this.missingClass}'>${this.messages.missingMessage}</span\n\t><span dojoAttachPoint='rangeSpan' class='${this.rangeClass}'>${this.messages.rangeMessage}</span\n></span>\n", templateCssString:"/* inline the table holding the <input> and buttons (method varies by browser) */\n.ie .dojoSpinner, .safari .dojoSpinner {\n\tdisplay: inline;\n}\n\n.moz .dojoSpinner {\n\tdisplay: -moz-inline-box;\n}\n\n.opera .dojoSpinner {\n\tdisplay: inline-table;\n}\n\n/* generic stuff for the table */\n.dojoSpinner td {\n\tpadding:0px;\n\tmargin:0px;\n\tvertical-align: middle;\n}\ntable.dojoSpinner {\n\tborder:0px;\n\tborder-spacing:0px;\n\tline-height:0px;\n\tpadding:0px;\n\tmargin: 0px;\n\tvertical-align: middle;\n}\n\n/* the buttons */\n.dojoSpinner img {\n\tdisplay: block;\n\tborder-width:0px 1px 1px 0px;\n\tborder-style:outset;\n}\n", templateCssPath:dojo.uri.moduleUri("dojo.widget", "templates/Spinner.css"), incrementSrc:dojo.uri.moduleUri("dojo.widget", "templates/images/spinnerIncrement.gif"), decrementSrc:dojo.uri.moduleUri("dojo.widget", "templates/images/spinnerDecrement.gif"), _handleKeyEvents:function (evt) {
if (!evt.key) {
return;
}
if (!evt.ctrlKey && !evt.altKey) {
switch (evt.key) {
case evt.KEY_DOWN_ARROW:
dojo.event.browser.stopEvent(evt);
this._downArrowPressed(evt);
return;
case evt.KEY_UP_ARROW:
dojo.event.browser.stopEvent(evt);
this._upArrowPressed(evt);
return;
}
}
this._eventCount++;
}, _onSpinnerKeyUp:function (evt) {
this._arrowReleased(evt);
this.onkeyup(evt);
}, _resize:function () {
var inputSize = dojo.html.getBorderBox(this.textbox);
this.buttonSize = {width:inputSize.height / 2, height:inputSize.height / 2};
if (this.upArrowNode) {
dojo.html.setMarginBox(this.upArrowNode, this.buttonSize);
dojo.html.setMarginBox(this.downArrowNode, this.buttonSize);
}
}, _pressButton:function (node) {
node.style.borderWidth = "1px 0px 0px 1px";
node.style.borderStyle = "inset";
}, _releaseButton:function (node) {
node.style.borderWidth = "0px 1px 1px 0px";
node.style.borderStyle = "outset";
}, _arrowPressed:function (evt, direction) {
var nodePressed = (direction == -1) ? this.downArrowNode : this.upArrowNode;
var nodeReleased = (direction == +1) ? this.downArrowNode : this.upArrowNode;
if (typeof evt != "number") {
if (this._typamaticTimer != null) {
if (this._typamaticNode == nodePressed) {
return;
}
dojo.lang.clearTimeout(this._typamaticTimer);
}
this._releaseButton(nodeReleased);
this._eventCount++;
this._typamaticTimer = null;
this._currentTimeout = this.defaultTimeout;
} else {
if (evt != this._eventCount) {
this._releaseButton(nodePressed);
return;
}
}
this._pressButton(nodePressed);
this._setCursorX(this.adjustValue(direction, this._getCursorX()));
this._typamaticNode = nodePressed;
this._typamaticTimer = dojo.lang.setTimeout(this, "_arrowPressed", this._currentTimeout, this._eventCount, direction);
this._currentTimeout = Math.round(this._currentTimeout * this.timeoutChangeRate);
}, _downArrowPressed:function (evt) {
return this._arrowPressed(evt, -1);
}, _downArrowDoubleClicked:function (evt) {
var rc = this._downArrowPressed(evt);
dojo.lang.setTimeout(this, "_arrowReleased", 50, null);
return rc;
}, _upArrowPressed:function (evt) {
return this._arrowPressed(evt, +1);
}, _upArrowDoubleClicked:function (evt) {
var rc = this._upArrowPressed(evt);
dojo.lang.setTimeout(this, "_arrowReleased", 50, null);
return rc;
}, _arrowReleased:function (evt) {
this.textbox.focus();
if (evt != null && typeof evt == "object" && evt.keyCode && evt.keyCode != null) {
var keyCode = evt.keyCode;
var k = dojo.event.browser.keys;
switch (keyCode) {
case k.KEY_DOWN_ARROW:
case k.KEY_UP_ARROW:
dojo.event.browser.stopEvent(evt);
break;
}
}
this._releaseButton(this.upArrowNode);
this._releaseButton(this.downArrowNode);
this._eventCount++;
if (this._typamaticTimer != null) {
dojo.lang.clearTimeout(this._typamaticTimer);
}
this._typamaticTimer = null;
this._currentTimeout = this.defaultTimeout;
}, _mouseWheeled:function (evt) {
var scrollAmount = 0;
if (typeof evt.wheelDelta == "number") {
scrollAmount = evt.wheelDelta;
} else {
if (typeof evt.detail == "number") {
scrollAmount = -evt.detail;
}
}
if (scrollAmount > 0) {
this._upArrowPressed(evt);
this._arrowReleased(evt);
} else {
if (scrollAmount < 0) {
this._downArrowPressed(evt);
this._arrowReleased(evt);
}
}
}, _discardEvent:function (evt) {
dojo.event.browser.stopEvent(evt);
}, _getCursorX:function () {
var x = -1;
try {
this.textbox.focus();
if (typeof this.textbox.selectionEnd == "number") {
x = this.textbox.selectionEnd;
} else {
if (document.selection && document.selection.createRange) {
var range = document.selection.createRange().duplicate();
if (range.parentElement() == this.textbox) {
range.moveStart("textedit", -1);
x = range.text.length;
}
}
}
}
catch (e) {
}
return x;
}, _setCursorX:function (x) {
try {
this.textbox.focus();
if (!x) {
x = 0;
}
if (typeof this.textbox.selectionEnd == "number") {
this.textbox.selectionEnd = x;
} else {
if (this.textbox.createTextRange) {
var range = this.textbox.createTextRange();
range.collapse(true);
range.moveEnd("character", x);
range.moveStart("character", x);
range.select();
}
}
}
catch (e) {
}
}, _spinnerPostMixInProperties:function (args, frag) {
var inputNode = this.getFragNodeRef(frag);
var inputSize = dojo.html.getBorderBox(inputNode);
this.buttonSize = {width:inputSize.height / 2 - 1, height:inputSize.height / 2 - 1};
}, _spinnerPostCreate:function (args, frag) {
if (this.textbox.addEventListener) {
this.textbox.addEventListener("DOMMouseScroll", dojo.lang.hitch(this, "_mouseWheeled"), false);
} else {
dojo.event.connect(this.textbox, "onmousewheel", this, "_mouseWheeled");
}
}});
dojo.widget.defineWidget("dojo.widget.IntegerSpinner", [dojo.widget.IntegerTextbox, dojo.widget.Spinner], {delta:"1", postMixInProperties:function (args, frag) {
dojo.widget.IntegerSpinner.superclass.postMixInProperties.apply(this, arguments);
this._spinnerPostMixInProperties(args, frag);
}, postCreate:function (args, frag) {
dojo.widget.IntegerSpinner.superclass.postCreate.apply(this, arguments);
this._spinnerPostCreate(args, frag);
}, adjustValue:function (direction, x) {
var val = this.getValue().replace(/[^\-+\d]/g, "");
if (val.length == 0) {
return;
}
var num = Math.min(Math.max((parseInt(val) + (parseInt(this.delta) * direction)), (this.flags.min ? this.flags.min : -Infinity)), (this.flags.max ? this.flags.max : +Infinity));
val = num.toString();
if (num >= 0) {
val = ((this.flags.signed == true) ? "+" : " ") + val;
}
if (this.flags.separator.length > 0) {
for (var i = val.length - 3; i > 1; i -= 3) {
val = val.substr(0, i) + this.flags.separator + val.substr(i);
}
}
if (val.substr(0, 1) == " ") {
val = val.substr(1);
}
this.setValue(val);
return val.length;
}});
dojo.widget.defineWidget("dojo.widget.RealNumberSpinner", [dojo.widget.RealNumberTextbox, dojo.widget.Spinner], function () {
dojo.experimental("dojo.widget.RealNumberSpinner");
}, {delta:"1e1", postMixInProperties:function (args, frag) {
dojo.widget.RealNumberSpinner.superclass.postMixInProperties.apply(this, arguments);
this._spinnerPostMixInProperties(args, frag);
}, postCreate:function (args, frag) {
dojo.widget.RealNumberSpinner.superclass.postCreate.apply(this, arguments);
this._spinnerPostCreate(args, frag);
}, adjustValue:function (direction, x) {
var val = this.getValue().replace(/[^\-+\.eE\d]/g, "");
if (!val.length) {
return;
}
var num = parseFloat(val);
if (isNaN(num)) {
return;
}
var delta = this.delta.split(/[eE]/);
if (!delta.length) {
delta = [1, 1];
} else {
delta[0] = parseFloat(delta[0].replace(/[^\-+\.\d]/g, ""));
if (isNaN(delta[0])) {
delta[0] = 1;
}
if (delta.length > 1) {
delta[1] = parseInt(delta[1]);
}
if (isNaN(delta[1])) {
delta[1] = 1;
}
}
val = this.getValue().split(/[eE]/);
if (!val.length) {
return;
}
var numBase = parseFloat(val[0].replace(/[^\-+\.\d]/g, ""));
if (val.length == 1) {
var numExp = 0;
} else {
var numExp = parseInt(val[1].replace(/[^\-+\d]/g, ""));
}
if (x <= val[0].length) {
x = 0;
numBase += delta[0] * direction;
} else {
x = Number.MAX_VALUE;
numExp += delta[1] * direction;
if (this.flags.eSigned == false && numExp < 0) {
numExp = 0;
}
}
num = Math.min(Math.max((numBase * Math.pow(10, numExp)), (this.flags.min ? this.flags.min : -Infinity)), (this.flags.max ? this.flags.max : +Infinity));
if ((this.flags.exponent == true || (this.flags.exponent != false && x != 0)) && num.toExponential) {
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -