babylonjs-editcontrol 3.2.5 → 4.0.0

package/package.json

@@ -1,37 +1,37 @@
-{
-  "name": "babylonjs-editcontrol",
-  "version": "3.2.5",
-  "description": "A transform control for Babylonjs mesh",
-  "repository": {
-    "type": "git",
-    "url": "git://github.com/ssatguru/BabylonJS-EditControl.git"
-  },
-  "keywords": [
-    "babylonjs",
-    "transform control",
-    "widget",
-    "gizmo"
-  ],
-  "author": "satguru <ssatguru@gmail.com>",
-  "license": "Apache-2.0",
-  "contributors": [],
-  "main": "dist/EditControl.js",
-  "types": "dist/EditControl.d.ts",
-  "dependencies": {},
-  "devDependencies": {
-    "babylonjs": "^4.1.0",
-    "babylonjs-gui": "^4.1.0",
-    "pepjs": "^0.4.3",
-    "terser-webpack-plugin": "^1.4.3",
-    "ts-loader": "^5.4.5",
-    "typescript": "^3.8.3",
-    "webpack": "^4.43.0",
-    "webpack-cli": "^3.3.11",
-    "webpack-dev-server": "^3.10.3"
-  },
-  "scripts": {
-    "build-prod": "webpack --mode production",
-    "build": "webpack",
-    "start": "webpack-dev-server --open-page /tst/test.html"
-  }
-}
+{
+  "name": "babylonjs-editcontrol",
+  "version": "4.0.0",
+  "description": "A transform control for Babylonjs mesh",
+  "repository": {
+    "type": "git",
+    "url": "git://github.com/ssatguru/BabylonJS-EditControl.git"
+  },
+  "keywords": [
+    "babylonjs",
+    "transform control",
+    "widget",
+    "gizmo"
+  ],
+  "author": "satguru <ssatguru@gmail.com>",
+  "license": "Apache-2.0",
+  "contributors": [],
+  "main": "dist/EditControl.js",
+  "types": "dist/EditControl.d.ts",
+  "dependencies": {},
+  "devDependencies": {
+    "babylonjs": "^8.47.0",
+    "babylonjs-gui": "^8.47.0",
+    "babylonjs-inspector": "^8.47.0",
+    "terser-webpack-plugin": "^5.3.6",
+    "ts-loader": "^9.4.2",
+    "typescript": "^5.9.3",
+    "webpack": "^5.104.1",
+    "webpack-cli": "^6.0.1",
+    "webpack-dev-server": "^5.2.3"
+  },
+  "scripts": {
+    "build-prod": "webpack --mode production",
+    "build": "webpack",
+    "start": "webpack-dev-server --open /tst/test.html"
+  }
+}

package/src/EditControl.ts

@@ -18,7 +18,9 @@ import {
     StandardMaterial,
     Vector3,
     TransformNode,
-    Engine
+    Engine,
+    DeepImmutableObject,
+    UtilityLayerRenderer
 }
     from 'babylonjs';
 
