Use native mouse events for measurements controls, not Scene.input ev…

…ents #1190
xeokit · Oct 21, 2023 · acc9a98 · Amoki · Oct 23, 2023 · xeolabs
1 parent b64f34b
commit acc9a98
Show file tree

Hide file tree

Showing 2 changed files with 37 additions and 24 deletions.
diff --git a/src/plugins/AngleMeasurementsPlugin/AngleMeasurementsMouseControl.js b/src/plugins/AngleMeasurementsPlugin/AngleMeasurementsMouseControl.js
@@ -227,15 +227,21 @@ export class AngleMeasurementsMouseControl extends AngleMeasurementsControl {
                         break;
                 }
             });
-        this._onInputMouseDown = input.on("mousedown", (coords) => {
-            lastMouseCanvasX = coords[0];
-            lastMouseCanvasY = coords[1];
+        canvas.addEventListener('mousedown', this._onMouseDown = (e) => {
+            if (e.which !== 1) {
+                return;
+            }
+            lastMouseCanvasX = e.clientX;
+            lastMouseCanvasY = e.clientY;
         });
-        this._onInputMouseUp = input.on("mouseup", (coords) => {
-            if (coords[0] > lastMouseCanvasX + clickTolerance ||
-                coords[0] < lastMouseCanvasX - clickTolerance ||
-                coords[1] > lastMouseCanvasY + clickTolerance ||
-                coords[1] < lastMouseCanvasY - clickTolerance) {
+        canvas.addEventListener("mouseup", this._onMouseUp =(e) => {
+            if (e.which !== 1) {
+                return;
+            }
+            if (e.clientX > lastMouseCanvasX + clickTolerance ||
+                e.clientX < lastMouseCanvasX - clickTolerance ||
+                e.clientY > lastMouseCanvasY + clickTolerance ||
+                e.clientY < lastMouseCanvasY - clickTolerance) {
                 return;
             }
             switch (this._mouseState) {
@@ -352,10 +358,10 @@ export class AngleMeasurementsMouseControl extends AngleMeasurementsControl {
             this.pointerLens.visible = false;
         }
         this.reset();
-        const input = this.angleMeasurementsPlugin.viewer.scene.input;
+        const canvas = this.scene.canvas.canvas;
+        canvas.removeEventListener("mousedown", this._onMouseDown);
+        canvas.removeEventListener("mouseup", this._onMouseUp);
         const cameraControl = this.angleMeasurementsPlugin.viewer.cameraControl;
-        input.off(this._onInputMouseDown);
-        input.off(this._onInputMouseUp);
         cameraControl.off(this._onMouseHoverSurface);
         cameraControl.off(this._onPickedSurface);
         cameraControl.off(this._onHoverNothing);

diff --git a/src/plugins/DistanceMeasurementsPlugin/DistanceMeasurementsMouseControl.js b/src/plugins/DistanceMeasurementsPlugin/DistanceMeasurementsMouseControl.js
@@ -86,8 +86,8 @@ export class DistanceMeasurementsMouseControl extends DistanceMeasurementsContro
 
         this._onCameraControlHoverSnapOrSurface = null;
         this._onCameraControlHoverSnapOrSurfaceOff = null;
-        this._onInputMouseDown = null;
-        this._onInputMouseUp = null;
+        this._onMouseDown = null;
+        this._onMouseUp = null;
         this._onCanvasTouchStart = null;
         this._onCanvasTouchEnd = null;
         this._snapping = cfg.snapping !== false;
@@ -223,16 +223,22 @@ export class DistanceMeasurementsMouseControl extends DistanceMeasurementsContro
                 }
             });
 
-        this._onInputMouseDown = input.on("mousedown", (coords) => {
-            pointerDownCanvasX = coords[0];
-            pointerDownCanvasY = coords[1];
+        canvas.addEventListener('mousedown', this._onMouseDown = (e) => {
+            if (e.which !== 1) {
+                return;
+            }
+            pointerDownCanvasX = e.clientX;
+            pointerDownCanvasY = e.clientY;
         });
 
-        this._onInputMouseUp = input.on("mouseup", (coords) => {
-            if (coords[0] > pointerDownCanvasX + clickTolerance ||
-                coords[0] < pointerDownCanvasX - clickTolerance ||
-                coords[1] > pointerDownCanvasY + clickTolerance ||
-                coords[1] < pointerDownCanvasY - clickTolerance) {
+        canvas.addEventListener("mouseup", this._onMouseUp =(e) => {
+            if (e.which !== 1) {
+                return;
+            }
+            if (e.clientX > pointerDownCanvasX + clickTolerance ||
+                e.clientX < pointerDownCanvasX - clickTolerance ||
+                e.clientY > pointerDownCanvasY + clickTolerance ||
+                e.clientY < pointerDownCanvasY - clickTolerance) {
                 return;
             }
             if (this._currentDistanceMeasurement) {
@@ -305,9 +311,10 @@ export class DistanceMeasurementsMouseControl extends DistanceMeasurementsContro
             this.pointerLens.visible = false;
         }
         this.reset();
-        const input = this.distanceMeasurementsPlugin.viewer.scene.input;
-        input.off(this._onInputMouseDown);
-        input.off(this._onInputMouseUp);
+        this.viewer
+        const canvas = this.scene.canvas.canvas;
+        canvas.removeEventListener("mousedown", this._onMouseDown);
+        canvas.removeEventListener("mouseup", this._onMouseUp);
         const cameraControl = this.distanceMeasurementsPlugin.viewer.cameraControl;
         cameraControl.off(this._onCameraControlHoverSnapOrSurface);
         cameraControl.off(this._onCameraControlHoverSnapOrSurfaceOff);