Creating and stepping through a simple array in Animate CC

[paul_james123]

Hi All,

I'm sure I've been looking right at the answer but don't know enough to recognize it. I need to understand the basics but seeing answers to more complex array questions. I just want to create a simple array in my Animate CC script window and then step through that array, adding an event listener to each array item.

Also, do I need to convert the MC names to ("object names"?) to use the addEventListener line of code (below) on them?

This is what I have:

====================

var stage = this;

//Create an array with a known quantity of MCs:

var myArray= [myMC_1, myMC_2, myMC_3, etc.];

//What next? Do I convert each of the items above to an 'object' so I can work on them below?

//Then how do I step thru that list to do the following?

//Add the event listener to each of the MCs in the above list.

stage.[each of the array items].addEventListener("click", clickActions.bind(this));

That's it.

Thanks much!

ps. If you can refer me to a resource with this kind of basic scripting instructions for Animate CC, I'd appreciate it.

[ClayUUID · Accepted solution]

This isn't an Animate question, it's a JavaScript question. There are countless resources online for referencing objects and iterating over arrays.

As for your specific problem, it's fairly trivial. Note that your array code above would just populate it with undefined, undefined, undefined, because it would interpret those clip names as variables. You have to put them in quotes if you want them to be interpreted as literal strings.

Also, stage is a reserved global variable that points to the CreateJS stage object. Clobbering it with your own stage variable is bad.

Anyway...

var i;

var myArray = ["myMC_1", "myMC_2", "myMC_3"];

for (i = 0; i < myArray.length; i++) {

    this[myArray].addEventListener("click", clickActions.bind(this));

}

Property accessors | MDN

[kglad]

if you're using movieclip references in your array (and not string names), use:

var myArray=[myMC_1, etc...];

for(var i=0;i<myArray.length;i++){

myArray.addEventListener('click',clickF.bind(this));

}

if you're using string names of objects on the current timeline, use:

var myArray=['myMC_1',..etc]

for(var i=0;i<myArray.length;i++){

this[myArray].addEventListener('click',clickF.bind(this));

}

[paul_james123]

That's exactly what I needed. Thanks ClayUUID and KGlad!

[kglad]

you're welcome.

[ClayUUID]

kglad  wrote

var myArray=[myMC_1, etc...];

Since he's working in a Canvas document, this would have to be:

var myArray = [this.myMC_1, etc...];

[paul_james123]

...Well, encountering a problem here:

BTW: I'm using the names of the Instances of the Movie Clips.

So, for example, this below works (adds EventListeners):

==================

this.Instance1Name.addEventListener('click',clickActions.bind(this)); //Add eventListner to Instance1.

this.Instance1Name.Instance2Name.addEventListener('click',clickActions.bind(this)); //Add it to the Instance2

==================

//You'll notice that Instance2 is the instance name given to a child MC (it's within the Instance1, parent MC)

Probably that's why this doesn't work:

==================

var myArray=['Instance1Name','Instance2Name']; //<=These are the actual names of the instances of the MCs.

for(var i=0;i<myArray.length;i++){

this[myArray].addEventListener('click',clickActions.bind(this));

}

==================

It only adds the EventListener to the parent, Instance1, not the child, Instance2.

If that's the problem, how do I refer to the path to instance2 in the above array?

Thanks again.

[kglad]

imo, your setup is poor.  i would use an array of objects to clarify parents and children.

but with your current setup, you would use:

for(var i=0;i<...;i+=2)

this[myArray][myArray[i+1]].addEvent...

[paul_james123]

Thanks Kglad.

I'm reorganizing the project (parents and children) so it works better. Learning best practices the hard way.

[kglad]

you're welcome.