Highlighted

[canvas] Using removeEventListener remove button states

Community Beginner ,
Aug 20, 2020

Copy link to clipboard

Copied

I've a button in a clip timeline, the button actions are  in the clip timelin. Since this clip is load several time, the click in the button is cumulative (if a load the clip 5 times, one single click in the button make 5 calls). So before binding the click i remove previous events attached to the button with 'removeEventListener' and then i declare the mouse event for the button.
In this way the button (with have graphical different status) loose the rollover status.
There's another way to do this without losing button status?

Tnx in advace

Adobe Community Professional
Correct answer by JoãoCésar | Adobe Community Professional

Hi.

 

How are you trying to remove the events?

 

Anyway, there are two approaches that you can use to check if an instance already has an event listener:

- Using the hasEventListener method;

- Or by creating a boolean flag in the frame you are adding the events and testing this flag everytime the frame is visited. For example:

if (!this.frame0Visited)
{
    this.yourButton.on("click", function(e){ // do something });
    this.frame0Visited = true;
}

 

In this way the click listener won't be added again.

 

Please let us know if this works for you.

 

Regards,

JC

Views

55

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more

[canvas] Using removeEventListener remove button states

Community Beginner ,
Aug 20, 2020

Copy link to clipboard

Copied

I've a button in a clip timeline, the button actions are  in the clip timelin. Since this clip is load several time, the click in the button is cumulative (if a load the clip 5 times, one single click in the button make 5 calls). So before binding the click i remove previous events attached to the button with 'removeEventListener' and then i declare the mouse event for the button.
In this way the button (with have graphical different status) loose the rollover status.
There's another way to do this without losing button status?

Tnx in advace

Adobe Community Professional
Correct answer by JoãoCésar | Adobe Community Professional

Hi.

 

How are you trying to remove the events?

 

Anyway, there are two approaches that you can use to check if an instance already has an event listener:

- Using the hasEventListener method;

- Or by creating a boolean flag in the frame you are adding the events and testing this flag everytime the frame is visited. For example:

if (!this.frame0Visited)
{
    this.yourButton.on("click", function(e){ // do something });
    this.frame0Visited = true;
}

 

In this way the click listener won't be added again.

 

Please let us know if this works for you.

 

Regards,

JC

Views

56

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Aug 20, 2020 0
Adobe Community Professional ,
Aug 20, 2020

Copy link to clipboard

Copied

Hi.

 

How are you trying to remove the events?

 

Anyway, there are two approaches that you can use to check if an instance already has an event listener:

- Using the hasEventListener method;

- Or by creating a boolean flag in the frame you are adding the events and testing this flag everytime the frame is visited. For example:

if (!this.frame0Visited)
{
    this.yourButton.on("click", function(e){ // do something });
    this.frame0Visited = true;
}

 

In this way the click listener won't be added again.

 

Please let us know if this works for you.

 

Regards,

JC

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 20, 2020 1
Community Beginner ,
Aug 20, 2020

Copy link to clipboard

Copied

Yeah!
the variable script works like a charme!
Indeed a smart way to check the only-once.


I'm used to Flash and in its language there is no persistence of variables even when objects disappear from the Stage.
Again, thanks!
My best
Diz

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 20, 2020 0
Adobe Community Professional ,
Aug 20, 2020

Copy link to clipboard

Copied

there's no need to change what's working for you now but, in the future, and for others when trying to remove a canvas listener this is how to do it:

 

// this will fail:

this.btn.addEventListener("click",f.bind(this));

this.btn.removeEventListener("click", f.bind(this));

 

// this remove will work:

var fbind = f.bind(this);

this.btn.addEventListener("click",fbind);

this.btn.removeEventListener("click", fbind);

 

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 20, 2020 1
Adobe Community Professional ,
Aug 20, 2020

Copy link to clipboard

Copied

There's no reason to create another variable. This works just as well:

if (!this.yourButton.hasEventListener("click")) {
	this.yourButton.on("click", function(e){ // do something });
}

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 20, 2020 0
Adobe Community Professional ,
Aug 20, 2020

Copy link to clipboard

Copied

The advantage of creating another variable is that you can run only one check for multiple statements.

__________________________________________
HTML5, JSFL, and AS3 samples: http://bit.ly/2mJgDoG

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 20, 2020 0
ClayUUID LATEST
Adobe Community Professional ,
Aug 20, 2020

Copy link to clipboard

Copied

...and checking for the presence of an event listener can be that one check.

Likes

Translate

Translate

Report

Report
Community Guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
Reply
Loading...
Aug 20, 2020 0