# Flip-Dot

The flip-disc sign from buses and stations. Every disc swings over, hits its stop, bounces and latches, so each message arrives as a clattering wave. One sign, or a board of them.

Object · With a Pass · https://tactileui.dev/objects/flip-dot

> The code and styling for this object come with the Pass. Sign in if you have one. Sign in: https://tactileui.dev/auth/sign-in The price: https://tactileui.dev/pricing

## Anatomy

Latching disc physics, Scheduled wave, Banded line waves, Per line and column layout, Ray cast sprite atlas, Baked motion blur, Progressive sliced baking, Glass reflection layer, Lamp lit mount, Dirty cell redraw, Bitmap type, Sleeping loop, Synthesised clatter

## Usage notes

A readout that is an object: a departures board, a live clock or scoreboard, a venue marquee, a status sign, or a hero the visitor writes on. Lines can be aligned, painted and rewritten one at a time; the message stays plain text for assistive technology; only the discs move.

## Options

| Option | Type | Description |
| - | - | - |
| text | text | A \| starts a second line. Letters, digits and . , : ; ! ? - + / ( ) & # % = @ * £ $ ° → ← |
| mode | enum | Static holds the message; marquee scrolls it; clock shows the time; draw lets the pointer write on the sign. |
| font | enum | Auto takes the large one when the message fits. |
| align | enum | Align |
| align2 | enum | A board sets each line on its own: a destination left, a platform right. |
| cols | number | Columns |
| rows | number | Rows |
| disc | enum | Disc colour |
| disc2 | enum | The board’s fitting: the rows of the second line and after carry discs of another colour. |
| finish | enum | Auto follows the page: brushed steel round the sign on a light finish; on Graphite, Black, Phosphor and Night, drawn in that finish’s own light (anodised metal with a bright cut edge, black glass traced in a display’s glow, dim metal lit from inside). |
| glass | boolean | A faint veil and a reflection band placed by the lamp. |
| mount | enum | Hanging from two drop rods, or bolted to the wall on flat brackets. The object grows by the mount. |
| wave | enum | The order the discs flip in when the message changes. |
| waveSpeed | number | Wave speed (columns/s) |
| bounce | number | How far a disc rebounds off its stop. 0 latches dead. |
| light | number | 0 is from above, clockwise. |
| marqueeSpeed | number | A disc takes about a tenth of a second to turn. Past ten columns a second the letters are still turning when the next step comes, as on a real sign. |
| persistence | number | In draw mode, how long a stroke stays before its discs flip back. |
| intro | boolean | The sign starts dark and writes its message the first time it comes into view. |
| sound | boolean | Synthesised, no audio file. Plays only after you have touched the page. |

## Methods

- update
- setText
- setLine
- setFrame
- replay
- pause
- play
- state
- message
- destroy

## States

1. **At rest**: Every disc latched against its stop; the loop is asleep and requests no frames.
2. **Writing in**: The first time the sign comes into view it starts dark and writes its message with the wave.
3. **Changing message**: Only the discs that differ flip, in a sweep, diagonal, ring or scatter that starts at the first change; each lands, rebounds and latches.
4. **Marquee**: Holds the start of the message, then scrolls it a column at a time; stops while the pointer is over it or when paused.
5. **Clock**: HH:MM from the local time; the colon flips every second and the digits change with the wave. The accessible name updates once a minute, silently.
6. **Draw**: The pointer inverts the discs it passes; each flips back after the configured time, in the order it was written.
7. **A board, one line at a time**: setLine(i, text) rewrites one line with a wave confined to its rows; the other lines hold, or finish their own wave. Each line (and each tab-separated column) can carry its own alignment, face and disc paint.
8. **Glass cover**: On by default.
9. **Mounted**: Hanging from two drop rods (ceiling flange, rod, clevis, tab, bolt) or bolted to the wall on four flat brackets with their shadows; all per pixel from the same lamp. The object grows by its mount in percentage padding.
10. **Rebuilding**: A high-density first paint is a half-resolution draft, sharpened a moment later.
11. **Mode taken over**: setFrame() on a marquee or clock turns it static and dispatches a bubbling flipdot:mode event; the preview writes it back to the lab, so the Mode control stays true.
12. **Off screen or hidden**: The loop pauses and the wave's clock stops; a returning tab cannot launch a disc with a long frame.
13. **Reduced motion**: The message on the first paint, every change an instant swap, no frames requested; a marquee becomes pages of whole words.

## How it works

Original. Taken from the physical flip-disc sign, not from a catalogue reference, so references is honestly empty. Both bitmap faces were drawn for this piece; Canvas 2D only, every surface (discs, housing, glass, mount) shaded per pixel from one lamp, so no image or font ships. Presets: Now boarding, Platform 2, Night bus, Station clock, Write on it.