Im trying to use a global variable called _mouseoverdistancebool in my constructor to notice when the mouse is over an object 3D called distance in threejs. But the value never changes.
This is the code that affects the variable:
constructor(targetMesh, controls, camera, container) {
super();
this._mouseoverdistancebool = false;
this.addEventListeners();
}
addEventListeners() {
this._distance.addEventListener('mouseleave', this.mouseleavedistance);
this._distance.addEventListener('mouseenter', this.mouseenterdistance);
this._container.addEventListener('mousewheel', this.onMove);
this._container.addEventListener('DOMMouseScroll', this.onMove);
}
mouseenterdistance(evt) {
console.log("Mouse over the object!!!");
this._mouseoverdistancebool = true;
}
mouseleavedistance(evt) {
console.log("Mouse leaves the object....");
this._mouseoverdistancebool = false;
}
onMove(evt) {
console.log(this._mouseoverdistancebool);
}
So I can see in the debug that the events work well but the boolean is always false. Something like this:
>Mouse over the object!!!
>false
>Mouse leaves the object....
>false
Im new to constructors in javascript ... What Im doing wrong?