# Departures Board

A departures board of flip-dot lines under an enamel fascia. A train starts boarding, another slips five minutes, the first departs and every row below moves up in a clattering cascade.

Block · With a Pass · https://tactileui.dev/blocks/departures-board

> The code and styling for this block 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

One line board updates, Cascading row shift, Per column disc fitting, Hanging sign mounts, Accessible table mirror, Pausable live updates, Visibility gated timer, Container tiered sign layout

## Usage notes

Live information that people watch: a transport operator's station page, an airport or ferry terminal, a venue's door times, any queue or schedule where the change itself is the news. The board is the content; the table and the announcements carry the same news in words.

## Options

| Option | Type | Description |
| - | - | - |
| station | text | Station |
| operator | text | Operator |
| kicker | text | Beside the departures arrow, under the station name. |
| platforms | number | The numbered plates on the fascia. |
| notice | text | Station notice |
| cta | text | Button |
| ctaHref | text | Button link |
| trains | number | A phone shows the first four, two lines each. |
| live | boolean | Rows change one at a time while the section is in view, with a pause button. |
| palette | enum | A night concourse under navy enamel, or pale concrete by day. |
| scheme | enum | Mixed: white times, yellow-green destinations, amber status. Or one colour throughout. |
| finish | enum | Housings |
| glass | boolean | Glass covers |
| light | number | Light from (degrees) |
| waveSpeed | number | Wave speed (columns/s) |

## Methods

- root
- signs
- sim
- step
- update
- destroy

## States

1. **At rest**: Enamel fascia with the station, operator mark, platform plates and a flip-dot clock; the board asleep; the calling-at sign scrolling the first train's stops.
2. **Row update**: 
3. **Cascade**: 
4. **Announced**: Each change is one polite sentence and the departures table (visually hidden, real th/caption) is rewritten.
5. **Paused**: The lamp goes dark and the notice says so.
6. **Palette**: Enamel (a night concourse under navy) or daylight (pale concrete, black fascia); disc fitting mixed, amber or classic yellow-green.
7. **Tablet**: The foot stacks.
8. **Phone**: 
9. **Reduced motion**: Every sign swaps instantly and requests no frames; the cascade lands at once; the calling sign pages; every update still happens and is announced.
10. **Off screen**: The update timer stops (IntersectionObserver, hidden tab) and every sign sleeps.

## How it works

Original composition. Keston Parkway, the Harwick & Keston Railway, its mark and every service are invented. Imagery is SVG and CSS drawn for the scene; the signs are the Flip-Dot.