Html5 - Button toggle movieclip only works every second reload

[Multim3dia]

Hi,

I have a simple interactive where i am showing/hiding movieclips using Toggle.

The strange thing is that they work the first time, but if i go to the next frame, then back, it doesn't work.

if i go to the next frame and back again, it works again (Every second time).

I quickly created another test animate file to see what was going out (This just had 1 Moviclip), and same result.

I called the debug log, and it seems to loop through the if else twice & prints out 4 values...

I just have two buttons (Home_btn & Toggle_btn)

// Stop at this frame
this.stop();
this.Icon1_mc.alpha = 0;
// log Movicelip alpha
console.log("Frame loaded, Movieclip alpha = " + this.Icon1_mc.alpha);
this.Home_btn.addEventListener("click", fl_GoHome.bind(this));
this.Toggle_btn.addEventListener("click", fl_ToggleIt.bind(this));
function fl_ToggleIt()
{
console.log("Movieclip alpha = " + this.Icon1_mc.alpha);
  // Hide the first and show the next here
      if (this.Icon1_mc.alpha  == 1){
  this.Icon1_mc.alpha = 0;
      }
  else {
  this.Icon1_mc.alpha = 1;
  }
}
this.Home_btn.addEventListener("click", fl_GoHome.bind(this));
function fl_GoHome()
{
this.gotoAndStop(0);
}

IF anyone has any clues it would be greatly appreciated.... it' baffling...

if anyone has 5 minutes to test, that would be greatly appreciated: test.fla - Google Drive

[JoãoCésar · Accepted solution]

Hi.

It's because multiple listeners are added to the same object everytime you change frames.

One way to prevent this is adding a custom boolean property to the main timeline and check if the frame is being visited for the first time.

Frame 0 (1)
if (!this.hasStarted)
    this.Start_btn.addEventListener("click", fl_GoFrame1.bind(this));
Frame 1 (2)
if (!this.hasStarted)
{
    this.Home_btn.addEventListener("pressup", fl_GoHome.bind(this));
    this.Home_btn.addEventListener("click", fl_GoHome.bind(this));
    this.Toggle_btn.addEventListener("pressup", fl_ToggleIt.bind(this));
    this.hasStarted = true;
}

Regards,

JC

[Multim3dia]

Thanks for taking the time to assist JC, so simple, so clean...

Works perfect.

[JoãoCésar]

You're welcome!