stopwatch (with autostart support)

Displays a stopwatch overlay above the score. Stopwatch overlays may show the main stopwatch time or create their own independent stopwatch.

This cue now supports autostart, meaning it can begin running automatically when the SVG is loaded — in both page and scroll modes — without requiring the playhead to cross.

Syntax

stopwatch(source:<main|new>, hold:<seconds>, scroll:<true|false>,
          offsetX:<pixels>, style:"<css rules>", trig:<auto|edge>)

Arguments

Arg	Values	Default	Behaviour
source	`"main"` / `"new"`	`"main"`	Use global clock or create/reset local stopwatch
hold	seconds	`0`	When >0, overlay fades+removes at timeout
scroll	`true` / `false`	`false`	Follows scrolling score or fixed overlay
offsetX	px	`0`	X-offset from cue location
style	CSS	—	Inline CSS, use `;` separated
trig	`"auto"` / `"edge"`	`"edge"`	`auto` means autostart on load

Behaviour

source:main displays the global stopwatch time — the room's performance clock, kept by the server: it runs while the transport plays and on through musical pauses (pause() cues), stops on an interface stop, and resets with rewind-to-start. Every client shows the same reading whenever it joined; a client running alone keeps its own count
source:new starts (or resets) a private timer — one the playhead started counts score time from the cue's own position, so every client on the network shows the same reading whenever it noticed the crossing, and it stops with the transport; a trig:click or trig:auto stopwatch has no score position to count from and runs on the wall clock
If hold > 0, the stopwatch fades after expiry
If hold = 0, click dismisses it
Multiple independent stopwatches can run concurrently
Autostart requires no playhead crossing

Autostart (NEW)

Autostart activates when:

trig:auto

Example:

stopwatch(source:new,style:"font-size:3em;color:red",trig:auto)

Autostart behaviour:

Works in page overlay and scroll modes
Executed after SVG and DOM are fully initialized
Overlay appears immediately
Does not require playhead position
Does not use trigger dedupe

Autostart Examples

Main stopwatch, always visible

stopwatch(source:main,style:"font-size:2.5em;",trig:auto)

Independent timer with 10s hold

stopwatch(source:new,hold:10,style:"font-size:2em;",trig:auto)

Scrolling stopwatch

stopwatch(source:new,scroll:true,trig:auto)

Stylised overlay

stopwatch(source:new,
          style:"font-size:4em;color:#0ff;text-shadow:0 0 5px #000;",
          trig:auto)

Edge-triggered Examples (non-autostart)

stopwatch(source:new)
stopwatch(source:main,scroll:true)
stopwatch(source:new,hold:8,offsetX:-30)

Developer Notes

Autostart runs once, after initialization
Stopwatch overlay is a DOM absolute positioned element
High stacking ensured using:
```
div.style.zIndex = "99999"
```
Autostart does not use triggeredCues

Known Limitations

Overlap of multiple autostarts is a user-design choice
Very large fonts may clip on small screens

Driving other cues

Give the stopwatch a uid: and it publishes the time, so the clock can drive the score rather than only being read off it:

Channel	Meaning
`elapsed`	seconds since it started
`t`	through its `hold`, 0–1
`remaining`	seconds left of the `hold`

t and remaining need a hold: — without an end there is nothing to be a fraction of, so only elapsed is published.

stopwatch(uid:clock, source:new, hold:300)
fade(uid:f1, mode:out, to: follow(clock.t))

The display renders mm:ss and so ticks once a second; the signal is separate and runs at 10 Hz, because a value stepping once a second would visibly stair-step anything it drove. Nothing is published at all unless the cue has a uid: — a score that never names its stopwatch pays nothing for this.

Demo project

See demo-transport: global and private stopwatches, fixed and scroll-following.

http://localhost:8001/?project=demo-transport

Tip: use ← → or ↑ ↓ to navigate the docs