KeyNav_wev8.js
4.04 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
/*
* Ext JS Library 2.0.2
* Copyright(c) 2006-2008, Ext JS, LLC.
* licensing@extjs.com
*
* http://extjs.com/license
*/
/**
* @class Ext.KeyNav
* <p>Provides a convenient wrapper for normalized keyboard navigation. KeyNav allows you to bind
* navigation keys to function calls that will get called when the keys are pressed, providing an easy
* way to implement custom navigation schemes for any UI component.</p>
* <p>The following are all of the possible keys that can be implemented: enter, left, right, up, down, tab, esc,
* pageUp, pageDown, del, home, end. Usage:</p>
<pre><code>
var nav = new Ext.KeyNav("my-element", {
"left" : function(e){
this.moveLeft(e.ctrlKey);
},
"right" : function(e){
this.moveRight(e.ctrlKey);
},
"enter" : function(e){
this.save();
},
scope : this
});
</code></pre>
* @constructor
* @param {Mixed} el The element to bind to
* @param {Object} config The config
*/
Ext.KeyNav = function(el, config){
this.el = Ext.get(el);
Ext.apply(this, config);
if(!this.disabled){
this.disabled = true;
this.enable();
}
};
Ext.KeyNav.prototype = {
/**
* @cfg {Boolean} disabled
* True to disable this KeyNav instance (defaults to false)
*/
disabled : false,
/**
* @cfg {String} defaultEventAction
* The method to call on the {@link Ext.EventObject} after this KeyNav intercepts a key. Valid values are
* {@link Ext.EventObject#stopEvent}, {@link Ext.EventObject#preventDefault} and
* {@link Ext.EventObject#stopPropagation} (defaults to 'stopEvent')
*/
defaultEventAction: "stopEvent",
/**
* @cfg {Boolean} forceKeyDown
* Handle the keydown event instead of keypress (defaults to false). KeyNav automatically does this for IE since
* IE does not propagate special keys on keypress, but setting this to true will force other browsers to also
* handle keydown instead of keypress.
*/
forceKeyDown : false,
// private
prepareEvent : function(e){
var k = e.getKey();
var h = this.keyToHandler[k];
//if(h && this[h]){
// e.stopPropagation();
//}
if(Ext.isSafari && h && k >= 37 && k <= 40){
e.stopEvent();
}
},
// private
relay : function(e){
var k = e.getKey();
var h = this.keyToHandler[k];
if(h && this[h]){
if(this.doRelay(e, this[h], h) !== true){
e[this.defaultEventAction]();
}
}
},
// private
doRelay : function(e, h, hname){
return h.call(this.scope || this, e);
},
// possible handlers
enter : false,
left : false,
right : false,
up : false,
down : false,
tab : false,
esc : false,
pageUp : false,
pageDown : false,
del : false,
home : false,
end : false,
// quick lookup hash
keyToHandler : {
37 : "left",
39 : "right",
38 : "up",
40 : "down",
33 : "pageUp",
34 : "pageDown",
46 : "del",
36 : "home",
35 : "end",
13 : "enter",
27 : "esc",
9 : "tab"
},
/**
* Enable this KeyNav
*/
enable: function(){
if(this.disabled){
// ie won't do special keys on keypress, no one else will repeat keys with keydown
// the EventObject will normalize Safari automatically
if(this.forceKeyDown || Ext.isIE || Ext.isAir){
this.el.on("keydown", this.relay, this);
}else{
this.el.on("keydown", this.prepareEvent, this);
this.el.on("keypress", this.relay, this);
}
this.disabled = false;
}
},
/**
* Disable this KeyNav
*/
disable: function(){
if(!this.disabled){
if(this.forceKeyDown || Ext.isIE || Ext.isAir){
this.el.un("keydown", this.relay);
}else{
this.el.un("keydown", this.prepareEvent);
this.el.un("keypress", this.relay);
}
this.disabled = true;
}
}
};