Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

add ESM source module #10

Merged
merged 2 commits into from
Oct 9, 2020
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 1 addition & 0 deletions .gitignore
Original file line number Diff line number Diff line change
@@ -1 +1,2 @@
.idea/
node_modules/
85 changes: 63 additions & 22 deletions README.md
Original file line number Diff line number Diff line change
@@ -1,50 +1,91 @@
keycharm
========
# keycharm

Easy and free library for binding keys.

## Install

Keycharm is on npm so you can install it with:
```

```bash
npm install keycharm
```

## Import

### IIFE (browser)

Example:
After importing the script `keycharm` is availible globally:

```html
<script src="https://unpkg.com/keycharm/keycharm.js">
```
var keys = keycharm(options);

keys.bind("a", function () {}, 'keydown'); // key, callback function, 'keydown' or 'keyup'
### CommonJS

```js
const keycharm = require('keycharm');
```

Available options (all are optional):
### ESM

```js
import keycharm from 'keycharm';
```

## Usage

```js
var keys = keycharm(options);
keys.bind("a", function () {}, 'keydown'); // key, callback function, 'keydown' or 'keyup'
```

### Available options (all are optional)

```js
{
container: document.getElementById("element"), // optional div to bind keycharm to. It will NEED a tabindex. When not supplied, this defaults to window.
preventDefault: true/false // default value: false;
/* optional div to bind keycharm to.
* It will NEED a tabindex. When not supplied, this defaults to window. */
container: document.getElementById("element"),

/* swallow events (default: false) */
preventDefault: false
}
```

Supported keys:
### Supported keys

```
'a'-'z', 'A'-'Z', '0'-'9', 'F1'-'F12', 'space', 'enter', 'ctrl', 'alt', 'tab', 'shift',
'delete', 'esc', 'backspace', '-','=', '[', ']', 'left', 'up', 'right', 'down', 'pageup', 'pagedown'
```txt
'a'-'z', 'A'-'Z', '0'-'9', 'space', 'enter', 'ctrl', 'alt', 'tab', 'shift', 'delete', 'backspace', '-', '=', '[', ']',

'esc', 'F1'-'F12', 'pageup', 'pagedown',

'left', 'up', 'right', 'down',

numpad: 'num0'-'num9', 'num/', 'num*', 'num-', 'num+', 'num.'
'num0'-'num9', 'num/', 'num*', 'num-', 'num+', 'num.'
```

Each initiation of keycharm has its own bindings to the key events.

Available methods:
### Available methods

```
.bind(key, callback, [type]); // bind key, type = 'keydown' or 'keyup', default type = keydown.
.unbind(key, [callback], [type]); // unbind key, type = 'keydown' or 'keyup', default type = keydown. No callback deletes all bound callbacks from key
.reset(); // remove all bound keys
.destroy(); // remove all bound keys and the event listeners of keycharm
.getKey(event); // get the key label of the event
.bindAll(function, 'keydown' or 'keyup'); // bind all keys to this function, could be used for testing or demos.
```js
/* bind key, type = 'keydown' or 'keyup', default type = keydown. */
.bind(key, callback, [type]);

/* unbind key, type = 'keydown' or 'keyup', default type = keydown. No callback deletes all bound callbacks from key */
.unbind(key, [callback], [type]);

/* remove all bound keys */
.reset();

/* remove all bound keys and the event listeners of keycharm */
.destroy();

/* get the key label of the event */
.getKey(event);

/* bind all keys to this function, could be used for testing or demos. */
.bindAll(function, 'keydown' or 'keyup');
```

Common Pitfalls:
Expand Down
34 changes: 10 additions & 24 deletions keycharm.js
Original file line number Diff line number Diff line change
@@ -1,25 +1,12 @@
"use strict";
/**
* Created by Alex on 11/6/2014.
*/

// https://github.com/umdjs/umd/blob/master/returnExports.js#L40-L60
// if the module has no dependencies, the above pattern can be simplified to
(function (root, factory) {
if (typeof define === 'function' && define.amd) {
// AMD. Register as an anonymous module.
define([], factory);
} else if (typeof exports === 'object') {
// Node. Does not work with strict CommonJS, but
// only CommonJS-like environments that support module.exports,
// like Node.
module.exports = factory();
} else {
// Browser globals (root is window)
root.keycharm = factory();
}
}(this, function () {

(function (global, factory) {
typeof exports === 'object' && typeof module !== 'undefined' ? module.exports = factory() :
typeof define === 'function' && define.amd ? define(factory) :
(global = typeof globalThis !== 'undefined' ? globalThis : global || self, global.keycharm = factory());
}(this, (function () { 'use strict';

/**
* Created by Alex on 11/6/2014.
*/
function keycharm(options) {
var preventDefault = options && options.preventDefault || false;

Expand Down Expand Up @@ -188,6 +175,5 @@
}

return keycharm;
}));


})));
198 changes: 198 additions & 0 deletions package-lock.json

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

13 changes: 12 additions & 1 deletion package.json
Original file line number Diff line number Diff line change
Expand Up @@ -4,6 +4,17 @@
"description": "Simple, lightweight key-binding lib",
"version": "0.3.0",
"license": "(Apache-2.0 OR MIT)",
"repository": "https://github.com/AlexDM0/keycharm",
"main": "keycharm.js",
"repository": "https://github.com/AlexDM0/keycharm"
"module": "./src/keycharm.js",
"scripts": {
"build": "rollup ./src/keycharm.js --file keycharm.js --format umd --output.name keycharm"
},
"pre-commit": [
"build"
],
"devDependencies": {
"pre-commit": "^1.2.2",
"rollup": "^2.28.2"
}
}
Loading