I'm trying to remove event listeners inside my LocalActor class like this:
class LocalActor {
..
this._whiteboards = document.getElementsByClassName("whiteboards")[0];
this.setupListeners();
}
Later in setupListeners, I have this:
setupListeners() {
this._whiteboards.addEventListener('mousedown', e => this.mouseDown(e), false);
this._whiteboards.addEventListener('mouseup', e => this.mouseUp(e), false);
this._whiteboards.addEventListener('mouseout', e => this.mouseUp(e), false);
this._whiteboards.addEventListener('mousemove', e => this.mouseMove(e), false);
//Touch support for mobile devices
this._whiteboards.addEventListener('touchstart', e => this.mouseDown(e), false);
this._whiteboards.addEventListener('touchend', e => this.mouseUp(e), false);
this._whiteboards.addEventListener('touchcancel', e => this.mouseUp(e), false);
this._whiteboards.addEventListener('touchmove', e => this.mouseMove(e), false);
}
The issue I have been having is that later I want to remove the event listeners, but they are not really removed...
removeDraw()//remove all listeners for draw. Ensure to add events when ready again
{
this._whiteboards.removeEventListener('touchstart', e => this.mouseDown(e), false);
this._whiteboards.removeEventListener('touchend', e => this.mouseUp(e), false);
this._whiteboards.removeEventListener('touchcancel', e => this.mouseUp(e), false);
this._whiteboards.removeEventListener('touchmove', e => this.mouseMove(e), false);
this._whiteboards.removeEventListener('mousedown', e => this.mouseDown(e), false);
this._whiteboards.removeEventListener('mouseup', e => this.mouseUp(e), false);
this._whiteboards.removeEventListener('mouseout', e => this.mouseUp(e), false);
this._whiteboards.removeEventListener('mousemove', e => this.mouseMove(e), false);
}
I read that when I create the event listener, it isn't actually bound to a function. I'm just not sure if I want to create a function for every listener, and then reference every function later. I have read and found 1 post on stack overflow that addresses seting these up in classes, but it was more just removing one function. I'm trying to see how I might be able to remove all of these efficiently. Thanks for any ideas.