Cooking Mode

Problem

You are cooking from a recipe on a tablet propped against the backsplash. Your hands are covered in flour. The screen sleeps between step four and step five, and waking it means touching it.

It is a tiny problem that happens every single time anyone uses a recipe site on a device, which is most of how recipe sites get used. Nobody files a complaint about it; they just quietly get annoyed and reach for a cookbook.

Solution

A WordPress plugin that puts a Cooking Mode button on recipe pages and holds a screen wake lock for as long as it’s switched on.

• Uses the browser’s Wake Lock API to hold the display awake, and releases it when toggled back off
• Listens for the browser releasing the lock on its own — which it does whenever the tab is hidden — so the button label can never drift out of sync with reality
• A settings page under wp-admin sets the path prefix, defaulting to /recipes, so the button and its script only load where they belong instead of on every page of the site
• Checks for a secure context up front and says so in plain language, because Wake Lock requires HTTPS and silently doing nothing is the worst possible failure mode

Worth noting

The whole plugin is 105 lines across one PHP file and one JavaScript file, with no build step and no dependencies. Something this small should be readable end to end by whoever inherits the site, and it is.

The path prefix being configurable rather than hard-coded is the one bit of restraint I’d defend hardest — it’s the difference between a plugin that works on one site and one that works on the next one too.