ember-gsap v1.0.1
Ember GSAP

Ember GSAP allows consumption of GSAP - Greensock Animation Platform as ES6 Module imports in Ember applications.
Installation
ember install ember-gsap
Demo
Check out this Ember Twiddle demo to show Ember GSAP in action.
Usage
Ember GSAP by default includes TweenMax, TweenLite, TimelineLite, TimelineMax, CSSPlugin, RoundPropsPlugin, BezierPlugin, AttrPlugin, DirectionalRotationPlugin, and all of the easing functions Power1, Power2, Power3, Power4, Back, Bounce, Circ, Cubic, Elastic, Expo, Linear, Sine, RoughEase, SlowMo and SteppedEase.
Recommended import style is as follows:
import { TimelineMax, TweenMax, easing } from 'gsap';
const { Power2, Back, Elastic } = easing;Easing functions can also be directly imported like so:
import { Power2, Back, Elastic } from 'gsap/easing';Core Libraries
To prevent Ember GSAP from importing TweenMax, which automatically includes all the utilities listed above, you can cherry pick the core libraries and plugins you wish to include.
// config/environment.js
ENV['ember-gsap'] = {
core: [
'TweenLite',
'TimelineLite'
]
}GSAP Plugins
Popular Greensock Plugin libraries can be enabled like so:
// config/environment.js
ENV['ember-gsap'] = {
plugins: [
'draggable',
'scrollTo'
]
}| Plugin | Key | Included in TweenMax? | Import |
|---|---|---|---|
| Attr | attr | ✓ | |
| Bezier | bezier | ✓ | |
| ColorProps | colorProps | ||
| CSS | css | ✓ | |
| CSSRule | cssRule | ||
| DirectionalRotation | directionalRotation | ✓ | |
| Draggable | draggable | import { Draggable } from 'gsap'; | |
| Easel | easel | ||
| Modifiers | modifiers | ||
| Raphael | raphael | ||
| RoundProps | roundProps | ✓ | |
| ScrollTo | scrollTo | ||
| Text | text |
Fastboot
Ember GSAP >=0.3.0 is fully compatible with all versions of Ember CLI Fastboot.