Skip to main content
100%

Related to https://twitter.com/timferro/status/705189339890843648 - notify when the user types in a certain word / sequence of chars

✓ Published0🌍 Public
Aalessioalex
Last edited Mar 7, 2016
Created on Mar 7, 2016

This example demonstrates a keyboard shortcut detector that triggers a callback when a user types a specific sequence of characters—here, the name “alexandru.” It shows how a browser can monitor keypresses in real time and react to a predefined pattern. The code uses a plain JavaScript `keydown` event listener on the document, storing key codes in an array and comparing the last entered keys against the target sequence. When the sequence matches, the callback logs a message to the console. No external libraries are used; the implementation relies solely on native DOM event handling.

AI-generated description

Similar vizzes

Loading thumbnail…

Get a notification when a user starts and stops typing on the passed-in `el`.

This example demonstrates a utility for detecting when a user begins and ends typing in a given DOM element, triggering custom `start` and `stop` callback functions. It uses the native `addEventListener` API to listen for `keypress`, `keydown`, and `keyup` events, distinguishing backspace and delete keys from regular input. A configurable `delay` (defaulting to 400ms) controls the idle period before the `stop` notification fires, and the code avoids repeated `start` calls while typing continues. Written in CoffeeScript, the module exports a function that accepts the element and an options object.

Aakre54
62% match
Loading thumbnail…

JS Keyboard Interaction Test

This example demonstrates a bare-bones JavaScript keyboard interaction test, where the page’s body listens for `keydown` events and logs each pressed key’s value to the browser console. The rendering is minimal, using a CSS class for large centered text but no visual output beyond the console log. The code relies on the native DOM `EventListener` API on `document.body` and the `console.log` method, with no external libraries or frameworks. The interaction is limited to keyboard input, with no data source or chart rendering involved.

Pplueckeb@rptu.de
61% match
Loading thumbnail…

browsing tools dotjs snippets

This example shows a collection of JavaScript snippets that add keyboard and mouse shortcuts to specific websites, such as Forrst and Dribbble. It demonstrates how jQuery is used to bind click handlers to page elements, triggering navigation to the next paginated page, and how a custom keydown handler detects the Control key to open a Dribbble shot in a new window. The code relies on jQuery selectors and CSS properties to identify active elements, and it uses `document.location` for redirection. The snippets are designed for the dotjs browser extension, which injects user scripts into matching sites.

TTBD
59% match
Loading thumbnail…

events

This example demonstrates how Backbone.js handles keyboard events within a textarea. Typing in the text field triggers a callback that logs a message to the browser console, showing event binding in action. The code defines a `PasteView` model that attaches `keyup`, `keydown`, and `keypress` handlers using Backbone’s `events` hash, with jQuery managing DOM interaction and Underscore providing utility functions like `bindAll`. No data source or rendering is involved—the focus is purely on event-driven interaction.

Aamundo
58% match
Loading thumbnail…

Autofocus

This example demonstrates how keyboard input can trigger a data visualization update on a web page. It uses a simple input field and listens for keydown events on the document window to display the numeric key code of the pressed key. The code relies on D3 version 3’s `d3.select` and `d3.event` APIs to manage element selection and event handling, and it updates the input element’s value property with the key code. The interaction is minimal, focusing on immediate visual feedback without additional data processing or rendering.

Mmbostock
58% match
Loading thumbnail…

Node.js as an alertnative to Lisp ;-)

This example demonstrates a Node.js command-line tool that maps numeric phone-keypad input to dictionary words, following the classic Lisp challenge from Norvig. It reads a dictionary file and an input stream, building a lookup table of character-to-digit mappings and then recursively matching digit sequences against encoded words. The implementation uses Node.js core APIs like `fs.readFileSync` and `fs.createReadStream` for file I/O, processing the input line-by-line via stream events, and outputs matching words to the console. It highlights the practicality of JavaScript for text-processing puzzles.

RRandomEtc
55% match
Loading thumbnail…

Javascript

This example demonstrates a collection of JavaScript utilities for enhancing web page interactivity, focusing on user-input controls and navigation. It shows how keyboard and click events can be managed to prevent accidental data loss and to streamline table or list interactions. The code uses plain JavaScript with jQuery for DOM manipulation, including the `bind` method for event handling, `history.pushState` for URL updates without page reloads, and jQuery’s `prop` and `is` methods to toggle checkbox states. The snippets cover F5 key disabling, dynamic URL changes, and bulk selection of checkboxes, reflecting a typical admin-panel or form-heavy workflow.

IIliaIdakiev
54% match
Loading thumbnail…

Gist 1b58b0d63cde44ecd225a8a43978fce7

A React-based numeric keypad displays an entered code as bullet points, updating in real time as users click the digit buttons or press number keys on the keyboard. The component manages its own state through React’s `setState` and listens for global `keypress` events via `window.addEventListener`. It renders the keypad using React’s `createClass` and `ReactDOM.render`, with CSS transitions for button hover and active states. The code does not process or validate the entered sequence beyond concatenating and deleting digits.

Aagnott
54% match