/**
@name Edo.controls.Spinner
@class
@typeName spinner
@description 数值调节器
@extend Edo.controls.Trigger
*/
Edo.controls.Spinner = function(config){
/**
@name Edo.controls.Spinner#beforevaluechange
@event
@description 值改变前激发
@property {Object} value 要改变的值
*/
/**
@name Edo.controls.Spinner#valuechange
@event
@description 值改变事件
@property {Object} value 当前值
*/
/**
@name Edo.controls.Spinner#spin
@event
@description 激发spin事件,就是用户通过操作,发生了up/down的值调整
@property {String} direction 调节方向, up或down
*/
Edo.controls.Spinner.superclass.constructor.call(this);
};
Edo.controls.Spinner.extend(Edo.controls.Trigger,{
valueField: 'value',
defaultValue: 0,
/**
@name Edo.controls.Spinner#value
@property
@type Number
@description 值
*/
value: 0,
/**
@name Edo.controls.Spinner#minValue
@property
@type Number
@description 最小值
*/
// minValue: 0,
/**
@name Edo.controls.Spinner#maxValue
@property
@type Number
@description 最大值
*/
// maxValue: 100,
/**
@name Edo.controls.Spinner#incrementValue
@property
@type Number
@description 增加值
*/
incrementValue: 1,
/**
@name Edo.controls.Spinner#alternateIncrementValue
@property
@type Number
@description 快速增加值
*/
alternateIncrementValue: 5, //shift+click时
/**
@name Edo.controls.Spinner#alternateKey
@property
@type String
@description 快速增加键,默认是"shiftKey"
*/
alternateKey: 'shiftKey',
spinTime: 100,
//triggerCls: 'e-trigger-empty',
//withKeyUp: false,
valueField: 'value',
getTriggerHtml: function(){
this.elCls += ' e-spinner';
return '
'
},
createChildren: function(el){
Edo.controls.Spinner.superclass.createChildren.call(this, el);
this.upEl = this.trigger.firstChild;
this.downEl = this.trigger.lastChild;
var v = this.value;
this.value = null;
this._setValue(v);
},
initEvents: function(){
if(!this.design){
Edo.util.Dom.addClassOnOver(this.upEl, 'e-spinner-up-over');
Edo.util.Dom.addClassOnClick(this.upEl, 'e-spinner-up-pressed');
Edo.util.Dom.addClassOnOver(this.downEl, 'e-spinner-down-over');
Edo.util.Dom.addClassOnClick(this.downEl, 'e-spinner-down-pressed');
Edo.util.Dom.on(this.field, 'keydown', this._onKeyDown, this);
Edo.util.Dom.on(document.body, 'mouseup', this.stopSpin, this);
this.on('spin', this._onSpin, this);
}
Edo.controls.Spinner.superclass.initEvents.call(this);
},
_onTrigger: function(e){
if(!this.enable) return;
Edo.controls.Spinner.superclass._onTrigger.call(this, e);
var direction;
if(e.within(this.upEl)){
direction = 'up';
}else if(e.within(this.downEl)){
direction = 'down';
}
if(direction){
this.startSpin(direction, e);
}
},
startSpin: function(direction, e){
this.fireSpin(direction, e);
this.spinTimer = this.fireSpin.time(this.spinTime, this, [direction, e]);
},
stopSpin: function(e){
var sf = this;
setTimeout(function(){
clearInterval(sf.spinTimer);
sf.spinTimer = null;
}, 1);
//Edo.util.Dom.un(document.body, 'mouseup', this.stopSpin, this);
},
_onKeyDown: function(e){
switch(e.keyCode){
case 38:
this.fireSpin('up', e);
break;
case 40:
this.fireSpin('down', e);
break;
}
},
fireSpin: function(direction, e){
//
this.fireEvent('spin', {
type: 'spin',
direction: direction,
source: this,
event: e
});
},
_onSpin: function(e){
this.text = this.field.value;
this.spin(this.field.value, e.direction, e.event[this.alternateKey]);
},
spin: function(value, direction, alternate){
var v = this.normalizeValue(value);
var incr = (alternate == true) ? this.alternateIncrementValue : this.incrementValue;
if(Edo.isValue(direction)){
(direction == 'down') ? v -= incr : v += incr ;
}
this._setValue(v);
},
//确保值的有效性
normalizeValue : function(value){
var v = value;
var v = parseFloat(v);
if(isNaN(v)) v = this.value;
if(this.minValue != undefined && v < this.minValue){
v = this.minValue;
}
if(this.maxValue != undefined && v > this.maxValue){
v = this.maxValue;
}
return v;
},
_setValue: function(v){
v = this.normalizeValue(v);
var e = {
type: 'beforevaluechange',
source: this,
name: this.name,
value: v,
text: v
};
if(this.fireEvent('beforevaluechange', e) !== false){
//if(v !== this.value && this.fireEvent('beforevaluechange', e !== false)){
this.value = e.value;
//this.setText(e.text);
this._setText(e.text);
e.type = 'valuechange';
//this.fireEvent('valuechange', e);
this.changeProperty('value', this.value);
}
},
_onTextChange: function(e){
this.text = this.field.value;
this.spin(this.field.value);
}
});
Edo.controls.Spinner.regType('spinner');