Sequence API

A Sequence is special tween that, instead of taking control of a value, takes control of other tweens and animates them as a group.

Methods

• setTimescale(scale: number): Sequence
• setLoop(loop: number): Sequence
• append(tween: ITween | ISequence): Sequence Adds the given tween to the end of the Sequence.
• appendCallback(cb: () => void): Sequence
• appendInterval(duration: number): Sequence
• prepend(tween: ITween| ISequence): Sequence Adds the given tween to the beginning of the Sequence, pushing forward in time the rest of the contents.
• prependCallback(cb: () => void): Sequence
• prependInterval(duration: number): Sequence
• join(tween: ITween | ISequence): Sequence Inserts the given tween at the same time position of the last tween or callback added to the Sequence.

// Wait 200ms and play 2 tween in parallel
Fatina.sequence()
    .appendInterval(200)
    .append(Fatina.tween(star).to({ alpha: 0 }, 950).setEasing('outSine'))
    .join(Fatina.tween(star).setRelative(true).to({ x: 0, y: 0, rotation: 12}, 1600))
    .onComplete(() => console.log('Sequence finished !'))
    .start();

Properties

• elapsed: number number of ms. elapsed for this sequence (affected by pause & timescale)
• isRunning: boolean
• isFinished: boolean
• isPaused: boolean

Controls

• start(): Sequence By default new tween are not started. Don’t forget to call .start()
• pause(): void
• resume(): void
• kill(): void

Callbacks

• onStart(cb: () => void): Sequence;
• onStepStart(cb: (tween: ITween | IPlayable) => void): Sequence Emitted when a tween start
• onStepEnd(cb: (index: ITween | IPlayable) => void): Sequence Emitted when a tween is completed.
• onUpdate(cb: (dt: number, progress: number) => void): Sequence
• onKilled(cb: () => void): Sequence
• onComplete(cb: () => void): Sequence
• onRestart(cb: () => void): Sequence
• toPromise(): Promise<Sequence>: Convert the tween into a promise and let you use async/await API