Javascript button on Animate CC

Question

Good afternoon, everyone,

I am developing a screen in Animate CC, the screen is 12 buttons and when the user "clicks" on all and at the end of the counter performs the function to unlock the screen.

What is happening is that if he only clicked on 1 button 12 times releases the function, I need to make the button only sum once when "clicked".

Thank you!!

Code:

var contador = 0;

function verificaAvanco() {

  contador = contador + 1;
  if (contador == 12)
    window.parent.postMessage('destravaSlide', '*');
}

this.b1.addEventListener("click", fl_MouseClickHandler.bind(this));

function fl_MouseClickHandler() {
  this.gotoAndStop('f1');
  verificaAvanco();
}

this.b2.addEventListener("click", fl_MouseClickHandler_2.bind(this));

function fl_MouseClickHandler_2() {
  this.gotoAndStop('f2');
  verificaAvanco();
}

this.b3.addEventListener("click", fl_MouseClickHandler_3.bind(this));

function fl_MouseClickHandler_3() {
  this.gotoAndStop('f3');
  verificaAvanco();
}

this.b4.addEventListener("click", fl_MouseClickHandler_4.bind(this));

function fl_MouseClickHandler_4() {
  this.gotoAndStop('f4');
  verificaAvanco();
}

this.b5.addEventListener("click", fl_MouseClickHandler_5.bind(this));

function fl_MouseClickHandler_5() {
  this.gotoAndStop('f5');
  verificaAvanco();
}

this.b6.addEventListener("click", fl_MouseClickHandler_6.bind(this));

function fl_MouseClickHandler_6() {
  this.gotoAndStop('f6');
  verificaAvanco();
}

this.b7.addEventListener("click", fl_MouseClickHandler_7.bind(this));

function fl_MouseClickHandler_7() {
  this.gotoAndStop('f7');
  verificaAvanco();
}

this.b8.addEventListener("click", fl_MouseClickHandler_8.bind(this));

function fl_MouseClickHandler_8() {
  this.gotoAndStop('f8');
  verificaAvanco();
}

this.b9.addEventListener("click", fl_MouseClickHandler_9.bind(this));

function fl_MouseClickHandler_9() {
  this.gotoAndStop('f9');
  verificaAvanco();
}

this.b10.addEventListener("click", fl_MouseClickHandler_10.bind(this));

function fl_MouseClickHandler_10() {
  this.gotoAndStop('f10');
  verificaAvanco();
}

this.b11.addEventListener("click", fl_MouseClickHandler_11.bind(this));

function fl_MouseClickHandler_11() {
  this.gotoAndStop('f11');
  verificaAvanco();
}

this.b12.addEventListener("click", fl_MouseClickHandler_12.bind(this));

function fl_MouseClickHandler_12() {
  this.gotoAndStop('f12');
  verificaAvanco();
}

Answer 1

Fala Amigo,

I believe you can do the validation differently.

Currently your validation is being done through the contactor, with this you have no control of the button clicked, right?

What you can do, is create an Array type VAR with 12 positions and each button you click you add the value at the respective position.

var nome_Array = new Array(12);

function verificaAvanco() {


  if (nome_Array.toString() == '1,1,1,1,1,1,1,1,1,1,1,1'){

    window.parent.postMessage('destravaSlide', '*');
}

this.b1.addEventListener("click", fl_MouseClickHandler.bind(this));

function fl_MouseClickHandler() {

  btn = Number(this.name.slice(1,this.name.length));
  nome_Array[btn-1]= '1'; 

  this.gotoAndStop('f1');

  verificaAvanco();

}

It’ll get a little manual, but supply what you need. To other ways of doing it, but based on your code, I believe it helps you.