animating all instances of movieclip

[kristah11918479]

I have a frame that has several instances of a movieclip. Each of those instances are named, but I have a button that needs to trigger ALL instances to animate simultaneously.

My code is currently looking like this, where "allInstances" is the clip I'm trying to animate. If that is a specific instance name, it works, but I need to have multiples, and using the original movieClip name doesn't work.

this.exampleBtn.addEventListener("click", doTheThing.bind(this));
function doTheThing()
{
this.parent.parent.allInstances.play("activateIt");
}

Not expecting anyone to write my code for me, but any hints in the right direction would be appreciated.

Thanks!

[Colin Holgate · Accepted solution]

If you set each one playing one after another, they won't start playing instantly. Also I don't think play("frame label") would work.

To play three movie clips at the same time, and from a frame label of "activateI", and the three of them are in the button's parent's parent, you would do this:

this.exampleBtn.addEventListener("click", doTheThing.bind(this)); 

function doTheThing() { 

   this.parent.parent.mc1.gotoAndPlay("activateIt");  

   this.parent.parent.mc2.gotoAndPlay("activateIt"); 

   this.parent.parent.mc3.gotoAndPlay("activateIt"); 

} 

If you want a lot of copies of the same movieclip to play at the same time you could have a listener in the movieclip itself. For example, in the movieclip that is in the library, have this in frame 1:

stage.addEventListener("doactivate",activatenow.bind(this));

this.stop();

function activatenow(){

  this.gotoAndPlay("activateIt");

}

then change your button script to:

this.exampleBtn.addEventListener("click", doTheThing.bind(this)); 

function doTheThing() { 

stage.dispatchEvent("doactivate");

}

I just tried it, and it works well, and has the advantage that it doesn't matter where the button and movieclips are in the hierarchy. Try my test here (click the circle):

playnow

[kristah11918479]

thanks for your response. I was trying to avoid playing them all by name individually, as I'm trying to have them be very reusable. i have other frames with a very similar setup, but the number of movie clips varies. I was hoping for some sort of array type approach, or some naming convention where I can target them all in one shot. That being said, I'll mess around with your second suggestion.  Thanks!

[dmennenoh]

You could try something like this.

In frame 1 of the instanced movieClip you want to animate:

stop();

stage.addEventListener("PLAY", doPlay);

function doPlay(e:Event):void

{

     gotoAndPlay(2);

}

And then this on the main timeline - I have a shape with the instance name of 'btn'.

btn.addEventListener(MouseEvent.CLICK, doPlay);

function doPlay(e:MouseEvent):void

{

     stage.dispatchEvent(new Event("PLAY"));

}

[Colin Holgate]

dmennenoh

This question was about HTML5 Canvas, and your idea is a good one for AS3, but it's also the same as my second suggestion.

[dmennenoh]

Essentially the same, I just got rid of the 'this' and 'bind'... which are not needed.

[Colin Holgate]

The bind(this) is needed in the dispatch line, though not in the movieclip's function. It's only there because I copied his lines.

The main difference with your version is the use of typed variables, and static strings, neither of which exist in HTML5 Canvas.

[dmennenoh]

Yeah, sorry, I missed the part about it being for HTML5.

[kristah11918479]

Second option worked great, Colin. It never occurred to me to have a listener in a different place as the object that will be clicked, but this worked beautifully. Thanks!