Show a spinner by the time while play waits on data

Play holds while a layer loads the frame for its time, and the bar's only
sign of it was a faint pulse, so a stopped handle read as a stall. The
bubble now shows a small spinner beside the time while play is held. It
comes on once a hold lasts long enough to notice and stays through a run of
slow frames, so neither a quick frame nor the gaps between frames flash it.
This commit is contained in:
Sameh Khamis committed 2026-11-02 15:11:47 -08:00
1 parent 287c881c17
commit 4fc9722356
3 files changed
+73 -9

No files matched your search

+18 -7
View File
@@ -106,21 +106,32 @@ body.cockpit-mode #world-timeline {
pointer-events: none;
}
/* Playing, held while a layer loads the time's data. */
#world-timeline .world-timeline-time.is-buffering {
animation: world-timeline-buffering 1s ease-in-out infinite alternate;
/* Playing, held while a layer loads the time's data: a spinner by the time. */
#world-timeline .world-timeline-time.is-waiting {
display: inline-flex;
align-items: center;
gap: 6px;
}
@keyframes world-timeline-buffering {
#world-timeline .world-timeline-spinner {
width: 10px;
height: 10px;
border: 2px solid rgba(255, 255, 255, 0.2);
border-top-color: var(--accent);
border-radius: 50%;
animation: world-timeline-spin 0.9s linear infinite;
}
@keyframes world-timeline-spin {
to {
opacity: 0.45;
transform: rotate(360deg);
}
}
@media (prefers-reduced-motion: reduce) {
#world-timeline .world-timeline-time.is-buffering {
#world-timeline .world-timeline-spinner {
animation: none;
opacity: 0.6;
border-color: var(--accent);
}
}