mouseup vs. mousedown selectivity

[psytron]

I'm adding listeners to objects in a loop like this:

ref.addEventListener('mousedown', this.fireClickStarting );
ref.addEventListener('mouseup', this.fireClickEnding );

interactionManager.add( ref )

'mousedown' activates correctly only when clicked object ref
but 'mouseup' activates everywhere to all clicks in whole scene

This worked correctly in previous THREE REV, so perhaps it is a THREE.js R165 interaction

[markuslerner]

Hi @psytron, please check, if the 'click' event fires only on that object and let me know. It should actually rather be browser-related than three.js related. Which browser are you using? Do you have your code online?

[psytron]

the 'click' event ( subscribed as 'mouseup' ) fires anywhere on the whole screen. 'mousedown' fires correctly when clicking on the object but 'mouseup' fires everywhere. Using Chrome Version 126.0.6479.126 (Official Build) (arm64)

The code is pretty simple pretty much like the code above:

ref.addEventListener('mousedown', this.fireClickStarting );
ref.addEventListener('mouseup', this.fireClickEnding );

interactionManager.add( ref )

The two functions are subscribed to mouseup and mousedown in exactly the same way, but one behaves differently

[psytron]

'mousemove' is also same issue ( firing everywhere on whole screen ) 'mousedown' works correctly , only on object

[markuslerner]

Hi @psytron, sorry for my late reply. I was on holiday. "mouseup" will of course fire everywhere on the screen. "click" should fire only on the object. Nevertheless I added the property "wasIntersectedOnMouseDown" to InteractiveEvent in Version 1.8.0, so you can determine, whether an event was started (mouse down, touch down) on that particular object like this:

cube.addEventListener('mouseup', (event) => {
   if (event.wasIntersectedOnMouseDown) {
      // Object was intersected when mouse down fired, so this is essentially a click event
   } else {
      // Object was not intersected when mouse down fired
   }
});

You can also use the properties intersected, to check if the object is currently intersected and wasIntersected to check, if the object was intersected during the last event or render.