@@ -49,6 +51,7 @@ export class EditControl {
 
     private _canvas: HTMLCanvasElement;
     private _scene: Scene;
+    private _utilLayer: UtilityLayerRenderer;
     private _mainCamera: Camera;
     //root of the edit control
     private _ecRoot: Mesh;
@@ -66,24 +69,31 @@ export class EditControl {
     private _blueMat: StandardMaterial;
     private _whiteMat: StandardMaterial;
     private _yellowMat: StandardMaterial;
-    private _redCol: Color3 = new Color3(1, 0.2, 0.2);
-    private _greenCol: Color3 = new Color3(0.2, 1, 0.2);
-    private _blueCol: Color3 = new Color3(0.2, 0.2, 1);
-    private _whiteCol: Color3 = new Color3(1, 1, 1);
-    private _yellowCol: Color3 = new Color3(1, 1, 0.2);
+
+    private _redCol: Color3 = new Color3(1, 0.34, 0.26);
+    private _greenCol: Color3 = new Color3(0.0, 0.8, 0.16);
+    private _blueCol: Color3 = new Color3(0.21, 0.5, 1);
+
+    private _whiteCol: Color3 = new Color3(0.7, 0.7, 0.7);
+    private _yellowCol: Color3 = new Color3(1, 1, 0);
 
     private _actHist: ActHist;
     private _renderer: () => void;
     private _pointerdown: EventListener;
     private _pointerup: EventListener;
     private _pointermove: EventListener;
+
     //axes visibility
     private _visibility: number = 0.75;
 
     //lhs-rhs issue. lhs mesh in rhs or rhs mesh in lhs
     private _lhsRhs: boolean = false;
 
-    public constructor(mesh: TransformNode, camera: Camera, canvas: HTMLCanvasElement, scale?: number, eulerian?: boolean, pickWidth?: number) {
+    private _isEulerian(mesh:TransformNode):boolean{
+        return ((mesh.rotationQuaternion == null) || (mesh.rotationQuaternion == undefined));
+    }
+
+    public constructor(mesh: TransformNode, camera: Camera, canvas: HTMLCanvasElement, scale?: number, pickWidth?: number) {
 
         this._mesh = mesh;
         this._mainCamera = camera;
@@ -92,26 +102,24 @@ export class EditControl {
         if (scale != null) {
             this._axesScale = scale;
         }
-
-        if (eulerian !== null) {
-            this._eulerian = eulerian;
-        } else {
-            this._eulerian = false;
-        }
-        this._checkQuaternion();
+        
 
         if (pickWidth != null) {
             this._pickWidth = pickWidth;
         }
 
-        this._scene = mesh.getScene();
+
+        this._utilLayer = UtilityLayerRenderer.DefaultUtilityLayer;
+        this._utilLayer.onlyCheckPointerDownEvents = false;
+        this._scene = this._utilLayer.utilityLayerScene;
+
         this._actHist = new ActHist(mesh, 10);
 
         mesh.computeWorldMatrix(true);
         this._boundingDimesion = this._getBoundingDimension(mesh);
         this._setLocalAxes(mesh);
         this._lhsRhs = this._check_LHS_RHS(mesh);
-        console.log("lhs rhs issue " + this._lhsRhs);
+        if (this._lhsRhs) console.warn("we have lhs rhs issue " + this._lhsRhs);
 
         //build the edit control axes
         this._ecRoot = new Mesh("", this._scene);
@@ -149,16 +157,6 @@ export class EditControl {
         return this._ecRoot;
     }
 
-    //make sure that if eulerian is set to false then mesh's rotation is in quaternion
-    //throw error and exit if not so.
-    private _checkQuaternion() {
-        if (!this._eulerian) {
-            if ((this._mesh.rotationQuaternion == null) || (this._mesh.rotationQuaternion == undefined)) {
-                throw "Error: Eulerian is set to false but the mesh's rotationQuaternion is not set.";
-            }
-        }
-    }
-
     /**
         * checks if a have left hand , right hand issue.
         * In other words if a mesh is a LHS mesh in RHS system or 
@@ -223,7 +221,7 @@ export class EditControl {
     private _setECRotation() {
         if (this._local) {
             if (this._mesh.parent == null) {
-                if (this._eulerian) {
+                if (this._isEulerian(this._mesh)) {
                     let rot: Vector3 = this._mesh.rotation;
                     Quaternion.RotationYawPitchRollToRef(rot.y, rot.x, rot.z, this._ecRoot.rotationQuaternion);
                 } else {
@@ -262,7 +260,7 @@ export class EditControl {
     private _cameraNormal: Vector3 = new Vector3(0, 0, 0);
     private _setECScale() {
         this._ecRoot.position.subtractToRef(this._mainCamera.position, this._cameraTOec);
-        Vector3.FromFloatArrayToRef(this._mainCamera.getWorldMatrix().asArray(), 8, this._cameraNormal);
+        Vector3.FromArrayToRef(this._mainCamera.getWorldMatrix().asArray(), 8, this._cameraNormal);
 
         //get distance of edit control from the camera plane 
         //project "camera to edit control" vector onto the camera normal
@@ -346,13 +344,9 @@ export class EditControl {
 
 
 
-    public switchTo(mesh: TransformNode, eulerian?: boolean) {
+    public switchTo(mesh: TransformNode) {
         mesh.computeWorldMatrix(true);
         this._mesh = mesh;
-        if (eulerian != null) {
-            this._eulerian = eulerian;
-        }
-        this._checkQuaternion();
         this._setLocalAxes(mesh);
         this._actHist = new ActHist(mesh, 10);
         this._lhsRhs = this._check_LHS_RHS(mesh);
@@ -489,7 +483,7 @@ export class EditControl {
         evt.preventDefault();
         this._pDown = true;
         if ((<PointerEvent>evt).button != 0) return;
-        let engine: Engine = this._scene.getEngine();
+        let engine: Engine = <Engine> this._scene.getEngine();
         let x = (engine.isPointerLock) ? this._canvas.width * 0.5 : this._scene.pointerX;
         let y = (engine.isPointerLock) ? this._canvas.height * 0.5 : this._scene.pointerY;
         let pickResult: PickingInfo = this._scene.pick(x, y, (mesh) => {
@@ -501,7 +495,7 @@ export class EditControl {
                 if ((mesh == this._sX) || (mesh == this._sY) || (mesh == this._sZ) || (mesh == this._sXZ) || (mesh == this._sZY) || (mesh == this._sYX) || (mesh == this._sAll)) return true;
             }
             return false;
-        }, null, this._mainCamera);
+        }, false, this._mainCamera);
 
         if (pickResult.hit) {
             //this.setAxesVisiblity(0);
@@ -565,7 +559,7 @@ export class EditControl {
     private _detachCamera(cam: Object, can: Object) {
         let camera: Camera = <Camera>cam;
         let canvas: HTMLCanvasElement = <HTMLCanvasElement>can;
-        let engine: Engine = this._scene.getEngine();
+        let engine: Engine = <Engine> this._scene.getEngine();
         if (!engine.isPointerLock) {
             camera.detachControl(canvas)
         }
@@ -582,7 +576,7 @@ export class EditControl {
     private _savedCol: Color3;
     private _onPointerOver() {
         //if(this.pDown) return;
-        let engine: Engine = this._scene.getEngine();
+        let engine: Engine = <Engine> this._scene.getEngine();
         let x = (engine.isPointerLock) ? this._canvas.width * 0.5 : this._scene.pointerX;
         let y = (engine.isPointerLock) ? this._canvas.height * 0.5 : this._scene.pointerY;
         let pickResult: PickingInfo = this._scene.pick(x, y, (mesh) => {
@@ -594,7 +588,7 @@ export class EditControl {
                 if ((mesh == this._sX) || (mesh == this._sY) || (mesh == this._sZ) || (mesh == this._sXZ) || (mesh == this._sZY) || (mesh == this._sYX) || (mesh == this._sAll)) return true;
             }
             return false;
-        }, null, this._mainCamera);
+        }, false, this._mainCamera);
         if (pickResult.hit) {
             //if we are still over the same axis mesh then don't do anything
             if (<Mesh>pickResult.pickedMesh != this._prevOverMesh) {
@@ -604,7 +598,7 @@ export class EditControl {
                 this._prevOverMesh = <Mesh>pickResult.pickedMesh;
                 if (this._rotEnabled) {
                     this._savedCol = (<LinesMesh>this._prevOverMesh.getChildren()[0]).color;
-                    (<LinesMesh>this._prevOverMesh.getChildren()[0]).color = this._whiteCol;
+                    (<LinesMesh>this._prevOverMesh.getChildren()[0]).color = this._yellowCol;
                 } else {
                     let childs: Node[] = this._prevOverMesh.getChildren();
                     if (childs.length > 0) {
@@ -616,11 +610,11 @@ export class EditControl {
                     }
                 }
                 if (this._prevOverMesh.name == "X") {
-                    this._xaxis.color = this._whiteCol;
+                    this._xaxis.color = this._yellowCol;
                 } else if (this._prevOverMesh.name == "Y") {
-                    this._yaxis.color = this._whiteCol;
+                    this._yaxis.color = this._yellowCol;
                 } else if (this._prevOverMesh.name == "Z") {
-                    this._zaxis.color = this._whiteCol;
+                    this._zaxis.color = this._yellowCol;
                 }
             }
         } else {
@@ -670,9 +664,9 @@ export class EditControl {
     private _onPointerUp(evt: Event) {
         this._pDown = false;
         if (this._editing) {
-            let engine: Engine = this._scene.getEngine();
+            let engine: Engine = <Engine> this._scene.getEngine();
             if (!engine.isPointerLock) {
-                this._mainCamera.attachControl(this._canvas);
+                this._mainCamera.attachControl(true);
             }
             this._setEditing(false);
             //this.setAxesVisiblity(1);
@@ -1035,9 +1029,9 @@ export class EditControl {
      */
     private _setLocalAxes(mesh: Node) {
         let meshMatrix: Matrix = mesh.getWorldMatrix();
-        Vector3.FromFloatArrayToRef(meshMatrix.m, 0, this._localX);
-        Vector3.FromFloatArrayToRef(meshMatrix.m, 4, this._localY);
-        Vector3.FromFloatArrayToRef(meshMatrix.m, 8, this._localZ);
+        Vector3.FromArrayToRef(meshMatrix.m, 0, this._localX);
+        Vector3.FromArrayToRef(meshMatrix.m, 4, this._localY);
+        Vector3.FromArrayToRef(meshMatrix.m, 8, this._localZ);
     }
 
 
@@ -1072,7 +1066,7 @@ export class EditControl {
         this._boundingDimesion = this._getBoundingDimension(this._mesh);
     }
 
-    private _eulerian: boolean = false;
+    // private _eulerian: boolean = false;
     private _snapRA: number = 0;
     private _doRotation(mesh: TransformNode, axis: Mesh, newPos: Vector3, prevPos: Vector3) {
 
@@ -1131,10 +1125,6 @@ export class EditControl {
                 mesh.rotate(rAxis, angle, Space.WORLD);
             }
 
-            if (this._eulerian) {
-                mesh.rotation = mesh.rotationQuaternion.toEulerAngles();
-                mesh.rotationQuaternion = null;
-            }
 
             if (this._local) {
                 if (this._lhsRhs) {
@@ -1152,7 +1142,7 @@ export class EditControl {
     }
 
     private _getPosOnPickPlane(): Vector3 {
-        let engine: Engine = this._scene.getEngine();
+        let engine: Engine = <Engine> this._scene.getEngine();
         let x = (engine.isPointerLock) ? this._canvas.width * 0.5 : this._scene.pointerX;
         let y = (engine.isPointerLock) ? this._canvas.height * 0.5 : this._scene.pointerY;
         let pickinfo: PickingInfo = this._scene.pick(x, y, (mesh) => {
@@ -1241,10 +1231,7 @@ export class EditControl {
         return this._rotEnabled;
     }
 
-    public returnEuler(euler: boolean) {
-        this._eulerian = euler;
-    }
-
+    
     public enableRotation() {
         if (this._hidden) return;
         if (this._rCtl == null) {
@@ -1357,9 +1344,9 @@ export class EditControl {
         let guideAxes: Mesh = new Mesh("", this._scene);
 
         //the big axes, shown when an axis is selected
-        this._bXaxis = Mesh.CreateLines("", [new Vector3(-100, 0, 0), new Vector3(100, 0, 0)], this._scene);
-        this._bYaxis = Mesh.CreateLines("", [new Vector3(0, -100, 0), new Vector3(0, 100, 0)], this._scene);
-        this._bZaxis = Mesh.CreateLines("", [new Vector3(0, 0, -100), new Vector3(0, 0, 100)], this._scene);
+        this._bXaxis = MeshBuilder.CreateLines("", { points: [new Vector3(-100, 0, 0), new Vector3(100, 0, 0)] }, this._scene);
+        this._bYaxis = MeshBuilder.CreateLines("", { points: [new Vector3(0, -100, 0), new Vector3(0, 100, 0)] }, this._scene);
+        this._bZaxis = MeshBuilder.CreateLines("", { points: [new Vector3(0, 0, -100), new Vector3(0, 0, 100)] }, this._scene);
 
         //lines are now pickable too
         this._bXaxis.isPickable = false;
@@ -1376,9 +1363,9 @@ export class EditControl {
 
         //the small axis
         let al: number = this._axesLen * this._axesScale * 0.75;
-        this._xaxis = Mesh.CreateLines("", [new Vector3(0, 0, 0), new Vector3(al, 0, 0)], this._scene);
-        this._yaxis = Mesh.CreateLines("", [new Vector3(0, 0, 0), new Vector3(0, al, 0)], this._scene);
-        this._zaxis = Mesh.CreateLines("", [new Vector3(0, 0, 0), new Vector3(0, 0, al)], this._scene);
+        this._xaxis = MeshBuilder.CreateLines("", { points: [new Vector3(0, 0, 0), new Vector3(al, 0, 0)] }, this._scene);
+        this._yaxis = MeshBuilder.CreateLines("", { points: [new Vector3(0, 0, 0), new Vector3(0, al, 0)] }, this._scene);
+        this._zaxis = MeshBuilder.CreateLines("", { points: [new Vector3(0, 0, 0), new Vector3(0, 0, al)] }, this._scene);
 
         //lines are now pickable too
         this._xaxis.isPickable = false;
@@ -1406,10 +1393,10 @@ export class EditControl {
     private _pYX: Mesh;
 
     private _createPickPlanes() {
-        this._pALL = Mesh.CreatePlane("", 5, this._scene);
-        this._pXZ = Mesh.CreatePlane("", 5, this._scene);
-        this._pZY = Mesh.CreatePlane("", 5, this._scene);
-        this._pYX = Mesh.CreatePlane("", 5, this._scene);
+        this._pALL = MeshBuilder.CreatePlane("", { size: 5 }, this._scene);
+        this._pXZ = MeshBuilder.CreatePlane("", { size: 5 }, this._scene);
+        this._pZY = MeshBuilder.CreatePlane("", { size: 5 }, this._scene);
+        this._pYX = MeshBuilder.CreatePlane("", { size: 5 }, this._scene);
 
         this._pALL.isPickable = false;
         this._pXZ.isPickable = false;
@@ -1468,22 +1455,33 @@ export class EditControl {
 
         this._tCtl = new Mesh("", this._scene);
 
-        /*pickable invisible boxes around axes lines*/
+        // pickable invisible boxes around axes lines
         this._createPickableTrans(r, l, this._tCtl, this._scene);
 
         //non pickable but visible cones at end of axes lines
         this._createNonPickableTrans(r, l, this._scene);
     }
 
+    /**
+     * pickable but invisible 
+     * a) 3 boxes around each of the 3 small axes lines
+     * b) 3 small planes near origin for movement along a plane
+     * @param r 
+     * @param l 
+     * @param tCtl 
+     * @param scene 
+     */
+
     private _createPickableTrans(r: number, l: number, tCtl: Mesh, scene: Scene) {
         let tX = this._extrudeBox(r / 2, l);
         tX.name = "X";
         let tY = tX.clone("Y");
         let tZ = tX.clone("Z");
 
-        let tXZ = MeshBuilder.CreatePlane("XZ", { size: r * 2 }, scene);
-        let tZY = MeshBuilder.CreatePlane("ZY", { size: r * 2 }, scene);
-        let tYX = MeshBuilder.CreatePlane("YX", { size: r * 2 }, scene);
+        let s = r * 2;
+        let tXZ = MeshBuilder.CreatePlane("XZ", { size: s }, scene);
+        let tZY = MeshBuilder.CreatePlane("ZY", { size: s }, scene);
+        let tYX = MeshBuilder.CreatePlane("YX", { size: s }, scene);
 
         tXZ.rotation.x = 1.57;
         tZY.rotation.y = -1.57;
@@ -1501,7 +1499,7 @@ export class EditControl {
         tZY.bakeCurrentTransformIntoVertices();
         tYX.bakeCurrentTransformIntoVertices();
 
-        let tAll = Mesh.CreateBox("ALL", r * 2, scene);
+        let tAll = MeshBuilder.CreateBox("ALL", { size: r * 2 }, scene);
 
         tX.parent = tCtl;
         tY.parent = tCtl;
@@ -1529,12 +1527,15 @@ export class EditControl {
         this._setPickableFalse(this._all_t)
     }
 
+    //non pickable but visible 
+    // a) 3 cones at end of the 3 small axes lines
+    // b) 3 small planes near origin for movement along a plane
     private _createNonPickableTrans(r: number, l: number, scene: Scene) {
         //cone length
         let cl: number = l / 5;
         //cone base radius
         //let cr: number = r;
-        let tEndX = Mesh.CreateCylinder("", cl, 0, r, 6, 1, scene);
+        let tEndX = MeshBuilder.CreateCylinder("", { height: cl, diameterTop: 0, diameterBottom: r, tessellation: 6, subdivisions: 1 }, scene);
         let tEndY = tEndX.clone("");
         let tEndZ = tEndX.clone("");
 
@@ -1544,7 +1545,7 @@ export class EditControl {
         let tEndZY = MeshBuilder.CreatePlane("ZY", { size: s }, scene);
         let tEndYX = MeshBuilder.CreatePlane("YX", { size: s }, scene);
 
-        let tEndAll = Mesh.CreateBox("ALL", r, scene);
+        let tEndAll = MeshBuilder.CreateBox("ALL", { size: r }, scene);
 
         tEndX.rotation.x = 1.57;
         tEndY.rotation.x = 1.57;
@@ -1696,7 +1697,7 @@ export class EditControl {
         rEndX.color = this._redCol;
         rEndY.color = this._greenCol;
         rEndZ.color = this._blueCol;
-        rEndAll.color = this._yellowCol;
+        rEndAll.color = this._whiteCol;
         rEndAll2.color = Color3.Gray();
 
         this._rEndX = rEndX;
@@ -1723,7 +1724,7 @@ export class EditControl {
     private _extrudeBox(w: number, l: number): Mesh {
         let shape: Vector3[] = [new Vector3(w, w, 0), new Vector3(-w, w, 0), new Vector3(-w, -w, 0), new Vector3(w, -w, 0), new Vector3(w, w, 0)];
         let path: Vector3[] = [new Vector3(0, 0, 0), new Vector3(0, 0, l)];
-        let box: Mesh = Mesh.ExtrudeShape("", shape, path, 1, 0, 2, this._scene);
+        let box: Mesh = MeshBuilder.ExtrudeShape("", { shape: shape, path: path, scale: 1, rotation: 0, cap: 2 }, this._scene);
         return box;
     }
 
@@ -1749,7 +1750,7 @@ export class EditControl {
                 p++;
             }
         }
-        let circle: LinesMesh = Mesh.CreateLines("", points, this._scene);
+        let circle: LinesMesh = MeshBuilder.CreateLines("", { points: points }, this._scene);
         return circle;
     }
 
@@ -1766,7 +1767,7 @@ export class EditControl {
             points[p] = new Vector3(x, 0, z);
             p++;
         }
-        let tube: Mesh = Mesh.CreateTube("", points, this._pickWidth * this._axesScale * 2, 3, null, Mesh.NO_CAP, this._scene);
+        let tube: Mesh = MeshBuilder.CreateTube("", { path: points, radius: this._pickWidth * this._axesScale * 2, tessellation: 3, cap: Mesh.NO_CAP }, this._scene);
         return tube;
     }
 
@@ -1834,7 +1835,7 @@ export class EditControl {
         sZY.bakeCurrentTransformIntoVertices();
         sYX.bakeCurrentTransformIntoVertices();
 
-        let sAll: Mesh = Mesh.CreateBox("ALL", 2 * r, this._scene);
+        let sAll: Mesh = MeshBuilder.CreateBox("ALL", { size: 2 * r }, this._scene);
 
         sX.parent = sCtl;
         sY.parent = sCtl;
@@ -1864,7 +1865,7 @@ export class EditControl {
 
     private _createNonPickableScale(r: number, l: number) {
 
-        let sEndX = Mesh.CreateBox("", r, this._scene);
+        let sEndX = MeshBuilder.CreateBox("", { size: r }, this._scene);
         let sEndY = sEndX.clone("");
         let sEndZ = sEndX.clone("");
 
@@ -1874,7 +1875,7 @@ export class EditControl {
         let sEndYX = MeshBuilder.CreatePlane("YX", { size: s }, this._scene);
 
 
-        let sEndAll = Mesh.CreateBox("ALL", r, this._scene);
+        let sEndAll = MeshBuilder.CreateBox("ALL", { size: r }, this._scene);
 
         sEndXZ.rotation.x = 1.57;
         sEndZY.rotation.y = -1.57;
@@ -2106,8 +2107,8 @@ export class EditControl {
         this._redMat = EditControl._getStandardMaterial(this._redCol, scene);
         this._greenMat = EditControl._getStandardMaterial(this._greenCol, scene);
         this._blueMat = EditControl._getStandardMaterial(this._blueCol, scene);
-        this._whiteMat = EditControl._getStandardMaterial(this._whiteCol, scene);
-        this._yellowMat = EditControl._getStandardMaterial(this._yellowCol, scene);
+        this._whiteMat = EditControl._getStandardMaterial(this._yellowCol, scene);
+        this._yellowMat = EditControl._getStandardMaterial(this._whiteCol, scene);
     }
 
     private _disposeMaterials() {
@@ -2198,7 +2199,6 @@ class Act {
 
     public constructor(mesh: TransformNode, at: number) {
         this._p = mesh.position.clone();
-        //if (mesh.rotationQuaternion == null) {
         if (mesh.rotationQuaternion == null) {
             this._rQ = null;
             this._rE = mesh.rotation.clone();