Using gsap haxelib


#1

Hi there,

I wanted to use the gsap haxe lib ( https://github.com/mathieuanthoine/haxe-gsap ) so…

I installed it with

haxelib install gsap

I added

<haxelib name="gsap" />

to my project.xml

But at run time I have this error: “ReferenceError: TweenMax is not defined”

Is there something I am missing to use correctly this lib?
I saw there was a swc file inside the lib folder…may I use it? and how?

Thanks for your help! :slight_smile:


#2

It looks like that library works on Flash or HTML5, but not other targets. If you target HTML5, it appears you also need to include an additional JavaScript file, something such as:

<dependency path="path/to/gsap.js" />

You might also consider using Actuate, a popular tween library that is compatible with all of OpenFL’s target platforms :slight_smile:


#3

Thanks for the quick reply! :slight_smile:


#4

Hi, guys!

I was wondering… did you ever get GSAP to work, Stortof?
I followed the same steps that you did, and used in my project.xml file as singmajesty suggested, but still no love.

I’ve been SCOURING the interwebs and still can’t get it to work!
I’ve been tearing my hair out about it… one hair at a time.
I fear I may be bald by the weekend. LOL!

Thanks for any help/feedback!


#5

NOTE: I suspect the issue has something to do with “import” in my Main.hx file (the same way you would import actuate: import motion.Actuate;), but I have no idea how to do that.

Any suggestions?


#6

This library is Haxe externs only – this means it will work only for JavaScript, and only if you use <dependency path="to/gsap.js" /> in your project file, or something similar to be sure that the GSAP library is embedded in the final HTML page you are running


#7

Thanks for replying so quickly, singmajesty!

I used the dependency tag, and it shows up fine in the the of my HTML file.
I’m just having trouble actually making use of it…

In my Main.hx:

var mc_axx = Assets.getMovieClip (“axx_main:MC_axx”);
addChild (mc_axx);
TweenMax.to(mc_axx, 3, {x:2000});

I run openfl test html5 and get this:

Type not found : TweenMax

NOTE: any idea what to use for GSAP on the import line? Example:

import motion.Actuate;

I don’t know how many variations I’ve tried, but nothing seems to work.

Thanks again!


#8

Does import com.greensock.TweenMax work?


#9

does work… sorta.
I’m not getting any error messages, but I’m still not getting any animation.

Still grinding away at this. I fear I may have become a little obsessed with this. LOL!


#10

I can understand, when you taste GSAP you can’t go back :sob:


#11

For REAL, @GiG!!! :grimacing:


#12

Any errors in the browser console at runtime?


#13

Nope, @singmajesty, no errors in the browser console either!


#14

Oh – are you using it with Haxe getter/setter properties?

Perhaps you could try tweening a custom value, just to double check:

private var value:Int = 0;

...

TweenMax.to (this, 4, { value: 100 });

addEventListener (Event.ENTER_FRAME, function (_) trace (value));

Trying to tween sprite.x or sprite.alpha may not work with the Haxe version of OpenFL (the non-NPM version) because there are no real x or alpha properties, only get_x, set_x, get_alpha, set_alpha, etc.

Actuate is designed to check for this automatically when tweening


#15

YOU ARE MY HERO, @singmajesty!!!

It wasn’t even that complicated! It was a stupid syntax error:

WRONG (what I was using):

TweenMax.to(mc_axx, 15, {x:-2000});

RIGHT:

TweenMax.to(mc_axx, 15, {set_x:-2000});

Do you know of any documentation re: syntax?
Or is it as simple as just using “set_” before GSAP parameters?

THANK YOU SOOOO MUCH!!!
You’re my new best friend! LOL!


#16

CONFESSION: when I used the following line of code…

addEventListener (Event.ENTER_FRAME, function (_) trace (value));

it returned the following error:

Type not found : Event

I am VERY embarrassed to ask, but I am VERY new to haxe/openfl and have a VERY long way to go, and I know I’m gonna need this later…

is there a separate package I need to install/import to deal with event listeners?

(My apologies for the noob questions… I am going to have to take a few days to remove “Front-End Developer” from all of my profiles. DOH!)

#YouDontKnowWhatYouDontKnowUntilYouKnow


#17

import openfl.events.Event;

Test GSAP and let us know if it is usable, updated, and if it supports Timelines.


#18

THANKS for the tip, @gig!

I’m about to crash (and burn) right now, @gig, so I won’t be able to get to it until tomorrow, but you are right there with me: Timelines are the very next step!

I’m very hopeful after this “A-HA!” moment!
I’ll be sure to let you guys know what happens.

Wish me luck!


#19

Hey, @GiG!

TimelineMax WORKS!

You just have to make sure you declare TweenMax dependency as well…

<dependency path="Assets/scripts/gsap_201_min/TimelineMax.min.js" />

won’t work by itself. You also have to include

<dependency path="Assets/scripts/gsap_201_min/TweenMax.min.js" />

Found this out TOTALLY by accident! (I forgot to comment out the second line after a few hours of fails! LOL!)


#20

And SHOUT OUT to @singmajesty for helping me over that first MAJOR hurdle!
Thanks again!