keypress-combination

Attach listeners to keypress combinations like CTRL-1. Lightweight and well documented.

Usage no npm install needed!

<script type="module">
  import keypressCombination from 'https://cdn.skypack.dev/keypress-combination';
</script>

README

Keypress combination

NPM Version Circle CI Coverage Status Dependency Status NPM Downloads

Attach listeners to keypress combinations like CTRL-1. Lightweight and well documented.

// Keycode for CTRL is 17, keycode for 1 is 49
emitter.addListener(17, 49, function() {
  console.log("Pressed CTRL-1");
});

See the demo at jsfiddle.net/pushtell/164prhaz.

Please ★ on GitHub!

Table of Contents

Installation

npm install keypress-combination

Usage

Try it on JSFiddle


var KeypressCombinationEmitter = require("keypress-combination");

var emitter = new KeypressCombinationEmitter();

// CTRL Keycode: 17
// 1 Keycode: 49
var subscription = emitter.addListener(17, 49, function() {
  console.log("Pressed CTRL-1");
});

// Remove the callback when no longer needed.
subscription.remove();

API Reference

KeypressCombinationEmitter

Emitter responsible for coordinating combination keypress events.

constructor

Create a new emitter.

  • Return Type:
  • Parameters:
    • No parameters.

.addListener(keyCode, [keyCode, ...] callback)

Add an event listener

  • Return Type:
  • Parameters:
    • keyCode - Character keycode. See the keycodes section for more information.
      • Required
      • Type: number
      • Example: 49
    • callback - Callback function.
      • Required
      • Type: function
      • Example: function() { console.log("Press") }

Subscription

.remove()

  • Return Type: No return value
  • Parameters:
    • No parameters.

Keycodes

Note that keycodes are not fully standardized across browsers.

Key Code
Backspace 8
Tab 9
Enter 13
Shift 16
Ctrl 17
Alt 18
Pause/Break 19
Caps Lock 20
Escape 27
(space) 32
Page Up 33
Page Down 34
End 35
Home 36
Left Arrow 37
Up Arrow 38
Right Arrow 39
Down Arrow 40
Insert 45
Delete 46
0 48
1 49
2 50
3 51
4 52
5 53
6 54
7 55
8 56
9 57
A 65
B 66
C 67
D 68
E 69
F 70
G 71
H 72
I 73
J 74
K 75
L 76
M 77
N 78
O 79
P 80
Q 81
R 82
S 83
T 84
U 85
V 86
W 87
X 88
Y 89
Z 90
Left Window Key 91
Right Window Key 92
Select Key 93
Numpad 0 96
Numpad 1 97
Numpad 2 98
Numpad 3 99
Numpad 4 100
Numpad 5 101
Numpad 6 102
Numpad 7 103
Numpad 8 104
Numpad 9 105
Multiply 106
Add 107
Subtract 109
Decimal Point 110
Divide 111
F1 112
F2 113
F3 114
F4 115
F5 116
F6 117
F7 118
F8 119
F9 120
F10 121
F11 122
F12 123
Num Lock 144
Scroll Lock 145
Semi-Colon 186
Equal Sign 187
Comma 188
Dash 189
Period 190
Forward Slash 191
Grave Accent 192
Open Bracket 219
Back Slash 220
Close Braket 221
Single Quote 222

Tests

Browser Coverage

Karma tests are performed on Browserstack in the following browsers:

  • IE 9, Windows 7
  • IE 10, Windows 7
  • IE 11, Windows 7
  • Opera (latest version), Windows 7
  • Firefox (latest version), Windows 7
  • Chrome (latest version), Windows 7
  • Safari (latest version), OSX Yosemite
  • Mobile Safari (latest version), iPhone 6, iOS 8.3

Please let us know if a different configuration should be included here.

Running Tests

Locally:


npm test

On Browserstack:


BROWSERSTACK_USERNAME=YOUR_USERNAME BROWSERSTACK_ACCESS_KEY=YOUR_ACCESS_KEY npm test