frp-keyboard

An FRP implementation of Elm.Keyboard in JS

Example

var Keyboard = require("frp-keyboard");
 
var keyboard = Keyboard()
 
keyboard.wasd(function (coords) {
  console.log('x', coords.x, 'y', coords.y)
})
 
// keys is an Array<Number>
keyboard.keysDown(function (keys) {
  console.log('keys down', keys)
})

Docs

var keyboard = Keyboard()

import { Observ } from 'observ'
 
type KeyCode := Number
type Direction = 'left' | 'right' | 'up' | 'down' | 'void'
type Coord := {
    x: Number,
    y: Number,
    lastPressed: Direction
}
 
frp-keyboard := () => {
    arrows: Observ<Coord>,
    wasd: Observ<Coord>,
    ctrl: Observ<Boolean>,
    shift: Observ<Boolean>,
    isDown: (keyCode: KeyCode) => Observ<Boolean>,
    keysDown: Observ<Array<keyCode: KeyCode>>,
    lastPressed: Observ<keyCode: KeyCode>,
    directions: (
        up: KeyCode, down: KeyCode, left: KeyCode, right: KeyCode
    ) => Observ<Coord>
}

Keyboard() returns a keyboard object with a set of observables and functions over observables.

A lot of the values in frp-keyboard are instances of Observ from the 'observ' module

keyboard.arrows

keyboard.arrows is an observable that contains the state of the arrow keys as a tuple { x: Number, y: Number }

You can read from keyboard.arrows by calling it as a function with an optional listener function

var currentX = keyboard.arrows().x
 
keyboard.arrows(function (tuple) {
  console.log('x', tuple.x)
})

keyboard.arrows also has a .lastPressed property on the returned co-ordinate so you can determine whether a diagonal state of { x: 1, y: 1 } was up, right or right, up

keyboard.wasd

Just like keyboard.arrows, it allows you to read the state of the wasd keys instead.

keyboard.directions(up, down, left, right)

If you want to define your own set of direction keys you can use the directions(). This will return an observable that returns the { x: Number, y: Number } tuple.

var hjkl = keyboard.directions(
  74, // j
  75, // k
  72, // h
  76  // l
)
 
hjkl(function (coords) {
  console.log('coords.x', coords.x, 'coords.y', coords.y)
})

keyboard.ctrl and keyboard.shift

keyboard.ctrl and keyboard.shift are observable booleans that tell you whether ctrl and shift are pressed down.

var xDown = keyboard.keyDown(Number)

keyDown() returns an observable boolean that tells you whether said key is down.

You pass keyDown a numeric value that matches the keyCode

You can find a list of what the numeric key codes are on MDN

keyboard.keysDown

keysDown is an observable containing an array of key codes.

The keysDown observable represents the lists of keys that are currently being pressed down.

var computed = require('observ/computed')
var Keyboard = require('frp-keyboard')
var keyboard = Keyboard()
 
var keysDown = keyboard.keysDown
 
var isEnter = computed([keysDown], function (keysDown) {
  return keysDown.some(function (keyCode) {
    return keyCode === 13 // ENTER
  })
})

keyboard.lastPressed

lastPressed is an observable that contains the last keycode that was pressed by the user.

Installation

npm install frp-keyboard

Tests

npm test

Contributors

• Raynos

MIT Licenced