Skip to content

Make nested composition data-playback-start also shift descendant media #3245

Description

@valeriangalliat

Problem

data-playback-start on a nested composition slot seeks the child GSAP timeline. Nested <video> / <audio> still play from local t=0 / their own data-media-start. Preview (startResolver) and render (parseSubCompositions) agree.

Docs treat a nested composition’s data-playback-start as which moment of the child GSAP timeline shows first, not as a trim of media inside that scene.

The gap: start-trimming a nested scene (NLE-style) does not move media inside it.

I'm not sure whether that split is the intentional contract, or whether a slot in-point should also shift descendant media.

➡️ I have code ready for this here (outline below) - happy to make a PR with this if that's a welcome addition.

Proposed solution

If a nested composition’s data-playback-start should also trim media inside that scene (NLE-style):

<div
  data-composition-id="scene"
  data-composition-src="compositions/scene.html"
  data-start="1"
  data-duration="2"
  data-playback-start="1.5"
></div>

A nested <video data-start="0"> would appear at t=1, playing from 1.5s into the file, not from the start of the file.

  • Descendant media is shifted by the slot offset (master = hostStart − playbackStart + local)
  • Clips that end entirely before that offset never appear
  • Clips that overlap it start at the slot and skip the overlap in the file
  • Same behavior in preview and in render extract
  • On the slot, data-media-start stays an alias of data-playback-start. On <video> / <audio>, data-media-start stays a source-file offset for that element only.

Alternatives considered

  • Leave as-is (GSAP only). Authors set data-media-start on each nested <video> / <audio>. Awkward for “trim this nested scene,” and wrong for media that is not at local t=0.
  • Rewrite child attributes when inlining so extract never sees a slot offset. Preview still has to apply hostStart − playbackStart, so the two paths can drift.
  • Docs only. Spell out that composition data-playback-start never applies to nested media. No code change.

Additional context

Repro (any clip.mp4 at least 4s):

<!-- index.html -->
<div data-composition-id="main" data-start="0" data-duration="4" data-width="1920" data-height="1080">
  <div
    data-composition-id="scene"
    data-composition-src="compositions/scene.html"
    data-start="1"
    data-duration="2"
    data-playback-start="1.5"
  ></div>
</div>
<!-- compositions/scene.html -->
<template id="scene-template">
  <div data-composition-id="scene" data-width="1920" data-height="1080">
    <video id="clip" src="clip.mp4" data-start="0" data-duration="4" muted></video>
  </div>
</template>

On current main (0.7.107): GSAP on scene starts 1.5s into that timeline; the <video> starts at the beginning of the file.

Studio preview, CLI preview, and render capture all use the same runtime seek for nested-comp GSAP, so that half is consistent. Nested media is also consistent: all paths ignore the slot’s data-playback-start.

Metadata

Metadata

Assignees

No one assigned

    Labels

    enhancementNew feature or request

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions