Tag Archives: keyboard

Easily see the JavaScript Keyboard Event KeyCodes with keycode.info

Handy helper tool by Wes Bos: simply press any key and see the results for KeyboardEvent.which, KeyboardEvent.key,KeyboardEvent.code, etc. As a user with an AZERTY keyboard layout I often have a broken experience on sites that respond to first row of keys, e.g. QWERTY. As those sites respond to KeyboardEvent.key — which differs from layout to …

Continue reading “Easily see the JavaScript Keyboard Event KeyCodes with keycode.info”

:focus-visible Is Here

With Chromium 86 and now recently Firefox 85 supporting :focus-visible, it’s a good time to refer to this post by Matthias Ott: The :focus-visible pseudo-class lets you show focus styles only when they are needed, using the same heuristic that the browser uses to decide whether to show the default focus indicator. You use :focus-visible …

Continue reading “:focus-visible Is Here”

How Discord Implemented App-Wide Keyboard Navigation

When working on creating a complete keyboard navigation experience for Discord, using styling with :focus and outline, the folks at Discord ran into issues where the outline would not match the shape of actual element being rendered. Thinks like border-radius, overflow: hidden; on the container, padding got in the way. So they set out to …

Continue reading “How Discord Implemented App-Wide Keyboard Navigation”

tinykeys – A tiny and modern library for keybindings

Small and lightweight, I like: import tinykeys from "tinykeys" tinykeys(window, { "Shift+D": () => { alert("The 'Shift' and 'd' keys were pressed at the same time") }, "y e e t": () => { alert("The keys 'y', 'e', 'e', and 't' were pressed in order") }, "$mod+KeyD": () => { alert("Either 'Control+d' or 'Meta+d' were …

Continue reading “tinykeys – A tiny and modern library for keybindings”

Prevent Apple’s “double key press” on the butterfly keyboard with Unshaky

If you’re having this “double key press” issue, Unshaky is a software solution that will help you get by. Unshaky tries to address an issue on the butterfly keyboard (Macbook, Macbook Air 2018 & MacBook Pro 2016 and later): Double Key Press. Unshaky might save your keyboard by dismissing such “second key hits” (any key …

Continue reading “Prevent Apple’s “double key press” on the butterfly keyboard with Unshaky”

NYSKeyboardHelper – A helper for all your iOS keyboard needs

Matthias Nys, a former student of mine, has released his first pod NYSKeyboardHelper, a helper which resizes a scrollview so that it doesn’t go under the keyboard. Add a constraint to your project’s Storyboard and set NYSKeyboardHelper as the custom class, or add it programmatically: let keyboardConstraint = NYSKeyboardHelper(item: self.view, attribute: .bottom, relatedBy: .equal, toItem: …

Continue reading “NYSKeyboardHelper – A helper for all your iOS keyboard needs”

Keystroke Recognition Using WiFi Signals

We’re all doomed: In this paper, we propose a WiFi signal based keystroke recognition system called WiKey. WiKey consists of two Commercial Off-The-Shelf (COTS) WiFi devices, a sender (such as a router) and a receiver (such as a laptop). The sender continuously emits signals and the receiver continuously receives signals. When a human subject types …

Continue reading “Keystroke Recognition Using WiFi Signals”