Jitters on stream

• 

  At 100 panic he pushes to prod and the overlay catches fire until chat types !rollback.

What it is

Jitters is an anxious cartoon monkey who codes, and he lives in the corner of your stream. He reads every message in your Twitch chat as a code review of his work, and he takes all of it personally.

• !coffee caffeinates him. Past 80 caffeine he vibrates and his eye twitches.
• !pat or !hug calms him down.
• !bug <text> files a bug at him: it lands on a sticky note under him, and his panic jumps.
• !fix closes one. !ship with open bugs makes it worse; with none, he ships and celebrates.
• Every plain message is a notification, so a busy chat makes his heart race.
• At 100 panic he pushes to prod and the overlay catches fire: a red alert bar, a stack trace scrolling, flames on the card, until chat types !rollback.
• Five minutes of a quiet chat and he falls asleep at the desk.
• Bits and subs buy him a free coffee and a thank-you.

He answers the last chatter by name in a speech bubble, from 25 lines per kind of event, never the same line twice in a row.

Why streamers would want it

A coding stream is mostly someone quietly typing. Jitters gives chat a job: nervous co-worker care. Viewers get a shared object to poke, the streamer gets a running joke that reacts to the room, and a fire on screen gives everyone a moment to clip. Mods and the broadcaster skip the per-user cooldown, so the streamer can always calm him (or set him off).

How to use it

1. Open the setup page, type your channel name, copy the browser-source link.
2. In OBS: add a Browser Source with that link, 400 x 400.
3. That's it. No login, no token, no server, no install. The overlay is transparent; ?at=br|bl|tr|tl picks the corner, ?demo=1 runs a fake chat to try it.

How it was built with Codex

One brief file came first: the idea in one line, what "done" means, every behaviour, and the look of the character. Then one Codex thread built it from an empty folder, a commit per step: the IRC parser, the mood engine as pure functions with tests, the anonymous Twitch connection, the reactions, the SVG character and the setup page. node --test was the check at every step.

Testing against a live Twitch chat then found a real bug: Twitch's IRC WebSocket reads one command per frame, and the first version sent all four handshake lines in one frame, so the server hung up. The same Codex thread wrote a test with a fake socket that asserts one command per frame, fixed it, and merged the two copies of the connection code into one tested module.

How it works

• src/irc.js parses Twitch IRC lines with tags (display name, colour, badges, bits) as a pure module.
• src/mood.js is the mood engine: step(state, event, now) and tick(state, now), pure and unit-tested; panic and caffeine decay every second.
• The overlay joins the channel anonymously over wss://irc-ws.chat.twitch.tv and reconnects with backoff.
• Jitters is drawn in inline SVG and animated with CSS only, so it stays cheap on a streaming PC.
• Chat text is only ever set as plain text, never as HTML.

What's next

A channel-points reward that buys him a coffee, an EventSub version for raids ("a raid is a production incident"), and a streamer setting for how fragile he is.

Built With

• codex
• css3
• javascript
• obs
• svg
• twitch
• websocket