ext/hyperframes
2
0
Fork 0
mirror of https://github.com/heygen-com/hyperframes.git synced 2026-09-03 04:38:33 +00:00
Code Issues Packages Projects Releases Wiki Activity

fix(player): handle Infinity duration; add lint rules for data-duration and Math.ceil overshoot (#243)

Browse Source 
* fix(player): handle Infinity duration from runtime gracefully

When compositions have repeating animations without data-duration, the
runtime sends durationInFrames: Infinity. The player now ignores
non-finite duration values instead of displaying "Infinity:NaN" in the
controls. formatTime also returns "0:00" for non-finite inputs.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* feat(lint): add data-duration and Math.ceil overshoot rules

- Add root_composition_missing_data_duration warning when the root
  composition element is missing data-duration, which causes the runtime
  to infer Infinity for loop-inflated timelines.
- Add gsap_repeat_ceil_overshoot warning that catches
  repeat: Math.ceil(d/c)-1 patterns which overshoot the intended
  duration. Recommends Math.floor instead.
- Fix gsap_infinite_repeat fixHint to suggest Math.floor (not Math.ceil).

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

* fix(player): wait for injected runtime before declaring ready

When the player auto-injects the runtime script (because the
composition has GSAP timelines but no runtime), it would immediately
declare ready on the next probe cycle — before the runtime script
finished loading from CDN. This caused play() to send a postMessage
that nobody received, making autoplay silently fail.

Now the probe waits for the runtime bridge (__hf or __player) to
appear before proceeding to the ready state.

Co-Authored-By: Claude Opus 4.6 (1M context) <noreply@anthropic.com>

---------

Co-authored-by: Claude Opus 4.6 (1M context) <noreply@anthropic.com>
This commit is contained in:
James Russo
2026-04-12 10:41:13 -07:00
committed by GitHub
co-authored by Claude Opus 4.6
parent 794b02153d
commit 18de86e4bd
4 changed files with 69 additions and 5 deletions
Download Patch File Download Diff File Expand all files Collapse all files
packages/player/src/controls.ts
+5 -1
View File
@@ -20,7 +20,11 @@ export function formatSpeed(speed: number): string {
}
export function formatTime(seconds: number): string {
const s = Math.max(0, Math.floor(seconds));
// Handle non-finite values gracefully
if (!Number.isFinite(seconds) || seconds < 0) {
return "0:00";
}
const s = Math.floor(seconds);
const m = Math.floor(s / 60);
const sec = s % 60;
return `${m}:${sec.toString().padStart(2, "0")}`;
packages/player/src/hyperframes-player.ts
+11 -2
View File
@@ -242,8 +242,12 @@ class HyperframesPlayer extends HTMLElement {
}
if (data.type === "timeline" && data.durationInFrames > 0) {
this._duration = data.durationInFrames / DEFAULT_FPS;
this.controlsApi?.updateTime(this._currentTime, this._duration);
// Ignore Infinity duration from runtime (caused by loop-inflated timelines without data-duration)
// The player already has duration from the initial probe, so keep that.
if (Number.isFinite(data.durationInFrames)) {
this._duration = data.durationInFrames / DEFAULT_FPS;
this.controlsApi?.updateTime(this._currentTime, this._duration);
}
}
if (data.type === "stage-size" && data.width > 0 && data.height > 0) {
@@ -280,6 +284,11 @@ class HyperframesPlayer extends HTMLElement {
return; // Wait for runtime to load and initialize
}
// Runtime was injected but hasn't loaded yet — keep waiting
if (this._runtimeInjected && !hasRuntime) {
return;
}
const getAdapter = () => {
if (win.__player && typeof win.__player.getDuration === "function") return win.__player;
if (win.__timelines) {