This is a javascript library for frontend development (both vallina and frameworks) that helps with keyboard binding / combinations .
This currently supports most keys in windows OS you can visit the Home page to check the key code for your machine
- Your script need to be running on a web server, for development you could use,
- live server extension is vscode
- node npx server by running
npx serve - to avoid errors like
<script src="https://codad5.github.io/keybinder/lib/keybinder.js"></script>- Install
npm i domkeybinder- Import
import KeyBinder from 'domkeybinder'- Define your keyboard Controller
const keyController = new KeyBinder({
default_listener: 'keyup', // can be keydown, keypress
element: window, // can be any element or window eg `docmuent.querySelector('.myeditor')
// case_sensitive:true, // this is if you want to make the listener case sensitive
allow_default: true // this is set to default of false and prevents any default keyboard action
})- Add your listener
For easier and better coding experience it best to create a sub function like this
const ListenToKey = (key, ...data) => keyController.ListenToKey(key, ...data)Then you can add listeners like this
ListenToKey('B G', () => {
//your code...
})
ListenToKey('shift c', () => {
//your code...
})OR this
keyController.ListenToKey('enter', (data) => {
//your code...
})
keyController.ListenToKey('ctrl space', () => {
//your code...
})This is if you want to one action(callback), tied to different combination
ListenToKey('ctrl space', 'ctrl m', () => {
alert(`your called ${data.combination}`)
document.querySelector('#scdiv').innerHTML = 'Do you mean Ctrl c? try Ctrl c'
})| method | Description |
|---|---|
| ListenToKey | Add new Listener |
| getCombinations | Get all avaliable combinations |
| clear | Remove all avaliable combinations |
| restore | Restore all previous avaliable combinations |
Check Our Test Website to see the avaliable key commands for
| Key | listener - Command |
|---|---|
| Control | ctrl |
| Shift | Shift |
| Alt | Alt |
| A | A |
| A...Z | A...Z |
| A...Z | A...Z |
| > | arrowup |
| 1 | ! |
| 1...9 | 1...9 |
| f1...f9 | f1...f9 |
| Windows - Home Buttom | meta |
| Listen to any other key | *** |
- Accept Your pull request ✔