Web Player API - Group

A Spirit group is a collection of GSAP timelines that together form a new master Timeline.

Group instance

import { create } from 'spiritjs'

const groups = create(data /* Spirit app copy clipboard */)

// or use spirit.load to load external animation (json) data
// groups is now a collection of spirit.Group items.

See also Embed Animations

API

/**
* Internal list of timelines for each element
* Getter/setter
*
* @type {List}
*/
group.timelines

/**
* Playback speed
* Getter/setter
*
* Setting this value updates the timeScale of the GSAP timeline
*
* @type {number}
*/
group.timeScale

/**
* The total duration in seconds
* Getter/setter
*
* Setting this value updates the duration and timeScale of the GSAP timeline
*
* @type {number}
*/
group.duration

/**
* Name of the group
*
* @type {string}
*/
group.name

/**
 * Get unresolved timelines
 *
 * @returns {Timelines}
 */
group.unresolved

/**
 * Get resolved timelines
 *
 * @returns {Timelines}
 */
group.resolved

/**
 * Kill GSAP timeline
 *
 * @type {Function}
 */
group.reset()

/**
 * Resolve transformObjects for timelines
 * Updates accordingly:
 *   this.resolved
 *   this.unresolved
 *
 * @returns {Group}
 */
group.resolve()

/**
* Convert to a readable and interchangeable javascript object
*
* @type    {Function}
* @returns {object}
*/
group.toObject()

/**
* Construct the GSAP timeline
*
* @type {Function}
*/
group.construct()

Events

You can listen to the following events:

// listen to any changes
group.on('change', () => {})

// listen to specific changes
group.on('change:timelines', () => {})
group.on('change:timeScale', () => {})
group.on('change:name', () => {})
group.on('change:duration', () => {})

results matching ""

    No results matching ""