+++ /dev/null
-<html>
-<head>
- <title>The source code</title>
- <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />
- <script type="text/javascript" src="../resources/prettify/prettify.js"></script>
-</head>
-<body onload="prettyPrint();">
- <pre class="prettyprint lang-js"><div id="cls-Ext.ux.Spinner"></div>/**\r
- * @class Ext.ux.Spinner\r
- * @extends Ext.util.Observable\r
- * Creates a Spinner control utilized by Ext.ux.form.SpinnerField\r
- */\r
-Ext.ux.Spinner = Ext.extend(Ext.util.Observable, {\r
- incrementValue: 1,\r
- alternateIncrementValue: 5,\r
- triggerClass: 'x-form-spinner-trigger',\r
- splitterClass: 'x-form-spinner-splitter',\r
- alternateKey: Ext.EventObject.shiftKey,\r
- defaultValue: 0,\r
- accelerate: false,\r
-\r
- constructor: function(config){\r
- Ext.ux.Spinner.superclass.constructor.call(this, config);\r
- Ext.apply(this, config);\r
- this.mimicing = false;\r
- },\r
-\r
- init: function(field){\r
- this.field = field;\r
-\r
- field.afterMethod('onRender', this.doRender, this);\r
- field.afterMethod('onEnable', this.doEnable, this);\r
- field.afterMethod('onDisable', this.doDisable, this);\r
- field.afterMethod('afterRender', this.doAfterRender, this);\r
- field.afterMethod('onResize', this.doResize, this);\r
- field.afterMethod('onFocus', this.doFocus, this);\r
- field.beforeMethod('onDestroy', this.doDestroy, this);\r
- },\r
-\r
- doRender: function(ct, position){\r
- var el = this.el = this.field.getEl();\r
- var f = this.field;\r
-\r
- if (!f.wrap) {\r
- f.wrap = this.wrap = el.wrap({\r
- cls: "x-form-field-wrap"\r
- });\r
- }\r
- else {\r
- this.wrap = f.wrap.addClass('x-form-field-wrap');\r
- }\r
-\r
- this.trigger = this.wrap.createChild({\r
- tag: "img",\r
- src: Ext.BLANK_IMAGE_URL,\r
- cls: "x-form-trigger " + this.triggerClass\r
- });\r
-\r
- if (!f.width) {\r
- this.wrap.setWidth(el.getWidth() + this.trigger.getWidth());\r
- }\r
-\r
- this.splitter = this.wrap.createChild({\r
- tag: 'div',\r
- cls: this.splitterClass,\r
- style: 'width:13px; height:2px;'\r
- });\r
- this.splitter.setRight((Ext.isIE) ? 1 : 2).setTop(10).show();\r
-\r
- this.proxy = this.trigger.createProxy('', this.splitter, true);\r
- this.proxy.addClass("x-form-spinner-proxy");\r
- this.proxy.setStyle('left', '0px');\r
- this.proxy.setSize(14, 1);\r
- this.proxy.hide();\r
- this.dd = new Ext.dd.DDProxy(this.splitter.dom.id, "SpinnerDrag", {\r
- dragElId: this.proxy.id\r
- });\r
-\r
- this.initTrigger();\r
- this.initSpinner();\r
- },\r
-\r
- doAfterRender: function(){\r
- var y;\r
- if (Ext.isIE && this.el.getY() != (y = this.trigger.getY())) {\r
- this.el.position();\r
- this.el.setY(y);\r
- }\r
- },\r
-\r
- doEnable: function(){\r
- if (this.wrap) {\r
- this.wrap.removeClass(this.field.disabledClass);\r
- }\r
- },\r
-\r
- doDisable: function(){\r
- if (this.wrap) {\r
- this.wrap.addClass(this.field.disabledClass);\r
- this.el.removeClass(this.field.disabledClass);\r
- }\r
- },\r
-\r
- doResize: function(w, h){\r
- if (typeof w == 'number') {\r
- this.el.setWidth(w - this.trigger.getWidth());\r
- }\r
- this.wrap.setWidth(this.el.getWidth() + this.trigger.getWidth());\r
- },\r
-\r
- doFocus: function(){\r
- if (!this.mimicing) {\r
- this.wrap.addClass('x-trigger-wrap-focus');\r
- this.mimicing = true;\r
- Ext.get(Ext.isIE ? document.body : document).on("mousedown", this.mimicBlur, this, {\r
- delay: 10\r
- });\r
- this.el.on('keydown', this.checkTab, this);\r
- }\r
- },\r
-\r
- // private\r
- checkTab: function(e){\r
- if (e.getKey() == e.TAB) {\r
- this.triggerBlur();\r
- }\r
- },\r
-\r
- // private\r
- mimicBlur: function(e){\r
- if (!this.wrap.contains(e.target) && this.field.validateBlur(e)) {\r
- this.triggerBlur();\r
- }\r
- },\r
-\r
- // private\r
- triggerBlur: function(){\r
- this.mimicing = false;\r
- Ext.get(Ext.isIE ? document.body : document).un("mousedown", this.mimicBlur, this);\r
- this.el.un("keydown", this.checkTab, this);\r
- this.field.beforeBlur();\r
- this.wrap.removeClass('x-trigger-wrap-focus');\r
- this.field.onBlur.call(this.field);\r
- },\r
-\r
- initTrigger: function(){\r
- this.trigger.addClassOnOver('x-form-trigger-over');\r
- this.trigger.addClassOnClick('x-form-trigger-click');\r
- },\r
-\r
- initSpinner: function(){\r
- this.field.addEvents({\r
- 'spin': true,\r
- 'spinup': true,\r
- 'spindown': true\r
- });\r
-\r
- this.keyNav = new Ext.KeyNav(this.el, {\r
- "up": function(e){\r
- e.preventDefault();\r
- this.onSpinUp();\r
- },\r
-\r
- "down": function(e){\r
- e.preventDefault();\r
- this.onSpinDown();\r
- },\r
-\r
- "pageUp": function(e){\r
- e.preventDefault();\r
- this.onSpinUpAlternate();\r
- },\r
-\r
- "pageDown": function(e){\r
- e.preventDefault();\r
- this.onSpinDownAlternate();\r
- },\r
-\r
- scope: this\r
- });\r
-\r
- this.repeater = new Ext.util.ClickRepeater(this.trigger, {\r
- accelerate: this.accelerate\r
- });\r
- this.field.mon(this.repeater, "click", this.onTriggerClick, this, {\r
- preventDefault: true\r
- });\r
-\r
- this.field.mon(this.trigger, {\r
- mouseover: this.onMouseOver,\r
- mouseout: this.onMouseOut,\r
- mousemove: this.onMouseMove,\r
- mousedown: this.onMouseDown,\r
- mouseup: this.onMouseUp,\r
- scope: this,\r
- preventDefault: true\r
- });\r
-\r
- this.field.mon(this.wrap, "mousewheel", this.handleMouseWheel, this);\r
-\r
- this.dd.setXConstraint(0, 0, 10)\r
- this.dd.setYConstraint(1500, 1500, 10);\r
- this.dd.endDrag = this.endDrag.createDelegate(this);\r
- this.dd.startDrag = this.startDrag.createDelegate(this);\r
- this.dd.onDrag = this.onDrag.createDelegate(this);\r
- },\r
-\r
- onMouseOver: function(){\r
- if (this.disabled) {\r
- return;\r
- }\r
- var middle = this.getMiddle();\r
- this.tmpHoverClass = (Ext.EventObject.getPageY() < middle) ? 'x-form-spinner-overup' : 'x-form-spinner-overdown';\r
- this.trigger.addClass(this.tmpHoverClass);\r
- },\r
-\r
- //private\r
- onMouseOut: function(){\r
- this.trigger.removeClass(this.tmpHoverClass);\r
- },\r
-\r
- //private\r
- onMouseMove: function(){\r
- if (this.disabled) {\r
- return;\r
- }\r
- var middle = this.getMiddle();\r
- if (((Ext.EventObject.getPageY() > middle) && this.tmpHoverClass == "x-form-spinner-overup") ||\r
- ((Ext.EventObject.getPageY() < middle) && this.tmpHoverClass == "x-form-spinner-overdown")) {\r
- }\r
- },\r
-\r
- //private\r
- onMouseDown: function(){\r
- if (this.disabled) {\r
- return;\r
- }\r
- var middle = this.getMiddle();\r
- this.tmpClickClass = (Ext.EventObject.getPageY() < middle) ? 'x-form-spinner-clickup' : 'x-form-spinner-clickdown';\r
- this.trigger.addClass(this.tmpClickClass);\r
- },\r
-\r
- //private\r
- onMouseUp: function(){\r
- this.trigger.removeClass(this.tmpClickClass);\r
- },\r
-\r
- //private\r
- onTriggerClick: function(){\r
- if (this.disabled || this.el.dom.readOnly) {\r
- return;\r
- }\r
- var middle = this.getMiddle();\r
- var ud = (Ext.EventObject.getPageY() < middle) ? 'Up' : 'Down';\r
- this['onSpin' + ud]();\r
- },\r
-\r
- //private\r
- getMiddle: function(){\r
- var t = this.trigger.getTop();\r
- var h = this.trigger.getHeight();\r
- var middle = t + (h / 2);\r
- return middle;\r
- },\r
-\r
- //private\r
- //checks if control is allowed to spin\r
- isSpinnable: function(){\r
- if (this.disabled || this.el.dom.readOnly) {\r
- Ext.EventObject.preventDefault(); //prevent scrolling when disabled/readonly\r
- return false;\r
- }\r
- return true;\r
- },\r
-\r
- handleMouseWheel: function(e){\r
- //disable scrolling when not focused\r
- if (this.wrap.hasClass('x-trigger-wrap-focus') == false) {\r
- return;\r
- }\r
-\r
- var delta = e.getWheelDelta();\r
- if (delta > 0) {\r
- this.onSpinUp();\r
- e.stopEvent();\r
- }\r
- else\r
- if (delta < 0) {\r
- this.onSpinDown();\r
- e.stopEvent();\r
- }\r
- },\r
-\r
- //private\r
- startDrag: function(){\r
- this.proxy.show();\r
- this._previousY = Ext.fly(this.dd.getDragEl()).getTop();\r
- },\r
-\r
- //private\r
- endDrag: function(){\r
- this.proxy.hide();\r
- },\r
-\r
- //private\r
- onDrag: function(){\r
- if (this.disabled) {\r
- return;\r
- }\r
- var y = Ext.fly(this.dd.getDragEl()).getTop();\r
- var ud = '';\r
-\r
- if (this._previousY > y) {\r
- ud = 'Up';\r
- } //up\r
- if (this._previousY < y) {\r
- ud = 'Down';\r
- } //down\r
- if (ud != '') {\r
- this['onSpin' + ud]();\r
- }\r
-\r
- this._previousY = y;\r
- },\r
-\r
- //private\r
- onSpinUp: function(){\r
- if (this.isSpinnable() == false) {\r
- return;\r
- }\r
- if (Ext.EventObject.shiftKey == true) {\r
- this.onSpinUpAlternate();\r
- return;\r
- }\r
- else {\r
- this.spin(false, false);\r
- }\r
- this.field.fireEvent("spin", this);\r
- this.field.fireEvent("spinup", this);\r
- },\r
-\r
- //private\r
- onSpinDown: function(){\r
- if (this.isSpinnable() == false) {\r
- return;\r
- }\r
- if (Ext.EventObject.shiftKey == true) {\r
- this.onSpinDownAlternate();\r
- return;\r
- }\r
- else {\r
- this.spin(true, false);\r
- }\r
- this.field.fireEvent("spin", this);\r
- this.field.fireEvent("spindown", this);\r
- },\r
-\r
- //private\r
- onSpinUpAlternate: function(){\r
- if (this.isSpinnable() == false) {\r
- return;\r
- }\r
- this.spin(false, true);\r
- this.field.fireEvent("spin", this);\r
- this.field.fireEvent("spinup", this);\r
- },\r
-\r
- //private\r
- onSpinDownAlternate: function(){\r
- if (this.isSpinnable() == false) {\r
- return;\r
- }\r
- this.spin(true, true);\r
- this.field.fireEvent("spin", this);\r
- this.field.fireEvent("spindown", this);\r
- },\r
-\r
- spin: function(down, alternate){\r
- var v = parseFloat(this.field.getValue());\r
- var incr = (alternate == true) ? this.alternateIncrementValue : this.incrementValue;\r
- (down == true) ? v -= incr : v += incr;\r
-\r
- v = (isNaN(v)) ? this.defaultValue : v;\r
- v = this.fixBoundries(v);\r
- this.field.setRawValue(v);\r
- },\r
-\r
- fixBoundries: function(value){\r
- var v = value;\r
-\r
- if (this.field.minValue != undefined && v < this.field.minValue) {\r
- v = this.field.minValue;\r
- }\r
- if (this.field.maxValue != undefined && v > this.field.maxValue) {\r
- v = this.field.maxValue;\r
- }\r
-\r
- return this.fixPrecision(v);\r
- },\r
-\r
- // private\r
- fixPrecision: function(value){\r
- var nan = isNaN(value);\r
- if (!this.field.allowDecimals || this.field.decimalPrecision == -1 || nan || !value) {\r
- return nan ? '' : value;\r
- }\r
- return parseFloat(parseFloat(value).toFixed(this.field.decimalPrecision));\r
- },\r
-\r
- doDestroy: function(){\r
- if (this.trigger) {\r
- this.trigger.remove();\r
- }\r
- if (this.wrap) {\r
- this.wrap.remove();\r
- delete this.field.wrap;\r
- }\r
-\r
- if (this.splitter) {\r
- this.splitter.remove();\r
- }\r
-\r
- if (this.dd) {\r
- this.dd.unreg();\r
- this.dd = null;\r
- }\r
-\r
- if (this.proxy) {\r
- this.proxy.remove();\r
- }\r
-\r
- if (this.repeater) {\r
- this.repeater.purgeListeners();\r
- }\r
- }\r
-});\r
-\r
-//backwards compat\r
-Ext.form.Spinner = Ext.ux.Spinner;</pre>
-</body>
-</html>
\ No newline at end of file
git.ithinksw.org / extjs.git / blobdiff