The only way to bind to ? currently is to bind to "shift-slash," which only works on some keyboards. The trouble is that the only way to do a real binding to ? is to use onKeyPress, instead of onKeyUp, which doesn't work in other cases. This is a known problem area for nearly all keybinding libraries. I'd love to hear your thoughts on how to do this elegantly.

Hi,

I find the keyboard bindings are still being applied even when focus is in an input field.

Any tips/suggestions on how to handle this, eg if an input field has focus, disable/ignore the keyboardjs bindings.

I am using the latest code on github...

Thanks, Chris

It only happens when preventRepeat() is not called in the callback function.

Tested with Chromium 62 under gnu/linux debian testing.

edit: thanks for the great lib ;)

I've only tested this in Chrome (16.0.912.59) on OSX Lion, so I can't tell you if this is something occurring in other browsers.

When pressing Cmd and at least one alphanumeric key (0-9a-z), the alphanumeric keys don't fire the keyup event when they are released first and therefore are not removed from the "active keys" list. When you release the Cmd key first everything is fine.

– Wouter

This PR basically modernizes the library with the following features:

• Code updated to es6: much more readable code taking all advantages of the latest version of the language :)
• Uses webpack over browserify
• Adds yarn lock

How do I pass every pressed and released key to keyboardJS? For example:

      keyboardJS.bind(globalKey, function(e) {
          e.preventRepeat();
          console.log(globalKey+'is pressed');
      }, function(e) {
          console.log(globalKey+'is released');
      });

Is there a way to control the delay between keys pressed? E.g. if I have a keybinding of "g + i" I have to press G then I pretty fast, but if you look at gmails shortcuts you can press g then wait and then press i about > 1.5 seconds and it will still work. Thoughts?

I used the exact sample called "Prevent keydown repeat" from Readme. Results I'm getting: after pressing the A key, "a is pressed" is printed once. Holding the key doesn't result in printing it more times - correct. But after releasing the key and pressing it again, nothing is printed - so the combo works in fact only once. Is it correct behavior or should it trigger again after releasing the key and pressing it again?

So here's my issue:

I use command+right to switch tabs to the right and command+left to switch to tabs to the left. If I hold down command, press command+right things work as expected. But when I press command+left (while continuing to holding down the command key) the tab to the right is again selected. Things work fine when I lift up the command key in between actions.

