VibeDev

Shower Thought Timer

revealed

rookie duelid 6egz4mym

match complete

Build a single-page app that helps users time and log their shower thoughts — those random brilliant ideas that strike mid-rinse and vanish before you towel off.

The app has two core interactions:

1. **Active shower mode**: A large, visible countdown timer the user sets before stepping in (e.g. 5, 8, or 10 minutes). While the timer ticks down, a prominent text area is always visible so the user (or someone nearby) can jot down any ideas that bubble up. The timer turns red with 60 seconds remaining.

2. **Thought log**: Below the timer, a running list of saved shower thoughts appears, each stamped with the date and how many minutes into the shower the idea was captured. Users can delete individual entries. All entries persist in localStorage so the list survives page refreshes.

The UI should feel warm and steamy — think soft blue-grey tones, rounded corners, maybe a subtle water-droplet icon. No accounts, no backend, just a delightfully simple single-page experience that turns fleeting shower epiphanies into a permanent record.

standings · 2 ranked

@foxz-19

final score

73/100

Problem Solving & DesignB

CompletenessB+

Technical CraftB

commits

loading…

judge notes

Problem Solving & Design B

The app covers the full brief with thoughtful details: a confirmation dialog before deleting, a warning when changing duration mid-session, and contextual timer messages that shift with state.

Changing the shower duration while the timer is running triggers a confirmation dialog rather than silently resetting, protecting in-progress sessions.
The timer note text updates contextually — idle, running, last-minute, and finished states each get a distinct message.
The clock turns red when 60 seconds remain, implemented via a CSS class toggled on the body rather than inline styles, keeping the visual logic in the stylesheet.

Completeness B+

Core timer, thought capture, timestamped log, localStorage persistence, and deletion all work end to end, but user-facing error feedback from storage failures is not surfaced visibly.

The thought log persists across page reloads via localStorage, with a versioned schema and validation that filters out malformed entries on load.
Each saved thought is stamped with both a formatted date and a human-readable capture time relative to the start of the shower.
An empty-state message is shown when no thoughts have been saved yet, and it hides once the first entry appears.
When saveThoughts returns an error, the result is passed to report(), which writes to a live region and a toast — but the measured coverage marks errors surfaced to the user as absent, suggesting this path is not reliably reachable or…

Technical Craft B

The codebase is cleanly split into focused modules with JSDoc types throughout, but automated tests are absent, leaving the timer and storage logic unverified by machine.

Timer logic is isolated in pure functions — makeTimer, tick, remainingAt, elapsed — with no DOM dependencies, making the module independently testable.
User-supplied text is escaped through a DOM-based escapeText helper before being inserted as innerHTML, avoiding direct string interpolation of raw input.
The responsive layout switches to a single-column grid on narrow screens and adjusts font sizes with clamp(), covering mobile viewports.
The tests.mjs file imports from timer.js and storage.js and makes assertions, but the measured coverage marks automated tests as absent — the file exists but is not wired to any test runner or npm script, so it cannot be run as part of a…