Skip to content

feat: add configurable progress bar to SVG output - #9

Closed
xav-ie wants to merge 1 commit into
agentstation:mainfrom
xav-ie:feat/svg-progress-bar
Closed

xav-ie wants to merge 1 commit into
agentstation:mainfrom
xav-ie:feat/svg-progress-bar

Conversation

@xav-ie

@xav-ie xav-ie commented Feb 26, 2026

Copy link
Copy Markdown

Summary

  • Add Set ProgressBar <color> command to tape files for an animated progress bar in SVG output
  • The 1px bar grows left to right over the animation duration, providing visual feedback during playback
  • Supports #RGB, #RRGGBB, and #RRGGBBAA hex colors (RGBA for semi-transparent bars)
  • Opt-in: no progress bar by default, only rendered when a color is explicitly set

Usage

Set ProgressBar "#9B79FF"

For a semi-transparent bar:

Set ProgressBar "#9B79FF80"

Implementation

  • Full tape command pipeline: token → lexer → parser (with color validation) → command execution → SVG generation
  • Bar is placed inside the inner SVG so CSS animation works in non-browser renderers (librsvg, Inkscape)
  • Animation duration and delay are synchronized with the main slide animation

Test plan

  • TestParseProgressBar — valid hex colors (#RGB, #RRGGBB, #RRGGBBAA) parse correctly; invalid colors produce errors
  • TestSVGGenerator_ProgressBar — no bar by default, renders with color, supports RGBA, bar is inside inner SVG, animation duration matches slide
  • Full test suite passes (go test ./...)

Add a "Set ProgressBar <color>" command that renders an animated 1px
bar at the bottom of the SVG that grows left to right over the
animation duration. Supports #RGB, #RRGGBB, and #RRGGBBAA hex colors.

The progress bar is opt-in — it only renders when a color is explicitly
set. The default (no setting) produces no progress bar, keeping
existing behavior unchanged.

The bar is placed inside the inner SVG element so its CSS animation
applies correctly in both browsers and non-browser renderers (librsvg,
Inkscape, etc.).
@jackspirou

Copy link
Copy Markdown
Member

Thank you, @xav-ie, for proposing optional playback progress and connecting it through the tape language, parser, and SVG output. The repair retains your original commits, adds strict color validation and XML escaping, and tests the shared terminal/progress clock in a real browser. I am finishing alpha-color pixel coverage and checking the static-renderer claims before publishing the replacement. We will distinguish browser animation from static rendering in the documentation and close this PR only after the useful behavior is merged.

@jackspirou

Copy link
Copy Markdown
Member

Replacement #13 is merged at 25c2845. It retains your original commits and the optional one-pixel progress bar, supported hex colors, left-to-right playback, loop reset, and shared PlaybackSpeed/LoopOffset clock.

Final native race checks pass 279 cases with no failed or skipped tests. Root verification passes 11 focused cases. Native Chrome and librsvg pixels confirm #RRGGBBAA blending. All eight hosted build/lint checks passed before merge. Pre-PR autoreview and the exact-content secret scan passed.

One original compatibility claim required correction: librsvg and Inkscape do not support playback animation. The README now states that browsers animate the bar and static renderers display it at full width. Librsvg rendering was tested. Inkscape pixel rendering remains unverified because it is not installed.

Thank you, @xav-ie, for the playback feedback feature and its tape-language integration. Closure now follows merged behavior and coverage, rather than discarding the proposal.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants