All keys strokes you make that are successful will be logged into the log box on the side. Debugging is enabled so if you have Firebug you can open up the console and see the keys you are typing.
This is the most basic usage. Specify the keys in an array and run the callback on success.
$(document).bind('keystrokes', {
keys: ['i', 'p']
}, function(event){
logger('You typed : <em>' + event.keystrokes.stack_item.keys.join(', ') + '</em>');
});
This is an example using a namespace on the event. Once the specified keys are successfully typed, it will run the callback and unbind the event.
$(document).bind('keystrokes.SingleItem', {
keys: ['m', 'arrow down+r']
}, function(event){
// Unbind this event after it's been successfully typed
$(this).unbind(event.keystrokes.stack_item.name);
logger('You typed : <em>' + event.keystrokes.stack_item.keys.join(', ') + '</em>. You cannot type it again because it has been unbound!');
});
In this example you can pass in an array of key sets as data. You can also specify a "success" callback for each key set. The main callback at the end gets called whenever you successfully complete any one of the key combinations in the array stack. You can avoid the main callback from being called by adding 'proceedToMainCallback: false' to the key set.
$(document).bind('keystrokes.OtherNameSpace', [
{
// Define typed keys in sequence
keys: ['h', 'shift+p+o'],
// If false, this will not execute the main callback, only the "success" callback on this stack item
proceedToMainCallback: false,
// The callback bound to this specific stack item
success: function(event){
logger('You typed : <em>' + event.keystrokes.stack_item.keys.join(', ') + '</em>. This has "proceedToMainCallback: false" so it will not call the main callback for this bound event.</em>');
}
},
{
// Define typed keys in sequence
keys: ['j', 'k'],
// The callback bound to this specific stack item
success: function(event){
logger('You typed : <em>' + event.keystrokes.stack_item.keys.join(', ') + '</em>');
}
},
{
// Define typed keys in sequence
keys: ['arrow up+comma+k', 1, 2, 3],
// The callback bound to this specific stack item
success: function(event){
logger('You typed : <em>' + event.keystrokes.stack_item.keys.join(', ') + '</em>');
}
}
// The main callback that gets called with every successful key sequence
// This can be skipped by setting 'proceedToMainCallback: false' as an option in a stack item
], function(event){
// Maybe get the whole stack.. if you want?
var stack = event.keystrokes.stack;
// Get the specific stackee item that was successfully typed
var data_keys = event.keystrokes.stack_item.keys.join(', ');
logger('<span>This is the main callback for selected successful keystrokes. To skip this call, just set "proceedToMainCallback: false" in your stack item: </span> ' + data_keys);
}
);
You can write a custom validation method where you call the shots! This can be used for checking $(event.target).is('iframe') or whatever you want. Return true if your check passes and false if it doesn't.
// Setup with custom validation
$(document).bind('keystrokes.CustomValidation', {
keys: ['c', 'v'],
customValidation: function(event, stack){
// 'this' refers to the element that is bound
// console.log(this, event, stack);
// You can check $(event.target) here to make sure it's something specific
return true;
}
}, function(event){
logger('You typed : <em>' + event.keystrokes.stack_item.keys.join(', ') + '</em>');
});