ExtJS listens for global keystrokes using Ext.KeyMap

Question

To debug application development, I add keyboard shortcuts for common tasks. I can sue Ext.KeyMap to do it like this ...

 var map = new Ext.KeyMap("my-element", { key: 13, // or Ext.EventObject.ENTER fn: myHandler, scope: myObject }); 

But I want to detect "ss" or "qq", that is, specific double keystrokes of letters. I'm not sure how to do this ....

My idea is to detect a singular keystroke, add a listener to detect the next keystroke. To handle the gap between them, set up a delayed event that removes the listener after x amount of time.

Any improvements / suggestions / warnings

Answer 1

I'm not sure why you need an extra listener. Why not save the previous keystroke in a variable (with the timestamp when the keystroke occurred). Then you can simply compare the last keystroke with the previous keystroke. If they are the same, and the saved timestamp is not so distant in the past, this is the double key that you are following. If the key codes do not match or the saved timestamp is too old, simply update the stored keycode and timestamp with the new values.

Answer 2

You do not need to remember all the keys pressed, only the last. When you think of a double-click event, this is similar, but since a click is twice as popular, it is already implemented for us.

Answer 3

Something like that:

 function defineDoubleKeyMap(element, cfg) { var repeated, timer; return new Ext.KeyMap(element, { key: cfg.key, fn: function() { if (repeated) { // when clicked the second time // stop timer and call our callback repeated = false; clearTimeout(timer); cfg.fn.call(cfg.scope); } else { // remember we clicked once, forget after delay repeated = true; // adjust the delay as needed. // current 1 sec is probably too long timer = (function(){ repeated = false; }).defer(1000); } } }); } defineDoubleKeyMap("my-element", { key: Ext.EventObject.ENTER, fn: myHandle, scope: myObject }); 

With this code, it follows that a quick press of ENTER - DELETE - ENTER also fires an event as if ENTER - ENTER were pressed. If this is unacceptable, you need to keep track of all keystrokes - I think you will have to use Ext.get("my-element").on("keypress") for this.