I'm trying to integrate an Adobe Edge animation on one page of an HTML5 publication I'm preparing using a proprietary publishing system. The system displays different HTML pages like pages in a magazine.
I'd like to start playing the animation when the page containing it appears. Instead of an onLoad event, the publishing system triggers an onScreen event when the page is displayed. I know how to set a callback for that event, but I need the callback to start the animation. Can anyone tell me how to do this?
I basically want to do the sort of thing we used to do with Flash, when we could send instructions to a SWF from a Javascript function in the HTML page that contains it.
Do I give the animation a name and then address it with something like document.animationName.play()?
This took me a while to figure out. The AdobeEdge object will give you access to the timeline and the symbols you need.
The getComposition() function will let you access a specific composition. You pass it the name of your composition, which is in the properties panel and is usually a Edge generated ID like EDGE-344514744. You can rename it if you want to. Say you named it myAnim
getStage() gives you access to the stage and from there, you can use the methods like play(), stop(), etc. If you want to play a label you created in the timeline you've named "start" you could use this.
AdobeEdge.getComposition("myAnim").getStage().play("start");