Jump to content
GreenSock

Search In
  • More options...
Find results that contain...
Find results in...
cwiens

Storyline/Adobe Animate/GSAP fandango

Recommended Posts

Hi, this is a very specific issue. I am using Greensock to add HTML5 animations to Storyline (eLearning tool) it will allow you to add web objects to a slide. I have figured out how to communicate between my hand coded GSAP animations and Storyline just fine by targeting the iframe that the web object lives in. Occasionally we use Adobe Animate with GSAP and that is where it breaks. Adobe animate changes the scope of the GSAP code putting it in a closed function:

 

I can fire this function:

function controlAnimate(){
    alert();

//tl.pause();
    
}

Anything in this function, which is where the GSAP code lives, is not accessible

(function (cjs, an) {...

 

GSAP code is in here. 

 

I have tried everything to access the GSAP code with no luck.  I know this is a scoping issue I am just not sure how to get around the function with closure.

 

above function firing the alert from Storyline in the animate html.  Anything inside (function(... does not work. 

https://360.articulate.com/review/content/0112d7f3-c73e-475a-adb6-15f30ed9f4bf/review

 

Successful control of hand coded GSAP animation from Storyline:

https://360.articulate.com/review/content/5e2693d1-be09-44d8-84ee-eca0dfee96e5/review

 

This is a bit more of an adobe animate question I guess throwing it out there just in case anyone has a clue. DANKE!

Link to comment
Share on other sites

Yes, I have referenced that for sure. Thanks!

Really the only reason why I occasionally use Adobe Animate is because you do not have to write any CSS, You can mask things very easily.  CSS not that big a deal but MASKING is huge. I am sure I can do similar using parent DIV's.

 

Curt

 

Link to comment
Share on other sites

My problem is I can not control TweenMax from outside of the Adobe Animate HTML structure. It throws all my GSAP code into an external JS file but then wraps it up in a closed function and it becomes a scoping issue that is hard to resolve. I am going to just hand code for now.

Link to comment
Share on other sites

Figured it out. It was a scoping issue. I added window. to make the function global and it works.

 

window.pauseTL = function () {

    tl.pause();

}

  • Like 2
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
  • Recently Browsing   0 members

    • No registered users viewing this page.
×