0

I'm trying to access movieClips from Animate CC 2015 via external javaScript file through the canvas. (I'm avoiding jQuery for file limit restrictions). All clips have instance names, in the past I had no issues using jQuery and syntax:

theStage.$("btnTC").show();

With the new AnimateCC JS output file I can only access the canvas but not the subsequent/child movieClips:

var theStage = document.getElementById("canvas");
console.log(theStage);



//Snippet below from JS file generated from Animate CC 


(function (lib, img, cjs, ss) {

var p; // shortcut to reference prototypes

// library properties:
lib.properties = {
	width: 300,
	height: 250,
	fps: 30,
	color: "#FFFFFF",
	manifest: [
		{src:"images/spriteSheet.png?1464063736640", id:"spriteSheet"}
	]
};



// symbols:



(lib.spriteSheet = function() {
	this.initialize(img.spriteSheet);
}).prototype = p = new cjs.Bitmap();
p.nominalBounds = new cjs.Rectangle(0,0,400,800);


(lib.keyline = function(mode,startPosition,loop) {
	this.initialize(mode,startPosition,loop,{});

	// Layer 1
	this.shape = new cjs.Shape();
	this.shape.graphics.f().s("#000000").ss(1,0,0,1,true).p("A3RTYMAAAgmvMAujAAAMAAAAmvg");
	this.shape.setTransform(149,124);

	this.timeline.addTween(cjs.Tween.get(this.shape).wait(1));

}).prototype = p = new cjs.MovieClip();
p.nominalBounds = new cjs.Rectangle(-1,-1,300,250);
<script>
var canvas, stage, exportRoot;
</script>
<!-- DoubleClick studio.Enabler -->
<script>
if (!Enabler.isInitialized()) {
  Enabler.addEventListener(
    studio.events.StudioEvent.INIT,
    enablerInitialized);
} else {
   enablerInitialized();
}
function enablerInitialized() {
  // Enabler initialized.
  if (!Enabler.isVisible()) {
    Enabler.addEventListener(
      studio.events.StudioEvent.VISIBLE,
      adVisible);
  } else {
     adVisible();
  }
}
function adVisible() {
  // Ad visible, start ad/animation.
     
	canvas = document.getElementById("canvas");
	images = images||{};

	var loader = new createjs.LoadQueue(false);
	loader.addEventListener("fileload", handleFileLoad);
	loader.addEventListener("complete", handleComplete);
	loader.loadManifest(lib.properties.manifest);
}

function handleFileLoad(evt) {
	if (evt.item.type == "image") { images[evt.item.id] = evt.result; }
}

function handleComplete(evt) {
	exportRoot = new lib.GSAP_banner_001();

	stage = new createjs.Stage(canvas);
	stage.addChild(exportRoot);
	stage.update();
	stage.enableMouseOver();

	createjs.Ticker.setFPS(lib.properties.fps);
	createjs.Ticker.addEventListener("tick", stage);
}
</script>
<!-- write your code here -->
</head>
<body style="background-color:#D4D4D4;margin:0px;">
	<canvas id="canvas" width="300" height="250" style="background-color:#FFFFFF"></canvas>
	<noscript>
      <img src="GSAP_banner_001_300x250.gif" alt="Coles Credit Cards" width="300" height="250"/>
    </noscript>
</body>
</html>

4

1 回答 1

1

要通过外部 JavaScript 从 Animate CC 2015 访问影片剪辑，请使用以下命令：

<!-- variables inside HTML document - generated by default on canvas publish -->
<script> var canvas, stage, exportRoot;</script>

来自外部 JS 文件的代码：

var myClip = exportRoot.circleMC; //Movie Clip instance 'circleMC' from Animate CC.
myClip.x = 100; //Access properties on your clip.
于 2016-05-24T05:28:16.087 回答