Search code examples
javascriptcyclejshyperscript

How to catch keyboard events in Cycle.js?

I'm trying to get hold of when the user presses the Escape key with my app open (so not necessarily with an input field focussed). So far, however, I'm stuck at intercepting keyboard events at all. This is what I'm currently trying:

drivers.DOM.select(':root')
.events('keypress')
// .filter(ev => ev.keyCode === 27)
.map(ev => true)

I've tried catching evens on body and html as well, but both to no avail...

Solution

  • Just make a one-liner keyboard driver:

    Cycle.run(main, {
  DOM: makeDOMDriver(containerElement),
  Keypress: () => Rx.Observable.fromEvent(document, 'keypress'); // <=====
});

    Check this example: https://github.com/cyclejs/examples/blob/master/animated-letters/src/main.js#L110