[How to chain timelines with masterTl.add(tl1).add(tl2)...]

i thought just the callback which provides the animation would be enough, but the tl reference itself needs to be passed to tl.add(tl, not () => tl), works now thank you

[How to chain timelines with masterTl.add(tl1).add(tl2)...]

How can i chain timelines which waits for the last one to finish?

Do i have to calculate manually the length of the last timeline added with tl.add(tl1) (tl1.duration())?

I would like to play the added timelines as "chained clips", same behavior as tl.to() or tl.from(), but for timelines, not individual animations.

 

const tl1 = getMy10sAnimation1() //gsap.timeline() ...to().to().to()...
const tl2 = getMy2sAnimation1()  //gsap.timeline()
const tl3 = getMy7sAnimation1()  //gsap.timeline()

const masterTl = gsap.timeline({repeat: -1})
    .add(tl1)
    .add(tl2)
    .add(tl3)

// expected result:
// -----------
//            --
//              ---------
// repeat

// but i get:
// -----------
// --
// -------