Solving bug of unintentionally highlighting when navigating

Author: Tomas1337

source/engine/viewer/navigation.js

@@ -249,9 +249,12 @@ export class Navigation
 		this.clickDetector = new ClickDetector ();
 
 		this.onMouseClick = null;
-		this.onMouseMove = null;
+		this.onMouseMove = callbacks.onMouseMove || null;
 		this.onContext = null;
 
+		this.onMouseDown = callbacks.onMouseDown || null;
+		this.onMouseUp = callbacks.onMouseUp || null;
+
 		if (this.canvas.addEventListener) {
 			this.canvas.addEventListener ('mousedown', this.OnMouseDown.bind (this));
 			this.canvas.addEventListener ('wheel', this.OnMouseWheel.bind (this));
@@ -266,6 +269,7 @@ export class Navigation
 			document.addEventListener ('mouseup', this.OnMouseUp.bind (this));
 			document.addEventListener ('mouseleave', this.OnMouseLeave.bind (this));
 		}
+	
 	}
 
 	SetMouseClickHandler (onMouseClick)
@@ -378,6 +382,11 @@ export class Navigation
 		if (!this.enableCameraMovement) {
             this.isMouseDown = true;
         }
+
+		if (this.onMouseDown) {
+			let mouseCoords = this.mouse.GetPosition();
+			this.onMouseDown(mouseCoords);
+		}
 	}
 
 	OnMouseMove (ev)
@@ -397,6 +406,11 @@ export class Navigation
             return;
         }
 
+		if (this.onMouseMove) {
+			let mouseCoords = this.mouse.GetPosition();
+			this.onMouseMove(mouseCoords);
+		}
+
 		let moveDiff = this.mouse.GetMoveDiff ();
 		let mouseButton = this.mouse.GetButton ();
 		let navigationType = NavigationType.None;
@@ -440,6 +454,11 @@ export class Navigation
 		if (!this.enableCameraMovement) {
             this.isMouseDown = false;
         }
+
+		if (this.onMouseUp) {
+			let mouseCoords = this.mouse.GetPosition();
+			this.onMouseUp(mouseCoords);
+		}
 	}
 
 	OnMouseLeave (ev)

source/engine/viewer/viewer.js

@@ -175,6 +175,8 @@ export class Viewer
         this.settings = {
             animationSteps : 40
         };
+        this.isNavigating = false;
+
     }
 
     Init (canvas)
@@ -211,6 +213,18 @@ export class Viewer
         this.navigation.SetMouseClickHandler (onMouseClick);
     }
 
+    SetMouseDownHandler(handler) {
+        if (this.navigation) {
+            this.navigation.onMouseDown = handler;
+        }
+    }
+
+    SetMouseUpHandler(handler) {
+        if (this.navigation) {
+            this.navigation.onMouseUp = handler;
+        }
+    }
+
     SetMouseMoveHandler (onMouseMove)
     {
         this.navigation.SetMouseMoveHandler (onMouseMove);
@@ -544,9 +558,24 @@ export class Viewer
         this.scene.add (this.camera);
 
         let canvasElem = this.renderer.domElement;
-        this.navigation = new Navigation (canvasElem, camera, {
-            onUpdate : () => {
-                this.Render ();
+        this.navigation = new Navigation(canvasElem, camera, {
+            onUpdate: () => {
+                this.Render();
+            },
+            onMouseDown: (mouseCoordinates) => {
+                if (this.mouseDownHandler) {
+                    this.mouseDownHandler(mouseCoordinates);
+                }
+            },
+            onMouseMove: (mouseCoordinates) => {
+                if (this.mouseMoveHandler) {
+                    this.mouseMoveHandler(mouseCoordinates);
+                }
+            },
+            onMouseUp: (mouseCoordinates) => {
+                if (this.mouseUpHandler) {
+                    this.mouseUpHandler(mouseCoordinates);
+                }
             }
         });
 

source/engine/viewer/viewermodel.js

@@ -145,6 +145,22 @@ export class ViewerMainModel
         this.edgeSettings = new EdgeSettings (false, new RGBColor (0, 0, 0), 1);
         this.hasLines = false;
         this.hasPolygonOffset = false;
+
+        this.mouseDownHandler = null;
+        this.mouseMoveHandler = null;
+        this.mouseUpHandler = null;
+    }
+
+    SetMouseDownHandler(handler) {
+        this.mouseDownHandler = handler;
+    }
+    
+    SetMouseMoveHandler(handler) {
+        this.mouseMoveHandler = handler;
+    }
+    
+    SetMouseUpHandler(handler) {
+        this.mouseUpHandler = handler;
     }
 
     SetMainObject (mainObject)

source/website/website.js

@@ -382,20 +382,6 @@ export class Website
         }
     }
 
-    OnModelMouseMove(mouseCoordinates) {
-        if (this.highlightTool.IsActive()) {
-            let meshUserData = this.viewer.GetMeshUserDataUnderMouse(IntersectionMode.MeshAndLine, mouseCoordinates);
-            if (meshUserData === null) {
-                // No intersection with model, allow navigation
-                this.viewer.navigation.EnableCameraMovement(true);
-            } else {
-                // Intersection with model, use highlight tool
-                this.highlightTool.MouseMove(mouseCoordinates);
-                this.viewer.navigation.EnableCameraMovement(false);
-            }
-        }
-    }
-
     OnModelContextMenu (globalMouseCoordinates, mouseCoordinates)
     {
         if (this.highlightTool.IsActive()) {
@@ -681,6 +667,41 @@ export class Website
             ShowSharingDialog(this.settings, this.viewer);
         });
 
+        this.viewer.SetMouseDownHandler(this.OnModelMouseDown.bind(this));
+        this.viewer.SetMouseMoveHandler(this.OnModelMouseMove.bind(this));
+        this.viewer.SetMouseUpHandler(this.OnModelMouseUp.bind(this));
+
+    }
+    OnModelMouseDown(mouseCoordinates) {
+        if (this.highlightTool.IsActive()) {
+            let meshUserData = this.viewer.GetMeshUserDataUnderMouse(IntersectionMode.MeshAndLine, mouseCoordinates);
+            if (meshUserData === null) {
+                // No intersection with model, allow navigation
+                this.viewer.navigation.EnableCameraMovement(true);
+                this.isNavigating = true;
+            } else {
+                // Intersection with model, use highlight tool
+                this.viewer.navigation.EnableCameraMovement(false);
+            }
+        }
+    }
+    
+    OnModelMouseMove(mouseCoordinates) {
+        if (this.highlightTool.IsActive() && !this.isNavigating) {
+            let meshUserData = this.viewer.GetMeshUserDataUnderMouse(IntersectionMode.MeshAndLine, mouseCoordinates);
+            if (meshUserData !== null) {
+                this.highlightTool.MouseMove(mouseCoordinates);
+            }
+        }
+    }
+    
+    OnModelMouseUp(mouseCoordinates) {
+        if (this.highlightTool.IsActive()) {
+            if (!this.isNavigating) {
+                this.highlightTool.Click(mouseCoordinates);
+            }
+            this.isNavigating = false;
+        }
     }
 
     InitToolbar ()