Search code examples
javascripthtmladobe-edge

Call composition ready of (edge animate) from javascript


I have a problem in html5 edge animate. I have created an animation using edge animate. I would like to call composition ready of edge animate from outside. I tried calling using $.Edge.registerCompositionReadyHandler( compId, handlerFn, options ) , But it gave error ReferenceError: $ is not defined . I am not able to solve this and i did not find enough documentation about this. Can any one please help me.

my code looks like this

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge"/>
<title>Untitled</title>
<!--Adobe Edge Runtime-->

<script type="text/javascript" charset="utf-8" src="teste1_edgePreload.js"></script>
<script type="text/javascript" src="teste1_resize.js"></script> 
<style>
    .edgeLoad-EDGE-1429726 { visibility:hidden; }
</style>
<!--Adobe Edge Runtime End-->

<script>
  $.Edge.registerCompositionReadyHandler("EDGE-1429726",scaleStage) //SCALE STAGE IS INSIDE THE JAVASCRIPT fn teste1_resize.js
function mover(){
      var stage = $.Edge.getComposition("EDGE-1429726").getStage();
      console.log($("#Stage").height());
      stage.mover();
 }
</script>

</head>
<body style="margin:0;padding:0;">
<div id="Stage" class="EDGE-1429726">
  <input type="button" value="Mover" onClick="mover();">
</div>

</body>

Thanks in ADVANCE


Solution

  • With Ena's help and little modification i was able to find an answer.

    AdobeEdge.bootstrapCallback(function(compId) {
        AdobeEdge.Symbol.bindElementAction(compId, 'stage', 'document', 'compositionReady', function(sym, e){
            // composition is loaded, do stuff here
        });
    });