Pinned
Aftershock's seismograph in a small window that stays on top of everything else on your screen, so the week's earthquakes tick by while you work.
- published
- 2026-10-30
- status
- wip
- stack
- TypeScript · React · Document Picture-in-Picture · USGS GeoJSON
https://goksen.ing/lab/pinned
Off the page
Aftershock draws the week's earthquakes on the page. This piece takes the same feed out of the page. It uses Document Picture-in-Picture, the API that lets a page open a small window that floats above every other app, the way a video does, but with any HTML in it.
One React tree, two windows
The pinned window is empty when it opens. The page copies its own style sheets into it and renders the ticker there through a React portal, so the ticker is still part of this page's tree: the same state, the same poll a minute, and the same Glitch when a new quake arrives. Close the window, or this tab, and it goes away.
Where it runs
Document Picture-in-Picture runs in Chrome and Edge on a desktop, and only on a click. Everywhere else the ticker stays in the page and the button says why.