Transform Gizmo Refactor #1085
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| Original file line number | Diff line number | Diff line change | ||||
|---|---|---|---|---|---|---|
| @@ -0,0 +1,163 @@ | ||||||
| import SceneObject from "./SceneObject" | ||||||
| import { TransformControls } from "three/examples/jsm/controls/TransformControls.js" | ||||||
| import InputSystem from "../input/InputSystem" | ||||||
| import World from "../World" | ||||||
| import MirabufSceneObject from "@/mirabuf/MirabufSceneObject" | ||||||
| import { PerspectiveCamera } from "three" | ||||||
| import { ThreeMatrix4_JoltMat44, ThreeQuaternion_JoltQuat } from "@/util/TypeConversions" | ||||||
|
|
||||||
| export type GizmoMode = "translate" | "rotate" | "scale" | ||||||
|
|
||||||
| class GizmoSceneObject extends SceneObject { | ||||||
| private _gizmo: TransformControls | ||||||
| private _mesh: THREE.Mesh | ||||||
| private _parentObject: MirabufSceneObject | undefined | ||||||
HunterBarclay marked this conversation as resolved.
Show resolved
Hide resolved
|
||||||
|
|
||||||
| private _mainCamera: PerspectiveCamera | ||||||
|
|
||||||
| private _size: number | ||||||
|
|
||||||
| public get gizmo() { | ||||||
| return this._gizmo | ||||||
| } | ||||||
|
|
||||||
| public get mesh() { | ||||||
| return this._mesh | ||||||
| } | ||||||
|
|
||||||
| public constructor(mesh: THREE.Mesh, mode: GizmoMode, size: number, parentObject?: MirabufSceneObject) { | ||||||
| super() | ||||||
|
|
||||||
| this._mesh = mesh | ||||||
| this._parentObject = parentObject | ||||||
| this._mainCamera = World.SceneRenderer.mainCamera | ||||||
|
|
||||||
| this._size = size | ||||||
|
|
||||||
| this._gizmo = new TransformControls(World.SceneRenderer.mainCamera, World.SceneRenderer.renderer.domElement) | ||||||
| this._gizmo.setMode(mode) | ||||||
|
|
||||||
| World.SceneRenderer.RegisterSceneObject(this) | ||||||
| } | ||||||
|
|
||||||
| public Setup(): void { | ||||||
| // adding the mesh and gizmo to the scene | ||||||
| World.SceneRenderer.AddObject(this._mesh) | ||||||
| World.SceneRenderer.AddObject(this._gizmo) | ||||||
|
|
||||||
| // forcing the gizmo to rotate and transform with the object | ||||||
| this._gizmo.setSpace("local") | ||||||
| this._gizmo.attach(this._mesh) | ||||||
|
|
||||||
| this._gizmo.addEventListener("dragging-changed", (event: { target: TransformControls; value: unknown }) => { | ||||||
| // disable orbit controls when dragging the transform gizmo | ||||||
| const gizmoDragging = World.SceneRenderer.IsAnyGizmoDragging() | ||||||
| if (!event.value && !gizmoDragging) { | ||||||
| World.SceneRenderer.orbitControls.enabled = true // enable orbit controls when not dragging another transform gizmo | ||||||
| } else if (!event.value && gizmoDragging) { | ||||||
| World.SceneRenderer.orbitControls.enabled = false // disable orbit controls when dragging another transform gizmo | ||||||
| } else { | ||||||
| World.SceneRenderer.orbitControls.enabled = !event.value // disable orbit controls when dragging transform gizmo | ||||||
| } | ||||||
HunterBarclay marked this conversation as resolved.
Show resolved
Hide resolved
|
||||||
|
|
||||||
| if (event.target.mode === "translate") { | ||||||
| // disable other gizmos when translating | ||||||
| Array.from(World.SceneRenderer.sceneObjects.values()) | ||||||
| .filter(obj => obj instanceof GizmoSceneObject) | ||||||
| .forEach(obj => { | ||||||
| if (obj.gizmo.object === event.target.object && obj.gizmo.mode !== "translate") { | ||||||
| obj.gizmo.dragging = false | ||||||
| obj.gizmo.enabled = !event.value | ||||||
| return | ||||||
| } | ||||||
| }) | ||||||
|
There was a problem hiding this comment. Since you have the As long as the mirabuf instance id that would be the key in |
||||||
| } else if ( | ||||||
| event.target.mode === "scale" && | ||||||
| (InputSystem.isKeyPressed("ShiftRight") || InputSystem.isKeyPressed("ShiftLeft")) | ||||||
| ) { | ||||||
| // scale uniformly if shift is pressed | ||||||
| event.target.axis = "XYZE" | ||||||
| } else if (event.target.mode === "rotate") { | ||||||
| // scale on all axes | ||||||
| Array.from(World.SceneRenderer.sceneObjects.values()) | ||||||
| .filter(obj => obj instanceof GizmoSceneObject) | ||||||
| .forEach(obj => { | ||||||
| if ( | ||||||
| obj.gizmo.mode === "scale" && | ||||||
| event.target !== obj.gizmo && | ||||||
| obj.gizmo.object === event.target.object | ||||||
| ) { | ||||||
| obj.gizmo.dragging = false | ||||||
| obj.gizmo.enabled = !event.value | ||||||
| return | ||||||
| } | ||||||
| }) | ||||||
|
There was a problem hiding this comment. Same thing here - use the |
||||||
| } | ||||||
|
There was a problem hiding this comment. Would a switch be better here? I'm not sure if the if will be optimized, especially since you're checking inputs in one of the conditions. |
||||||
| }) | ||||||
|
|
||||||
| if (this._parentObject !== undefined) this._parentObject.DisablePhysics() | ||||||
| } | ||||||
| public Update(): void { | ||||||
| // updating the size of the gizmo based on the distance from the camera | ||||||
| const mainCameraFovRadians = (Math.PI * (this._mainCamera.fov * 0.5)) / 180 | ||||||
| this._gizmo.setSize( | ||||||
| (this._size / this._mainCamera.position.distanceTo(this.gizmo.object!.position)) * | ||||||
|
There was a problem hiding this comment. Are we sure object is always going to be non-null? |
||||||
| Math.tan(mainCameraFovRadians) * | ||||||
| 1.9 | ||||||
| ) | ||||||
|
|
||||||
| // mapping the mesh transformations to the mirabuf object | ||||||
| if (this._parentObject !== undefined) { | ||||||
| this._parentObject.DisablePhysics() | ||||||
|
|
||||||
| if (this._gizmo.dragging) { | ||||||
| this._parentObject.mirabufInstance.parser.rigidNodes.forEach(rn => { | ||||||
| World.PhysicsSystem.SetBodyPosition( | ||||||
| this._parentObject!.mechanism.GetBodyByNodeId(rn.id)!, | ||||||
| ThreeMatrix4_JoltMat44(this._mesh.matrix).GetTranslation() | ||||||
| ) | ||||||
| World.PhysicsSystem.SetBodyRotation( | ||||||
| this._parentObject!.mechanism.GetBodyByNodeId(rn.id)!, | ||||||
| ThreeQuaternion_JoltQuat(this._mesh.quaternion) | ||||||
| ) | ||||||
|
|
||||||
| rn.parts.forEach(part => { | ||||||
| const partTransform = this._parentObject!.mirabufInstance.parser.globalTransforms.get(part)! | ||||||
| .clone() | ||||||
| .premultiply(this._mesh.matrix) | ||||||
|
|
||||||
| const meshes = this._parentObject!.mirabufInstance.meshes.get(part) ?? [] | ||||||
| meshes.forEach(([batch, id]) => batch.setMatrixAt(id, partTransform)) | ||||||
| }) | ||||||
| }) | ||||||
| } | ||||||
| } | ||||||
|
|
||||||
| // creating enter key and escape key event listeners | ||||||
| if (InputSystem.isKeyPressed("Enter") && this._parentObject) { | ||||||
| // confirming placement of object | ||||||
| if (this._parentObject !== undefined) this._parentObject.EnablePhysics() | ||||||
|
There was a problem hiding this comment.
Suggested change
I know |
||||||
| World.SceneRenderer.RemoveSceneObject(this.id) | ||||||
| return | ||||||
| } else if (InputSystem.isKeyPressed("Escape") && this._parentObject) { | ||||||
| // cancelling the creation of the mirabuf scene object | ||||||
| World.SceneRenderer.RemoveSceneObject(this._parentObject.id) | ||||||
| World.SceneRenderer.RemoveSceneObject(this.id) | ||||||
| return | ||||||
| } | ||||||
|
There was a problem hiding this comment. Should |
||||||
| } | ||||||
|
|
||||||
| public Dispose(): void { | ||||||
| this._gizmo.detach() | ||||||
| if (this._parentObject) this._parentObject.RemoveGizmo() | ||||||
| World.SceneRenderer.RemoveObject(this._mesh) | ||||||
| World.SceneRenderer.RemoveObject(this._gizmo) | ||||||
| } | ||||||
|
|
||||||
| /** changes the mode of the gizmo */ | ||||||
| public SetMode(mode: GizmoMode) { | ||||||
| this._gizmo.setMode(mode) | ||||||
| } | ||||||
| } | ||||||
|
|
||||||
| export default GizmoSceneObject | ||||||
Oops, something went wrong.
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Since we've decided that only once gizmo will exist, this should be some kind of static either in the SceneRenderer or GizmoSceneObject itself.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
I can think of a case where we would want more than one gizmo in a scene at a time. For instance, what about placing more than one robot during the initialization of match mode?
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Honestly, I think for initial robot placement, we should move away from using the gizmo tool altogether and move towards Luca's placement for bots for match mode in v6 where you can click and place. In which case, gizmo controls should be reserved for fine movement/orientation/scale control.