Now active keys will be removed the only when meta key is pressed up ( #19 ). But in this case we catch a bug #63.

I found the easy solution: manually remove handled active keys. For example:

kb.on('cmd + c', copy);
kb.on('cmd + v', paste);

var copy = function () {
  // do copy
  kb.removeActiveKey('c');
};

var paste = function () {
  // do paste
  kb.removeActiveKey('v');
};

Of course, it's not very user friendly solution, but it's tiny and it's works just now. Can you add the PR as temporary patch?

I wanted to implement multiple states within my system. Each state would have a different set of keyboard bindings. At first I was able to get away with a quick fix to the library by providing the ability to toggle enabled/disabled.

  KeyboardJS.enable = function() {
    KeyboardJS.enabled = true;
  };

  KeyboardJS.disable = function() {
    KeyboardJS.enabled = false;
  };

  KeyboardJS.toggle = function() {
    KeyboardJS.enabled = !KeyboardJS.enabled;
  };

  KeyboardJS.enabled = true;

    function keydown(event) {
      if (!KeyboardJS.enabled) { return; }
      // ...
    }

    ///...

However, I wanted to add states with names that I could toggle between. Another way that I thought I could get away with this is to try and not augment anymore of the existing library and compose multiple KeyboardJS objects with different bindings and enable/disable them as I needed. However, that is not possible with the current implementation.

So I finally came upon an ugly solution which would simply set and remove bindings when appropriate.

$(document).ready(function() {

  KeyboardJS.on('graveaccent', function(){
    $.publish("console:show");
  });

  KeyboardJS.on('space, right, pagedown, down', function(){
    $.publish("presentation:slide:next");
  });

  KeyboardJS.on('shift + space, left, pageup, up', function(){
    $.publish("presentation:slide:previous");
  });

  $.subscribe("console:show",function() {
    KeyboardJS.clear();

    KeyboardJS.on('graveaccent', function(){
      $.publish("console:hidden");
    });
  });

When the console:show event is triggered I would clear all mappings and defined only the ones that are available at the moment. In this case I receive an error:

Uncaught Error: Cannot parse "keyCombo" because its type is "undefined". It must be a "string". 

Ideally I would love to implement the second solution and will work toward that solution. But maybe you could provide an example of how I could make this work if it is already possible.

Hi, I'm trying to bind Command + W / Control + W to another function. I tried:

keyboardJS.unbind("command + w");
keyboardJS.bind("command + w", (e) => {
    // some other functions
});

but the browser will just close my page... any advice will be appreciated XD Thank you in advance

Describe the bug I am trying to bind a key combination like "k > k".

Example code

keyboardjs.bind("k > k", () => {
    console.log("k was pressed and then again k was pressed")
});

Expected behavior Event should have been triggered

Enviroment

• OS: Windows
• Browser Edge
• Version 2.7.0

Describe the bug Listening secondary key symbols (!@#$%^&*()_+?) not firing event. However binding primary key together with secondary will work.

Example code

let keys = ['!', '@', '#', '$', '%', '^', '&', '*', '(', ')', '_', '+', '?'];
keyboardjs.on(keys, (event) => {
  console.log(event); // no output
});

keys = [...keys, '1', '/'];
// keys = ['!', '@', '#', '$', '%', '^', '&', '*', '(', ')', '_', '+', '?', '1', '/']
keyboardjs.on(keys, (event) => {
  console.log(event); // output from "!", "?", "/", "1"
});

Expected behavior Expecting console.log output with event data when pressing Shift + Digit or other key, but nothing in console.

Enviroment (please include the following info):

• OS: macOS
• Browser Chrome
• Version 2.6.4

Additional context Maybe it's breaking change, but version 2.5.1 works this way.

Describe the bug

The callback gets called incorrectly on mac.

Example code

keyboardJS.bind('c', () => console.log('c called!'));

• When I press c, it gets called, which is correct.
• When I press shift + c, it gets called, which is incorrect.
• When I press command + c, it gets called, which is incorrect.

Here: https://jsfiddle.net/p7Lbz9uh/

Expected behavior

• When I press shift + c, the callback should not be called.
• When I press command + c, the callback should not be called.

Enviroment (please include the following info):

• OS: macOS
• Browser: Chrome@latest
• Version: Not sure what to put here.

Additional context

When I do:

keyboardJS.bind('c', () => console.log('c got called!'));
keyboardJS.bind('command + c', () => console.log('command + c got called!'));

The correct callback gets called, but shift + c will still say c got called!, but when I do:

keyboardJS.bind('c', () => console.log('c got called!'));
keyboardJS.bind('command + c', () => console.log('command + c got called!'));
keyboardJS.bind('shift + c', () => console.log('shift + c got called!'));

The bug is not existent. https://jsfiddle.net/p7Lbz9uh/1/

What would you like to see added to KeyboardJS?

keyboardJS.reset('contextName');

What problem are you trying to solve?

How to unbind only the keys which belong to a specific context? Currently using reset() globally.

Additional comments

I'm building an 3D editor in the browser and attempting to use the following bindings:

• w a s d to move the camera forward/back/strafe-left/strafe-right
• shift to move the camera down
• space to move the camera up
• mod + z to undo changes
• shift + mod + z to redo changes

The problem i'm facing is that moving the camera down (shift) and the redo function (shift + mod + z) conflict with each other:

KeyboardJS.bind(
  'shift',
  () => console.log('camera: move down'),
  () => console.log('camera: stop moving down')
)
KeyboardJS.bind('mod + shift + z', () => console.log('redo'))

Typically with undo/redo, when redoing something you would hold down mod + shift and then tap z multiple times to redo a bunch of changes in the editor. The problem is that the shift keydown bind (for moving the camera down) triggers immediately and his keyup event doesn't happen until you release all the keys. This results in the camera moving downward while you're redoing a bunch of changes.

I think something like KeyboardJS.releaseBind('shift') would be useful, as we could put it in the mod + shift + z binding to immediately fire the keyup event for the shift binding, effectively cancelling it.

KeyboardJS.bind(
  'shift',
  () => console.log('camera: move down'),
  () => console.log('camera: stop moving down')
)
KeyboardJS.bind('mod+shift+z', () => {
  KeyboardJS.releaseBind('shift')
  console.log('redo')
})

I can't seem to find any workarounds in the mean time, do you have any thoughts on this?

By the way, KeyboardJS is the most robust library i've found so far for browser based editors and games. The others (mousetrap, hotkeys etc) are all missing essential features for this use-case, for example releasing keys on window blur, cmd keyup events etc. Kudos to you for building such a useful package.