Randomize an array and stagger them.

[venn 23 Likes (Newbie)]

What is the easiest way to always randomly shuffle all items in an array and then stagger them.

var items = [a, b, c, d, e]; <-- Random order everytime

TweenMax.staggerTo(items, 1, {opacity: 1}); 

1) I can first randomize my array by following this link

http://stackoverflow.com/questions/2450954/how-to-randomize-shuffle-a-javascript-array

 

Then only do my stagger effect.

 

2) Or can I use the new .cycle method in stagger. Will that be something I can leverage? Or any better/simpler ways?

[Jonathan 5,176 Likes (Superhero)]

Hello venn

 

Take a look at this codepen by Blake.

 

See the Pen YWjARB?editors=0010 by osublake (@osublake) on CodePen

 

You will see a function called random in there. You can get an idea of one way how to randomize your values.

 

[Carl 9,066 Likes (Superhero)]

Your best bet is going to be creating a function that re-shuffles your array and then creates a new staggerTo() each time.

 

staggerTo() is a helper method that simply creates an Array of tweens with unique delays for each one. Once it runs its not like you can easily reference those tweens and say "oh you need to run in a different order". Technically you could go into the array of tweens that staggerTo() creates and manually update all of their delays and then tell them all to restart() again, but I don't think there is any benefit to that approach.

[venn 23 Likes (Newbie)]

Oh wow, some clever ways to do tricks here!