fix: FreehandLines no longer have cracks

 - These were caused by line segments becoming too short and the line fattening algorithm not working.
 - Also has the effect of smoothing the line somewhat.

Author: phtaylor

src/Tools/CreateTools/CreateCircleTool.ts

@@ -29,7 +29,7 @@ class CreateCircleTool extends CreateGeomTool {
    *
    * @param xfo - The xfo param.
    */
-  createStart(xfo: Xfo): void {
+  createStart(xfo: Xfo, event: ZeaPointerEvent): void {
     this.change = new CreateCircleChange(this.parentItem, xfo, this.colorParam.value)
     UndoRedoManager.getInstance().addChange(this.change)
 

src/Tools/CreateTools/CreateFreehandLineTool.ts

@@ -1,6 +1,7 @@
 import {
   BooleanParameter,
   TreeItem,
+  Vec2,
   Vec3,
   XRPoseEvent,
   Xfo,
@@ -22,8 +23,11 @@ import { AppData } from '../../../types/types'
  * @extends CreateLineTool
  */
 class CreateFreehandLineTool extends CreateLineTool {
-  invXfo: Xfo
-  prevP: Vec3
+  private invXfo: Xfo
+  private prevPointerPos: Vec2
+
+  drawLineOnSurface = true
+
   /**
    * Create a create freehand line tool.
    *
@@ -34,15 +38,15 @@ class CreateFreehandLineTool extends CreateLineTool {
   }
 
   screenPosToXfo(event: ZeaMouseEvent | ZeaTouchEvent): Xfo {
-    return super.screenPosToXfo(event, true)
+    return super.screenPosToXfo(event, this.drawLineOnSurface)
   }
 
   /**
    * Starts the creation of a free hand line.
    *
    * @param xfo - The xfo param.
    */
-  createStart(xfo: Xfo): void {
+  createStart(xfo: Xfo, event: ZeaPointerEvent): void {
     const color = this.colorParam.value
     const lineThickness = this.lineThickness.value
 
@@ -52,7 +56,7 @@ class CreateFreehandLineTool extends CreateLineTool {
     this.xfo = xfo
     this.invXfo = xfo.inverse()
     this.stage = 1
-    this.prevP = xfo.tr
+    this.prevPointerPos = event.pointerPos
     this.length = 0
   }
 
@@ -62,14 +66,20 @@ class CreateFreehandLineTool extends CreateLineTool {
    * @param pt - The pt param.
    */
   createMove(pt: Vec3, event: ZeaPointerEvent): void {
+    const pointerPos = event.pointerPos
+
     const p = this.invXfo.transformVec3(pt)
-    const delta = p.subtract(this.prevP).length()
-    this.change.update({
-      point: p,
-    })
+    const delta = pointerPos.distanceTo(this.prevPointerPos)
+    // Add a point only if the distance is greater than 5 pixels.
+    // This is to avoid adding too many points when the mouse is moved slowly.
+    if (delta > 5) {
+      this.change.update({
+        point: p,
+      })
 
-    this.length += delta
-    this.prevP = p
+      this.length += delta
+      this.prevPointerPos = pointerPos
+    }
   }
 
   /**

src/Tools/CreateTools/CreateLineTool.ts

@@ -32,7 +32,7 @@ class CreateLineTool extends CreateGeomTool {
    *
    * @param xfo - The xfo param.
    */
-  createStart(xfo: Xfo): void {
+  createStart(xfo: Xfo, event: ZeaPointerEvent): void {
     const color = this.colorParam.value
     const lineThickness = this.lineThickness.value
     this.change = new CreateLineChange(this.parentItem, xfo, color, lineThickness)

src/Tools/CreateTools/CreateMultiLineTool.ts

@@ -40,7 +40,7 @@ class CreateMultiLineTool extends CreateGeomTool {
    *
    * @param xfo - The xfo param.
    */
-  createStart(xfo: Xfo): void {
+  createStart(xfo: Xfo, event: ZeaPointerEvent): void {
     if (this.stage == 1) return
 
     this.change = new CreateMultiLineChange(this.parentItem, xfo, this.colorParam.value)

src/Tools/CreateTools/CreateRectTool.ts

@@ -30,7 +30,7 @@ class CreateRectTool extends CreateGeomTool {
    *
    * @param xfo - The xfo param.
    */
-  createStart(xfo: Xfo): void {
+  createStart(xfo: Xfo, event: ZeaPointerEvent): void {
     this.change = new CreateRectChange(this.parentItem, xfo, this.colorParam.value)
 
     // During construction, make it note selectable.

src/Tools/CreateTools/CreateSphereTool.ts

@@ -30,7 +30,7 @@ class CreateSphereTool extends CreateGeomTool {
    *
    * @param xfo - The xfo param.
    */
-  createStart(xfo: Xfo): void {
+  createStart(xfo: Xfo, event: ZeaPointerEvent): void {
     this.change = new CreateSphereChange(this.parentItem, xfo, this.colorParam.value)
 
     // During construction, make it note selectable.