3dtours
bcc24a62c3
- boundary: src/ui/ErrorBoundary.tsx, around the whole app rather than around a screen. A throw on the way to the first paint used to be a white page with nothing in it to report; it is a sentence, the message and the stack now, with a reload beside them, so the next report of a crash carries what went wrong. - one window: src/ui/SingleTab.tsx holds the app to one tab over localStorage and a BroadcastChannel. A second tab on /app or /library is told so and offered the roll — "use this tab" takes it, and the tab that held it gets a bar and the offer back. A tab holding a reading is a tab the machine has already spent its memory on, and a second one beside it is the memory the first will not get. - mount: the studio and the library are mounted the first time their route is asked for and stay mounted after that, not on every visit. Booting CanvasKit (~20MB) and reading the whole catalogue on a page that shows neither is the read and the memory a machine short of either takes for a crash; a trip back from the studio is a screen opening rather than a page loading. - reading: READ_MS bounds one touch of the disk at 30s. getFile and arrayBuffer on a drive that has gone away do not fail, they never settle — the lane waits for ever, the reading never ends, and STOP is a button with nothing left to read it. A frame given up on is a frame the next reading takes up again. - reading: the rows of a walk go down a pass at a time, so a tab that never comes back leaves the column with the folders this reading walked rather than the ones the last reading did. - reading: a stopped reading hands over the numbers it counted instead of null. Handed null it threw its own count away and had noughts written for every folder it walked that the file did not already hold, so a folder added to a drive read nought until the next scan. - repair: STOP ends the afternoon. A repair is a loop the button has no handle on, so it holds the count of stops it started at and compares between rolls, and says it was cut short rather than reporting a run it did not make. - add: a folder the browser could not name — every drive root on Windows is "\" — is asked for one, and a folder whose name is already another folder's is refused rather than folded in with it. The record, the frame ids, the walk's position and the number the column draws are all keyed by that name. - wall: four hundred tiles queued ahead is a reader waiting on frames three screens below the one they are looking at; sixty is a screenful and the wall mints the rest as it scrolls. The catalogue is read back every 30s, not every 5s — reading it back costs every thumbnail in it. - library: the note is drawn under the frame rather than above it. A line that comes and goes in the flow moved the frame, the column and the strip by its own height every time a scan started or ended. - manifest: "id": "/", so the installed app and the tab are one app. - checks: tree-scan-check waited for a count of exactly four rows — a state the screen does not have. The wait ran out its clock and then measured whatever the reading had done since; it waits for the whole tree now.
RecipesCam
RecipesCam is a camera and photo-editing app built around recipes — reusable
looks that carry a film simulation plus a full set of adjustments. You shoot or
open a photo, dial in a look, and keep it as a recipe you can apply again, share
as a .recipe file, or save to your account.
It ships twice from one repository: a React Native (Expo) app for iOS and
Android, and a self-contained web build under docker/ that runs the same
render pipeline in the browser.
What it does
- Shoot with a recipe applied. Live viewfinder, GPS-tagged captures, and the recipe baked into the saved file.
- Film simulations. Built-in looks — PROVIPES, VELVIPES, CLASSIC CHRIPES, CLASSIC NEGIPES, ASTIPES, ETERNIPES, ACRIPES, B&W HIGH CONTRAST and the LC STREETLIFE pair — each with its own grain and tone curve.
- The full adjustment set. Exposure, contrast, highlights and shadows, saturation, colour temperature, clarity, grain, and an HSL mixer with a colour picker that samples straight off the photo.
- Geometry. Crop to a fixed ratio or free-form, quarter turns, and a straighten ruler, plus printed frames (classic border, retro instant, wall frame portrait/landscape).
- Finishing. Watermark and GPS stamp, EXIF carried through the export, JPEG written with a proper 300 DPI JFIF header.
- On-device upscaling. A Real-ESRGAN pass runs locally when an export asks for more pixels than the source has — no server sees the photo.
- Recipes. Save, favourite, export and import
.recipefiles; the web build keeps them in your account, the phone build also keeps them on device.
The two builds
| Build | Where | Stack |
|---|---|---|
| iOS / Android | repo root | Expo + React Native, @shopify/react-native-skia for the render pipeline, NativeWind for styling |
| Web | docker/ |
Vite + React, CanvasKit (canvaskit-wasm) for the same pipeline, Fastify + SQLite API for accounts and recipes |
The render engine is shared by design: the web build compiles the app's own
src/utils/* and type definitions unchanged, with @shopify/react-native-skia
aliased to a CanvasKit shim (docker/frontend/src/engine/skiaShim.ts). A look
looks the same on both because it is the same code.
Running the web build
cd docker
cp .env.example .env
docker compose up -d --build
# → http://localhost:8090
Photos never leave the browser: grading, framing, watermarking and JPEG
encoding all run in the visitor's tab; the API only stores accounts and recipe
JSON. See docker/README.md for the layout and the proxy setup.
Running the app
npm install
npx expo start # Expo Go / dev client
npx expo run:android # or run:ios for a native build
Repository layout
App.tsx, src/ the Expo app: screens, tool rail, viewfinder, shaders
docker/ the web build (frontend + API + compose file)
frontend/shared/ vendored copies of the app's types and utils
frontend/src/engine/ CanvasKit shim, export engine, super-resolution
docs/ privacy policy
THIRD_PARTY_NOTICES.md licences of the bundled fonts, models and libraries
Licence
See LICENSE and THIRD_PARTY_NOTICES.md.