Configure the Web Player

Before you can use the API, you'll need to tell the Web Player where it can find GSAP Tween and Timeline instances.

This is only needed once.

spirit.config API
import { config } from 'spiritjs'

/**
* GSAP tween instance.
*
* @type {TweenMax|TweenLite}
*/
config.gsap.tween

/**
* GSAP timeline instance.
*
* @type {TimelineMax|TimelineLite}
*/
config.gsap.timeline

/**
* Use auto inject?
*
* @type {Boolean}
* @default true
*/
config.gsap.autoInject

/**
* CDN url to fetch from.
*
* @type {String}
* @default https://unpkg.com/gsap/src/minified/TweenMax.min.js
*/
config.gsap.autoInjectUrl

Setup

Before you can use Spirit, you'll need to call spirit.setup() once to make sure GSAP is available.

import spirit from 'spiritjs'

/**
* Setup Spirit.
* Make sure GSAP is available
*
* @returns {Promise}
*/
spirit.setup()

Fetch GSAP from CDN

If called without arguments, it fetches GSAP from CDN (see config.gsap.autoInjectUrl).

Example:

setup().then(() => {
  // gsap is fetched from cdn and available here..
})

By default it fetches GSAP from https://unpkg.com/gsap/src/minified/TweenMax.min.js, however you could customize the auto inject url by setting the spirit.config.autoInjectUrl before calling spirit.setup()

Manually provide GSAP instances

If GSAP is already loaded, you can provide the instances:

Example:

import { TweenMax, TimelineMax } from 'gsap'
import spirit from 'spiritjs'

spirit.setup({ tween: TweenMax, timeline: TimelineMax }).then(() => {
  // spirit uses the provided instances
})

results matching ""

    No results matching ""