Appending to Phaser 3 Tween Chains

Phaser 3
1

Is there a way to append a tween to a chain that is currently running?

When I do thechain.add({ targets: target, tweens: tweens }) it errors in the reset method on seek() being called on undefined.

2

:wave:

It needs to be

chain.add(tweens);

So add targets to each tween config.

3

Sorry, yes that’s what I have actually. I mistyped (not sure why I didn’t just copy paste).

4

Can you show your code?

5

Ok I figured it out.
I didn’t understand how to pass in the new tweens.

So taking the ax tween sample code… I just split out the tweens like this and it works:


        const chain = this.tweens.chain({
            targets: image,
            tweens: [
                {
                    x: 400,
                    ease: 'power3',
                    duration: 750
                },
                {
                    angle: 0,
                    ease: 'elastic.out',
                    duration: 500
                },
            ]
        });

        chain.add([
              {
                  targets: image,
                  scale: { value: 0.5, duration: 1000 },
                  y: { value: 100, duration: 750, ease: 'sine.in' }
              },
              {
                  targets: image,
                  angle: 35,
                  ease: 'power2',
                  duration: 200
              },
              {
                  targets: image,
                  x: -100,
                  ease: 'quart.in',
                  duration: 1000
              },
        ])

What I was doing before was:

        chain.add([
            {
                targets: image,
                tweens: [
                {
                    scale: { value: 0.5, duration: 1000 },
                    y: { value: 100, duration: 750, ease: 'sine.in' }
                },
                {
                    angle: 35,
                    ease: 'power2',
                    duration: 200
                },
                {
                    x: -100,
                    ease: 'quart.in',
                    duration: 1000
                },
                ]
            }
        ])

Oops! Everything makes sense now. Somehow the typescript definitions didn’t warn me something was wrong though (I guess because it was trying to nest another chain, which is also a valid Tween object).