removeEventListener and bind

[Gico62]

Hi.

I have objects  on an animation, they are clips, but are used as button with  4 steps in the timeline ( in, over, rollout and selected).

the principle of the script is this simple one

this.couverture.addEventListener("mouseover", rollover.bind(this,'couverture'));

this.couverture.addEventListener("mouseout", rollout.bind(this, 'couverture'));

this.couverture.addEventListener("click", obj_bon.bind(this,'couverture'));

function rollover(obj) {

this[obj].gotoAndPlay('over');

}

function rollout(obj) {

this[obj].gotoAndPlay('rollout');

}

function obj_bon(obj) {

this[obj].removeEventListener("mouseout",true);

this[obj].gotoAndPlay('selected');

}

the remove EventListener don't work, when i click on the object, the clip read the timeline correctly from the "selected" label, but as the rollover is still active, moving the mouse out of the object send back the timeline to the "rollout" label, as i want  the object to become inactive. i have seen some solution involving the bounds, but did'nt find a way to adapt them to my script (  functions with parameters)

thanks

[kglad · Accepted solution]

when using bind:

var f1=whateverF.bind(this);

this.whateverobj.addEventListener(event1,f1);

you can then use:

this.whateverobj.removeEventListener(event1,f1);

or if needed in another frame of the same timeline:

this.f1=whateverF.bind(this);

this...addEventListener(e1,this.f1);

.

.

.

this...removeEventListener(e1,this.f1);

[Gico62]

Thanks kglad, it's perfect, I ended with this code :

var couv_hover=rollover.bind(this,'couverture');

this.couverture.addEventListener("mouseover",couv_hover);

var couv_out=rollout.bind(this,'couverture');

this.couverture.addEventListener("mouseout",couv_out);

this.couverture.addEventListener("click", obj_bon.bind(this,'couverture'));

function rollover(obj) {

this[obj].gotoAndPlay('over');

}

function rollout(obj) {

this[obj].gotoAndPlay('out');

}

function obj_bon(obj) {

    score++;

    this.score.score_dyn.text = score;   

    this[obj].gotoAndPlay('selected');

    this[obj].removeEventListener("mouseout",couv_out);

    this[obj].removeEventListener("mouseover",couv_hover);

}

[kglad]

you're welcome.

[Gico62]

Maybe i could use your help a little more, as i have several objects who will use the same functions, i need to have consistancy in naming , but i don't succeed to concatenate a function name

function obj_bon(obj) {

var function_hover = [obj] +'_out';  // ex : couverture_out

this[obj].removeEventListener("mouseout", function_hover );

}

[kglad]

i don't know what that is, but if you're trying to generalize that code:

function addListenerF(obj,functionF,eventE,this_var){

obj.functionF=functionF.bind(this_var);

obj.addEventListener(eventE,obj.functionF);

}

function removeListenerF(obj,functionF,eventE,this_var){

obj.removeEventListener(eventE,obj[functionF]);

}