Export Custom Ease?

[swampthang]

I am a Business Green member so have Custom Ease and Custom Bounce. I'm creating a new app that allows a user to export a self-contained SVG but, of course, I can't include anything in the SVG but the free version of GSAP. Is it possible to create a custom bounce, for example, and export that out as SVG Data and run it using the basic ease engine?

[ZachSaucier]

This project sure does lead to some interesting uses of GSAP  GSAP 3's built in ease parsing is actually quite improved in GSAP 3. 

 

Most likely, all you need to do is pass in the stuff that you are passing into the Custom Ease (could be path data like below or bezier values) to .parseEase() instead:

// using the "hop" ease from the custom ease page
ease: gsap.parseEase("M0,0 C0,0 0.056,0.442 0.175,0.442 0.294,0.442 0.332,0 0.332,0 0.332,0 0.414,1 0.671,1 0.991,1 1,0 1,0"),

 

If you need it in function form for some reason

var myEaseFunc = gsap.parseEase("M0,0 C0,0 0.056,0.442 0.175,0.442 0.294,0.442 0.332,0 0.332,0 0.332,0 0.414,1 0.671,1 0.991,1 1,0 1,0");

// later
ease: myEaseFunc,

 

[swampthang]

Ahhhh, thanks for the info, @ZachSaucier!

[GreenSock]

3 hours ago, ZachSaucier said:

Most likely, all you need to do is pass in the stuff that you are passing into the Custom Ease (could be path data like below or bezier values) to .parseEase() instead:

// using the "hop" ease from the custom ease page
ease: gsap.parseEase("M0,0 C0,0 0.056,0.442 0.175,0.442 0.294,0.442 0.332,0 0.332,0 0.332,0 0.414,1 0.671,1 0.991,1 1,0 1,0"),

 

If you need it in function form for some reason

var myEaseFunc = gsap.parseEase("M0,0 C0,0 0.056,0.442 0.175,0.442 0.294,0.442 0.332,0 0.332,0 0.332,0 0.414,1 0.671,1 0.991,1 1,0 1,0");

// later
ease: myEaseFunc,

 

For the record, that'll only work if CustomEase is registered (because that's what has the parsing logic for all that Bezier data). It didn't belong in the core. In fact, you should be able to just pass that raw string in as the ease (no need for gsap.parseEase() wrapper)...again, as long as CustomEase is registered first.

 

I appreciate your protectiveness of CustomEase and sensitivity to the licensing issues, but I don't mind if you embed that minified code in your SVG data. You've got a "Business Green" license and the CustomEase tool is technically free to anyone who registers on our site. 

 

Happy tweening!

[ZachSaucier]

1 minute ago, GreenSock said:

For the record, that'll only work if CustomEase is registered (because that's what has the parsing logic for all that Bezier data). It didn't belong in the core. In fact, you should be able to just pass that raw string in as the ease (no need for gsap.parseEase() wrapper)...again, as long as CustomEase is registered first.

That explains why I couldn't get it to work at first (wasn't loading Custom Ease evidently ). 

 

If you don't want to load Custom Ease, you could save the ease function to a string and then parse the string as a function when loading the file.

[swampthang]

14 minutes ago, GreenSock said:

but I don't mind if you embed that minified code in your SVG data. You've got a "Business Green" license and the CustomEase tool is technically free to anyone who registers on our site. 

Ahh, ok. Thanks for clarifying, Jack. Much appreciated!