Skip to content

feat: Expose playback events and canvas load dimensions for preview/read-only use cases #107

@cweseloh

Description

@cweseloh

User story

As a developer, I want the SDK to emit playback events so that I can build a custom seek bar and responsive UI without polling internal state or querying the DOM

Motivation & context

We're building a read-only preview player and don't want to use the timeline view that's provided because we're generating the shotstack json with our own UI.

We ended up implementing manual polling for time position, end detection (and also canvas sizing) because the SDK appears to expose playback state as properties rather than events. A timeupdate event (like an HTML5 video player) and a canvas loaded event with natural dimensions would unblock most of this.

Acceptance criteria

  • edit.events emits a playback:timeupdate event with { currentTime: number } during active playback at a consistent interval (≥10fps)
  • edit.events emits a playback:ended event when playback reaches the end of the timeline
  • edit.events emits a playback:seeking event with { target: number } when a seek is initiated
  • edit.events emits a playback:seeked event with { currentTime: number } when a seek operation has resolved and playback is ready to resume
  • edit.events emits playback:buffering and playback:ready events when playback stalls and resumes due to media loading
  • canvas.load() resolves with { width: number, height: number } reflecting the natural output dimensions of the edit, or a canvas:loaded event carries those dimensions
  • All new events follow the existing TEventPayloadMap pattern and are included in TypeScript type definitions
  • Subscribing to any new event via edit.events.on(...) returns an unsubscribe function consistent with the existing API

Implementation notes

No response

Additional Context

No response

Metadata

Metadata

Assignees

Labels

FeatureNew feature implementation

Projects

No projects

Milestone

No milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions