├── .gitignore
├── LICENSE.md
├── README.md
├── index.html
├── index.js
└── package.json
/.gitignore:
--------------------------------------------------------------------------------
1 | .DS_Store
2 | node_modules
3 | npm-debug.log
4 |
--------------------------------------------------------------------------------
/LICENSE.md:
--------------------------------------------------------------------------------
1 | CC0 1.0 Universal
2 |
3 | Statement of Purpose
4 |
5 | The laws of most jurisdictions throughout the world automatically confer
6 | exclusive Copyright and Related Rights (defined below) upon the creator and
7 | subsequent owner(s) (each and all, an "owner") of an original work of
8 | authorship and/or a database (each, a "Work").
9 |
10 | Certain owners wish to permanently relinquish those rights to a Work for the
11 | purpose of contributing to a commons of creative, cultural and scientific
12 | works ("Commons") that the public can reliably and without fear of later
13 | claims of infringement build upon, modify, incorporate in other works, reuse
14 | and redistribute as freely as possible in any form whatsoever and for any
15 | purposes, including without limitation commercial purposes. These owners may
16 | contribute to the Commons to promote the ideal of a free culture and the
17 | further production of creative, cultural and scientific works, or to gain
18 | reputation or greater distribution for their Work in part through the use and
19 | efforts of others.
20 |
21 | For these and/or other purposes and motivations, and without any expectation
22 | of additional consideration or compensation, the person associating CC0 with a
23 | Work (the "Affirmer"), to the extent that he or she is an owner of Copyright
24 | and Related Rights in the Work, voluntarily elects to apply CC0 to the Work
25 | and publicly distribute the Work under its terms, with knowledge of his or her
26 | Copyright and Related Rights in the Work and the meaning and intended legal
27 | effect of CC0 on those rights.
28 |
29 | 1. Copyright and Related Rights. A Work made available under CC0 may be
30 | protected by copyright and related or neighboring rights ("Copyright and
31 | Related Rights"). Copyright and Related Rights include, but are not limited
32 | to, the following:
33 |
34 | i. the right to reproduce, adapt, distribute, perform, display, communicate,
35 | and translate a Work;
36 |
37 | ii. moral rights retained by the original author(s) and/or performer(s);
38 |
39 | iii. publicity and privacy rights pertaining to a person's image or likeness
40 | depicted in a Work;
41 |
42 | iv. rights protecting against unfair competition in regards to a Work,
43 | subject to the limitations in paragraph 4(a), below;
44 |
45 | v. rights protecting the extraction, dissemination, use and reuse of data in
46 | a Work;
47 |
48 | vi. database rights (such as those arising under Directive 96/9/EC of the
49 | European Parliament and of the Council of 11 March 1996 on the legal
50 | protection of databases, and under any national implementation thereof,
51 | including any amended or successor version of such directive); and
52 |
53 | vii. other similar, equivalent or corresponding rights throughout the world
54 | based on applicable law or treaty, and any national implementations thereof.
55 |
56 | 2. Waiver. To the greatest extent permitted by, but not in contravention of,
57 | applicable law, Affirmer hereby overtly, fully, permanently, irrevocably and
58 | unconditionally waives, abandons, and surrenders all of Affirmer's Copyright
59 | and Related Rights and associated claims and causes of action, whether now
60 | known or unknown (including existing as well as future claims and causes of
61 | action), in the Work (i) in all territories worldwide, (ii) for the maximum
62 | duration provided by applicable law or treaty (including future time
63 | extensions), (iii) in any current or future medium and for any number of
64 | copies, and (iv) for any purpose whatsoever, including without limitation
65 | commercial, advertising or promotional purposes (the "Waiver"). Affirmer makes
66 | the Waiver for the benefit of each member of the public at large and to the
67 | detriment of Affirmer's heirs and successors, fully intending that such Waiver
68 | shall not be subject to revocation, rescission, cancellation, termination, or
69 | any other legal or equitable action to disrupt the quiet enjoyment of the Work
70 | by the public as contemplated by Affirmer's express Statement of Purpose.
71 |
72 | 3. Public License Fallback. Should any part of the Waiver for any reason be
73 | judged legally invalid or ineffective under applicable law, then the Waiver
74 | shall be preserved to the maximum extent permitted taking into account
75 | Affirmer's express Statement of Purpose. In addition, to the extent the Waiver
76 | is so judged Affirmer hereby grants to each affected person a royalty-free,
77 | non transferable, non sublicensable, non exclusive, irrevocable and
78 | unconditional license to exercise Affirmer's Copyright and Related Rights in
79 | the Work (i) in all territories worldwide, (ii) for the maximum duration
80 | provided by applicable law or treaty (including future time extensions), (iii)
81 | in any current or future medium and for any number of copies, and (iv) for any
82 | purpose whatsoever, including without limitation commercial, advertising or
83 | promotional purposes (the "License"). The License shall be deemed effective as
84 | of the date CC0 was applied by Affirmer to the Work. Should any part of the
85 | License for any reason be judged legally invalid or ineffective under
86 | applicable law, such partial invalidity or ineffectiveness shall not
87 | invalidate the remainder of the License, and in such case Affirmer hereby
88 | affirms that he or she will not (i) exercise any of his or her remaining
89 | Copyright and Related Rights in the Work or (ii) assert any associated claims
90 | and causes of action with respect to the Work, in either case contrary to
91 | Affirmer's express Statement of Purpose.
92 |
93 | 4. Limitations and Disclaimers.
94 |
95 | a. No trademark or patent rights held by Affirmer are waived, abandoned,
96 | surrendered, licensed or otherwise affected by this document.
97 |
98 | b. Affirmer offers the Work as-is and makes no representations or warranties
99 | of any kind concerning the Work, express, implied, statutory or otherwise,
100 | including without limitation warranties of title, merchantability, fitness
101 | for a particular purpose, non infringement, or the absence of latent or
102 | other defects, accuracy, or the present or absence of errors, whether or not
103 | discoverable, all to the greatest extent permissible under applicable law.
104 |
105 | c. Affirmer disclaims responsibility for clearing rights of other persons
106 | that may apply to the Work or any use thereof, including without limitation
107 | any person's Copyright and Related Rights in the Work. Further, Affirmer
108 | disclaims responsibility for obtaining any necessary consents, permissions
109 | or other rights required for any use of the Work.
110 |
111 | d. Affirmer understands and acknowledges that Creative Commons is not a
112 | party to this document and has no duty or obligation with respect to this
113 | CC0 or use of the Work.
114 |
115 | For more information, please see
116 |
117 |
--------------------------------------------------------------------------------
/README.md:
--------------------------------------------------------------------------------
1 | # keyboardevent-key-polyfill
2 |
3 | Polyfill for `KeyboardEvent.prototype.key`.
4 |
5 | > **NOTE:** All major browsers [now support `KeyboardEvent.prototype.key`](http://caniuse.com/#feat=keyboardevent-key). Firefox already shipped with this for a while; recent versions of Edge, Chrome, and Safari also now have shipped support. This will still enable `KeyboardEvent.prototype.key` in environments where it may not yet be available.
6 |
7 |
8 | ## Example
9 |
10 | __[View Demo](https://cvan.io/keyboardevent-key-polyfill/)__
11 |
12 |
13 |
14 | Say goodbye to this:
15 |
16 | ```js
17 | document.addEventListener('keydown', function (e) {
18 | console.log('Code of key pressed:', e.which || e.keyCode); // 39
19 | });
20 | ```
21 |
22 | And hello to this:
23 |
24 | ```js
25 | document.addEventListener('keydown', function (e) {
26 | console.log('Name of key pressed:', e.key); // ArrowRight
27 | });
28 | ```
29 |
30 | ## Usage
31 |
32 | ### From standalone script
33 |
34 | Just drop the script on your page and call the `polyfill` method.
35 |
36 | ```html
37 |
38 |
39 | ```
40 |
41 | If you're using AMD:
42 |
43 | ```js
44 | require('keyboardevent-key-polyfill').polyfill();
45 | ```
46 |
47 | ### From npm (Node/Browserify/WebPack)
48 |
49 | Install from [npm](https://www.npmjs.com/package/keyboardevent-key-polyfill):
50 |
51 | ```bash
52 | npm install keyboardevent-key-polyfill
53 | ```
54 |
55 | Then require the CommonJS module for use with [Browserify](http://browserify.org)/[webpack](https://webpack.js.org/):
56 |
57 | ```js
58 | require('keyboardevent-key-polyfill').polyfill();
59 | ```
60 |
61 |
62 | ## License
63 |
64 | All code and content within this source-code repository is licensed under the [**Creative Commons Zero v1.0 Universal** license (CC0 1.0 Universal; Public Domain Dedication)](LICENSE.md).
65 |
66 | You can copy, modify, distribute and perform this work, even for commercial purposes, all without asking permission.
67 |
68 | For more information, refer to these following links:
69 |
70 | * a copy of the [license](LICENSE.md) in [this source-code repository](https://github.com/cvan/keyboardevent-key-polyfill)
71 | * the [human-readable summary](https://creativecommons.org/publicdomain/zero/1.0/) of the [full text of the legal code](https://creativecommons.org/publicdomain/zero/1.0/legalcode)
72 | * the [full text of the legal code](https://creativecommons.org/publicdomain/zero/1.0/legalcode)
73 |
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 | keyboardevent-key-polyfill demo
6 |
15 |
16 |
17 |
18 | keyboardevent-key-polyfill demo
19 | Press any key
20 |
21 |
22 |
23 |
36 |
37 |
38 |
--------------------------------------------------------------------------------
/index.js:
--------------------------------------------------------------------------------
1 | /* global define, KeyboardEvent, module */
2 |
3 | (function () {
4 |
5 | var keyboardeventKeyPolyfill = {
6 | polyfill: polyfill,
7 | keys: {
8 | 3: 'Cancel',
9 | 6: 'Help',
10 | 8: 'Backspace',
11 | 9: 'Tab',
12 | 12: 'Clear',
13 | 13: 'Enter',
14 | 16: 'Shift',
15 | 17: 'Control',
16 | 18: 'Alt',
17 | 19: 'Pause',
18 | 20: 'CapsLock',
19 | 27: 'Escape',
20 | 28: 'Convert',
21 | 29: 'NonConvert',
22 | 30: 'Accept',
23 | 31: 'ModeChange',
24 | 32: ' ',
25 | 33: 'PageUp',
26 | 34: 'PageDown',
27 | 35: 'End',
28 | 36: 'Home',
29 | 37: 'ArrowLeft',
30 | 38: 'ArrowUp',
31 | 39: 'ArrowRight',
32 | 40: 'ArrowDown',
33 | 41: 'Select',
34 | 42: 'Print',
35 | 43: 'Execute',
36 | 44: 'PrintScreen',
37 | 45: 'Insert',
38 | 46: 'Delete',
39 | 48: ['0', ')'],
40 | 49: ['1', '!'],
41 | 50: ['2', '@'],
42 | 51: ['3', '#'],
43 | 52: ['4', '$'],
44 | 53: ['5', '%'],
45 | 54: ['6', '^'],
46 | 55: ['7', '&'],
47 | 56: ['8', '*'],
48 | 57: ['9', '('],
49 | 91: 'OS',
50 | 93: 'ContextMenu',
51 | 106: '*',
52 | 107: '+',
53 | 109: '-',
54 | 110: '.',
55 | 111: '/',
56 | 144: 'NumLock',
57 | 145: 'ScrollLock',
58 | 181: 'VolumeMute',
59 | 182: 'VolumeDown',
60 | 183: 'VolumeUp',
61 | 186: [';', ':'],
62 | 187: ['=', '+'],
63 | 188: [',', '<'],
64 | 189: ['-', '_'],
65 | 190: ['.', '>'],
66 | 191: ['/', '?'],
67 | 192: ['`', '~'],
68 | 219: ['[', '{'],
69 | 220: ['\\', '|'],
70 | 221: [']', '}'],
71 | 222: ["'", '"'],
72 | 224: 'Meta',
73 | 225: 'AltGraph',
74 | 246: 'Attn',
75 | 247: 'CrSel',
76 | 248: 'ExSel',
77 | 249: 'EraseEof',
78 | 250: 'Play',
79 | 251: 'ZoomOut'
80 | }
81 | };
82 |
83 | // Function keys (F1-24).
84 | var i;
85 | for (i = 1; i < 25; i++) {
86 | keyboardeventKeyPolyfill.keys[111 + i] = 'F' + i;
87 | }
88 |
89 | // Printable ASCII characters.
90 | var letter = '';
91 | for (i = 65; i < 91; i++) {
92 | letter = String.fromCharCode(i);
93 | keyboardeventKeyPolyfill.keys[i] = [letter.toLowerCase(), letter.toUpperCase()];
94 | }
95 |
96 | // Numbers on numeric keyboard.
97 | for (i = 96; i < 106; i++) {
98 | letter = String.fromCharCode(i - 48);
99 | keyboardeventKeyPolyfill.keys[i] = letter;
100 | }
101 |
102 | function polyfill () {
103 | var isEdgeOrIE = (navigator.userAgent.indexOf("MSIE ") > 0 || !!navigator.userAgent.match(/Trident.*rv\:11\./) || navigator.userAgent.indexOf("Edge/") > 0);
104 | if (!('KeyboardEvent' in window) ||
105 | ('key' in KeyboardEvent.prototype && !isEdgeOrIE)) {
106 | return false;
107 | }
108 |
109 | // Polyfill `key` on `KeyboardEvent`.
110 | var proto = {
111 | get: function (x) {
112 | var key = keyboardeventKeyPolyfill.keys[this.which || this.keyCode];
113 |
114 | if (Array.isArray(key)) {
115 | key = key[+this.shiftKey];
116 | }
117 |
118 | return key;
119 | },
120 | enumerable: true,
121 | configurable: true
122 | };
123 | Object.defineProperty(KeyboardEvent.prototype, 'key', proto);
124 | return proto;
125 | }
126 |
127 | if (typeof define === 'function' && define.amd) {
128 | define('keyboardevent-key-polyfill', keyboardeventKeyPolyfill);
129 | } else if (typeof exports !== 'undefined' && typeof module !== 'undefined') {
130 | module.exports = keyboardeventKeyPolyfill;
131 | } else if (window) {
132 | window.keyboardeventKeyPolyfill = keyboardeventKeyPolyfill;
133 | }
134 |
135 | })();
136 |
--------------------------------------------------------------------------------
/package.json:
--------------------------------------------------------------------------------
1 | {
2 | "name": "keyboardevent-key-polyfill",
3 | "version": "1.1.0",
4 | "description": "polyfill for `KeyboardEvent.prototype.key`",
5 | "main": "index.js",
6 | "author": {
7 | "name": "Chris Van",
8 | "url": "https://twitter.com/cvanw/"
9 | },
10 | "license": "CC0-1.0",
11 | "homepage": "https://github.com/cvan/keyboardevent-key-polyfill/",
12 | "repository": "cvan/keyboardevent-key-polyfill",
13 | "bugs": {
14 | "url": "https://github.com/cvan/keyboardevent-key-polyfill/issues"
15 | },
16 | "keywords": [
17 | "polyfill",
18 | "event",
19 | "keyboard",
20 | "keyboard-event",
21 | "key",
22 | "key-event",
23 | "client-side",
24 | "browser"
25 | ]
26 | }
27 |
--------------------------------------------------------------------------------