Random frames (no repeating frames) HTML5 canvas for Adobe Animate CC

Question

I have a very strange problem, I'm a designer, I do a little bit a programming, now working on a HTML5 canvas project.

I'm applied the code

this.btn.addEventListener("click", fl_MouseClickHandler.bind(this));
function fl_MouseClickHandler()

    {
    this.gotoAndPlay(Math.round(Math.random()* 5));
    this.gotoAndStop();
    }

This code is working Random frames. but, my problem is some time repeating frames comes.

Please check my sample: http://dsrengineering.com/test/Random2.html

Download Source File (Animate CC): http://dsrengineering.com/test/Random2.fla

You mean a repeating frame comes, like you get several "1s" in a row and no "4"s? That's just randomness for you; for example, you'll get five heads in a row 81% of the time if you flip 100 coins. — Noumenon, Jun 22 '16 at 06:12
Did I misinterpret your problem? Is it actually that you are drawing the same frame multiple times? I didn't really notice any animation problems, so I guessed you didn't want the same number more than once in a row. — Noumenon, Jun 24 '16 at 20:39

score 0 · Answer 1 · answered Jun 22 '16 at 14:10

So your question is "how to keep a random number generator from returning the same number twice in a row"? The answer is to just keep picking until you get a different number:

var lastPicked = -1;
this.btn.addEventListener("click", fl_MouseClickHandler.bind(this));
function fl_MouseClickHandler() {
    var choice;
    do {
        choice = Math.round(Math.random() * 5);
    } while (choice == lastPicked);
    lastPicked = choice;

    this.gotoAndPlay(choice);
    this.gotoAndStop();
}

Random frames (no repeating frames) HTML5 canvas for Adobe Animate CC

1 Answers1