client side sketch scene not respecting base-unit-scale (#1576)

* client side sketch scene not respecting base-unit-scale

* test tweak

* remove dead code

* fix test

* A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu)

* test fix up

* trigger ci

* A snapshot a day keeps the bugs away! 📷🐛 (OS: ubuntu)

* trigger ci

---------

Co-authored-by: github-actions[bot] <github-actions[bot]@users.noreply.github.com>

src/clientSideScene/CameraControls.ts

@@ -220,6 +220,7 @@ export class CameraControls {
     this.onWindowResize()
 
     this.update()
+    this._usePerspectiveCamera()
   }
 
   private _isCamMovingCallback: (isMoving: boolean, isTween: boolean) => void =
@@ -373,7 +374,7 @@ export class CameraControls {
 
     return this.camera
   }
-  usePerspectiveCamera = () => {
+  _usePerspectiveCamera = () => {
     const { x: px, y: py, z: pz } = this.camera.position
     const { x: qx, y: qy, z: qz, w: qw } = this.camera.quaternion
     const zoom = this.camera.zoom
@@ -389,14 +390,17 @@ export class CameraControls {
     )
     direction.normalize()
     this.camera.position.copy(this.target).addScaledVector(direction, distance)
-
+  }
+  usePerspectiveCamera = () => {
+    this._usePerspectiveCamera()
     engineCommandManager.sendSceneCommand({
       type: 'modeling_cmd_req',
       cmd_id: uuidv4(),
       cmd: {
         type: 'default_camera_set_perspective',
         parameters: {
-          fov_y: this.camera.fov,
+          fov_y:
+            this.camera instanceof PerspectiveCamera ? this.camera.fov : 45,
           ...calculateNearFarFromFOV(this.lastPerspectiveFov),
         },
       },

src/clientSideScene/sceneEntities.ts

@@ -106,9 +106,10 @@ class SceneEntities {
 
     Object.values(this.activeSegments).forEach((segment) => {
       const factor =
-        sceneInfra.camControls.camera instanceof OrthographicCamera
+        (sceneInfra.camControls.camera instanceof OrthographicCamera
           ? orthoFactor
-          : perspScale(sceneInfra.camControls.camera, segment)
+          : perspScale(sceneInfra.camControls.camera, segment)) /
+        sceneInfra._baseUnitMultiplier
       if (
         segment.userData.from &&
         segment.userData.to &&
@@ -143,9 +144,9 @@ class SceneEntities {
           ? orthoFactor
           : perspScale(sceneInfra.camControls.camera, this.axisGroup)
       const x = this.axisGroup.getObjectByName(X_AXIS)
-      x?.scale.set(1, factor, 1)
+      x?.scale.set(1, factor / sceneInfra._baseUnitMultiplier, 1)
       const y = this.axisGroup.getObjectByName(Y_AXIS)
-      y?.scale.set(factor, 1, 1)
+      y?.scale.set(factor / sceneInfra._baseUnitMultiplier, 1, 1)
     }
   }
 
@@ -169,6 +170,7 @@ class SceneEntities {
     this.scene.add(this.intersectionPlane)
   }
   createSketchAxis(sketchPathToNode: PathToNode) {
+    const orthoFactor = orthoScale(sceneInfra.camControls.camera)
     const baseXColor = 0x000055
     const baseYColor = 0x550000
     const xAxisGeometry = new BoxGeometry(100000, 0.3, 0.01)
@@ -208,6 +210,14 @@ class SceneEntities {
       sceneInfra.camControls.target
     )
     gridHelper.scale.set(sceneScale, sceneScale, sceneScale)
+
+    const factor =
+      sceneInfra.camControls.camera instanceof OrthographicCamera
+        ? orthoFactor
+        : perspScale(sceneInfra.camControls.camera, this.axisGroup)
+    xAxisMesh?.scale.set(1, factor / sceneInfra._baseUnitMultiplier, 1)
+    yAxisMesh?.scale.set(factor / sceneInfra._baseUnitMultiplier, 1, 1)
+
     this.axisGroup.add(xAxisMesh, yAxisMesh, gridHelper)
     this.currentSketchQuaternion &&
       this.axisGroup.setRotationFromQuaternion(this.currentSketchQuaternion)
@@ -279,9 +289,10 @@ class SceneEntities {
     )
     const orthoFactor = orthoScale(sceneInfra.camControls.camera)
     const factor =
-      sceneInfra.camControls.camera instanceof OrthographicCamera
+      (sceneInfra.camControls.camera instanceof OrthographicCamera
         ? orthoFactor
-        : perspScale(sceneInfra.camControls.camera, dummy)
+        : perspScale(sceneInfra.camControls.camera, dummy)) /
+      sceneInfra._baseUnitMultiplier
     sketchGroup.value.forEach((segment, index) => {
       let segPathToNode = getNodePathFromSourceRange(
         draftSegment ? truncatedAst : kclManager.ast,
@@ -404,7 +415,7 @@ class SceneEntities {
           const isClosingSketch = compareVec2Epsilon2(
             firstSeg.from,
             [intersection2d.x, intersection2d.y],
-            1
+            0.5
           )
           let modifiedAst
           if (isClosingSketch) {
@@ -567,9 +578,10 @@ class SceneEntities {
         // const prevSegment = sketchGroup.slice(index - 1)[0]
         const type = group?.userData?.type
         const factor =
-          sceneInfra.camControls.camera instanceof OrthographicCamera
+          (sceneInfra.camControls.camera instanceof OrthographicCamera
             ? orthoFactor
-            : perspScale(sceneInfra.camControls.camera, group)
+            : perspScale(sceneInfra.camControls.camera, group)) /
+          sceneInfra._baseUnitMultiplier
         if (type === TANGENTIAL_ARC_TO_SEGMENT) {
           this.updateTangentialArcToSegment({
             prevSegment: sketchGroup[index - 1],

src/clientSideScene/sceneInfra.ts

@@ -18,9 +18,8 @@ import {
   Intersection,
   Object3D,
   Object3DEventMap,
-  BoxGeometry,
 } from 'three'
-import { compareVec2Epsilon2 } from 'lang/std/sketch'
+import { Coords2d, compareVec2Epsilon2 } from 'lang/std/sketch'
 import { useModelingContext } from 'hooks/useModelingContext'
 import * as TWEEN from '@tweenjs/tween.js'
 import { SourceRange } from 'lang/wasm'
@@ -88,6 +87,8 @@ class SceneInfra {
   fov = 45
   fovBeforeAnimate = 45
   isFovAnimationInProgress = false
+  _baseUnit: BaseUnit = 'mm'
+  _baseUnitMultiplier = 1
   onDragCallback: (arg: OnDragCallbackArgs) => void = () => {}
   onMoveCallback: (arg: onMoveCallbackArgs) => void = () => {}
   onClickCallback: (arg?: OnClickCallbackArgs) => void = () => {}
@@ -107,6 +108,15 @@ class SceneInfra {
     this.onMouseLeave = callbacks.onMouseLeave || this.onMouseLeave
     this.selected = null // following selections between callbacks being set is too tricky
   }
+  set baseUnit(unit: BaseUnit) {
+    this._baseUnit = unit
+    this._baseUnitMultiplier = baseUnitTomm(unit)
+    this.scene.scale.set(
+      this._baseUnitMultiplier,
+      this._baseUnitMultiplier,
+      this._baseUnitMultiplier
+    )
+  }
   resetMouseListeners = () => {
     sceneInfra.setCallbacks({
       onDrag: () => {},
@@ -202,7 +212,12 @@ class SceneInfra {
     const axisGroup = this.scene
       .getObjectByName(AXIS_GROUP)
       ?.getObjectByName('gridHelper')
-    planesGroup && planesGroup.scale.set(scale, scale, scale)
+    planesGroup &&
+      planesGroup.scale.set(
+        scale / sceneInfra._baseUnitMultiplier,
+        scale / sceneInfra._baseUnitMultiplier,
+        scale / sceneInfra._baseUnitMultiplier
+      )
     axisGroup?.name === 'gridHelper' && axisGroup.scale.set(scale, scale, scale)
   }
 
@@ -270,8 +285,11 @@ class SceneInfra {
     }
 
     return {
-      intersection2d: new Vector2(transformedPoint.x, transformedPoint.y), // z should be 0
-      intersectPoint,
+      intersection2d: new Vector2(
+        transformedPoint.x / this._baseUnitMultiplier,
+        transformedPoint.y / this._baseUnitMultiplier
+      ), // z should be 0
+      intersectPoint: intersectPoint.divideScalar(this._baseUnitMultiplier),
       intersection: planeIntersects[0],
     }
   }
@@ -483,7 +501,11 @@ class SceneInfra {
       this.camControls.camera,
       this.camControls.target
     )
-    planesGroup.scale.set(sceneScale, sceneScale, sceneScale)
+    planesGroup.scale.set(
+      sceneScale / sceneInfra._baseUnitMultiplier,
+      sceneScale / sceneInfra._baseUnitMultiplier,
+      sceneScale / sceneInfra._baseUnitMultiplier
+    )
     this.scene.add(planesGroup)
   }
   removeDefaultPlanes() {

src/components/GlobalStateProvider.tsx

@@ -18,6 +18,7 @@ import {
 import { isTauri } from 'lib/isTauri'
 import { settingsCommandBarConfig } from 'lib/commandBarConfigs/settingsCommandConfig'
 import { authCommandBarConfig } from 'lib/commandBarConfigs/authCommandConfig'
+import { sceneInfra } from 'clientSideScene/sceneInfra'
 
 type MachineContext<T extends AnyStateMachine> = {
   state: StateFrom<T>
@@ -97,6 +98,7 @@ export const GlobalStateProvider = ({
       if (settingsState.context.theme !== 'system') return
       setThemeClass(e.matches ? Themes.Dark : Themes.Light)
     }
+    sceneInfra.baseUnit = settingsState?.context?.baseUnit || 'mm'
 
     matcher.addEventListener('change', listener)
     return () => matcher.removeEventListener('change', listener)