-<!DOCTYPE html><html><head><title>Sencha Documentation Project</title><link rel="stylesheet" href="../reset.css" type="text/css"><link rel="stylesheet" href="../prettify.css" type="text/css"><link rel="stylesheet" href="../prettify_sa.css" type="text/css"><script type="text/javascript" src="../prettify.js"></script></head><body onload="prettyPrint()"><pre class="prettyprint"><pre><span id='Ext-util.KeyMap-method-constructor'><span id='Ext-util.KeyMap'>/**
-</span></span> * @class Ext.util.KeyMap
+<!DOCTYPE html>
+<html>
+<head>
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
+ <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>
+ <style type="text/css">
+ .highlight { display: block; background-color: #ddd; }
+ </style>
+ <script type="text/javascript">
+ function highlight() {
+ document.getElementById(location.hash.replace(/#/, "")).className = "highlight";
+ }
+ </script>
+</head>
+<body onload="prettyPrint(); highlight();">
+ <pre class="prettyprint lang-js"><span id='Ext-util-KeyMap'>/**
+</span> * @class Ext.util.KeyMap
* Handles mapping keys to actions for an element. One key map can be used for multiple actions.
* The constructor accepts the same config object as defined by {@link #addBinding}.
* If you bind a callback function to a KeyMap, anytime the KeyMap handles an expected key
* combination it will call the function with this signature (if the match is a multi-key
* combination the callback will still be called only once): (String key, Ext.EventObject e)
- * A KeyMap can also handle a string representation of keys.<br />
+ * A KeyMap can also handle a string representation of keys. By default KeyMap starts enabled.<br />
* Usage:
<pre><code>
// map one key by key code
}
]);
</code></pre>
- * <b>Note: A KeyMap starts enabled</b>
- * @constructor
- * @param {Mixed} el The element to bind to
- * @param {Object} binding The binding (see {@link #addBinding})
- * @param {String} eventName (optional) The event to bind to (defaults to "keydown")
*/
Ext.define('Ext.util.KeyMap', {
alternateClassName: 'Ext.KeyMap',
-
+
+<span id='Ext-util-KeyMap-method-constructor'> /**
+</span> * Creates new KeyMap.
+ * @param {String/HTMLElement/Ext.Element} el The element or its ID to bind to
+ * @param {Object} binding The binding (see {@link #addBinding})
+ * @param {String} [eventName="keydown"] The event to bind to
+ */
constructor: function(el, binding, eventName){
var me = this;
-
+
Ext.apply(me, {
el: Ext.get(el),
eventName: eventName || me.eventName,
}
me.enable();
},
-
+
eventName: 'keydown',
-<span id='Ext-util.KeyMap-method-addBinding'> /**
+<span id='Ext-util-KeyMap-method-addBinding'> /**
</span> * Add a new binding to this KeyMap. The following config object properties are supported:
* <pre>
Property Type Description
handler Function The function to call when KeyMap finds the expected key combination
fn Function Alias of handler (for backwards-compatibility)
scope Object The scope of the callback function
-defaultEventAction String A default action to apply to the event. Possible values are: stopEvent, stopPropagation, preventDefault. If no value is set no action is performed.
+defaultEventAction String A default action to apply to the event. Possible values are: stopEvent, stopPropagation, preventDefault. If no value is set no action is performed.
</pre>
*
* Usage:
scope: this
});
</code></pre>
- * @param {Object/Array} binding A single KeyMap config or an array of configs
+ * @param {Object/Object[]} binding A single KeyMap config or an array of configs
*/
addBinding : function(binding){
if (Ext.isArray(binding)) {
Ext.each(binding, this.addBinding, this);
return;
}
-
+
var keyCode = binding.key,
processed = false,
key,
if (Ext.isString(keyCode)) {
keys = [];
- keyString = keyCode.toLowerCase();
-
+ keyString = keyCode.toUpperCase();
+
for (i = 0, len = keyString.length; i < len; ++i){
keys.push(keyString.charCodeAt(i));
}
keyCode = keys;
processed = true;
}
-
+
if (!Ext.isArray(keyCode)) {
keyCode = [keyCode];
}
-
+
if (!processed) {
for (i = 0, len = keyCode.length; i < len; ++i) {
key = keyCode[i];
if (Ext.isString(key)) {
- keyCode[i] = key.toLowerCase().charCodeAt(0);
+ keyCode[i] = key.toUpperCase().charCodeAt(0);
}
}
}
-
+
this.bindings.push(Ext.apply({
keyCode: keyCode
}, binding));
},
-
-<span id='Ext-util.KeyMap-method-handleKeyDown'> /**
+
+<span id='Ext-util-KeyMap-method-handleKeyDown'> /**
</span> * Process any keydown events on the element
* @private
* @param {Ext.EventObject} event
var bindings = this.bindings,
i = 0,
len = bindings.length;
-
+
event = this.processEvent(event);
for(; i < len; ++i){
this.processBinding(bindings[i], event);
}
}
},
-
-<span id='Ext-util.KeyMap-method-processEvent'> /**
+
+<span id='Ext-util-KeyMap-method-processEvent'> /**
</span> * Ugly hack to allow this class to be tested. Currently WebKit gives
* no way to raise a key event properly with both
* a) A keycode
* b) The alt/ctrl/shift modifiers
- * So we have to simulate them here. Yuk!
+ * So we have to simulate them here. Yuk!
* This is a stub method intended to be overridden by tests.
* More info: https://bugs.webkit.org/show_bug.cgi?id=16735
* @private
processEvent: function(event){
return event;
},
-
-<span id='Ext-util.KeyMap-method-processBinding'> /**
+
+<span id='Ext-util-KeyMap-method-processBinding'> /**
</span> * Process a particular binding and fire the handler if necessary.
* @private
* @param {Object} binding The binding information
i,
len,
keydownEvent = new Ext.EventObjectImpl(event);
-
-
+
+
for (i = 0, len = keyCode.length; i < len; ++i) {
if (key === keyCode[i]) {
if (handler.call(scope, key, event) !== true && defaultEventAction) {
}
}
},
-
-<span id='Ext-util.KeyMap-method-checkModifiers'> /**
+
+<span id='Ext-util-KeyMap-method-checkModifiers'> /**
</span> * Check if the modifiers on the event match those on the binding
* @private
* @param {Object} binding
i = 0,
len = keys.length,
val, key;
-
+
for (; i < len; ++i){
key = keys[i];
val = binding[key];
return true;
},
-<span id='Ext-util.KeyMap-method-on'> /**
+<span id='Ext-util-KeyMap-method-on'> /**
</span> * Shorthand for adding a single key listener
- * @param {Number/Array/Object} key Either the numeric key code, array of key codes or an object with the
+ * @param {Number/Number[]/Object} key Either the numeric key code, array of key codes or an object with the
* following options:
* {key: (number or array), shift: (true/false), ctrl: (true/false), alt: (true/false)}
* @param {Function} fn The function to call
});
},
-<span id='Ext-util.KeyMap-method-isEnabled'> /**
+<span id='Ext-util-KeyMap-method-isEnabled'> /**
</span> * Returns true if this KeyMap is enabled
* @return {Boolean}
*/
return this.enabled;
},
-<span id='Ext-util.KeyMap-method-enable'> /**
+<span id='Ext-util-KeyMap-method-enable'> /**
</span> * Enables this KeyMap
*/
enable: function(){
- if(!this.enabled){
- this.el.on(this.eventName, this.handleKeyDown, this);
- this.enabled = true;
+ var me = this;
+
+ if (!me.enabled) {
+ me.el.on(me.eventName, me.handleKeyDown, me);
+ me.enabled = true;
}
},
-<span id='Ext-util.KeyMap-method-disable'> /**
+<span id='Ext-util-KeyMap-method-disable'> /**
</span> * Disable this KeyMap
*/
disable: function(){
- if(this.enabled){
- this.el.removeListener(this.eventName, this.handleKeyDown, this);
- this.enabled = false;
+ var me = this;
+
+ if (me.enabled) {
+ me.el.removeListener(me.eventName, me.handleKeyDown, me);
+ me.enabled = false;
}
},
-<span id='Ext-util.KeyMap-method-setDisabled'> /**
+<span id='Ext-util-KeyMap-method-setDisabled'> /**
</span> * Convenience function for setting disabled/enabled by boolean.
* @param {Boolean} disabled
*/
this.enable();
}
},
-
-<span id='Ext-util.KeyMap-method-destroy'> /**
+
+<span id='Ext-util-KeyMap-method-destroy'> /**
</span> * Destroys the KeyMap instance and removes all handlers.
* @param {Boolean} removeEl True to also remove the attached element
*/
destroy: function(removeEl){
var me = this;
-
+
me.bindings = [];
me.disable();
if (removeEl === true) {
}
delete me.el;
}
-});</pre></pre></body></html>
\ No newline at end of file
+});</pre>
+</body>
+</html>