@dcl-regenesislabs/opendcl 0.2.1 → 0.2.2-26850672477.commit-99ffd91

package/skills/editor-gizmo/src/__editor/discovery.ts

@@ -0,0 +1,210 @@
+/** Auto-discovery of scene entities. */
+
+import {
+  engine,
+  Entity,
+  Transform,
+  MeshRenderer,
+  MeshCollider,
+  Material,
+  GltfContainer,
+  Name,
+  PointerEvents,
+  PointerEventType,
+  inputSystem,
+  InputAction,
+  ColliderLayer,
+} from '@dcl/sdk/ecs'
+import { Vector3 } from '@dcl/sdk/math'
+import {
+  SelectableInfo,
+  state,
+  editorEntities,
+  selectableInfoMap,
+  originalMaterials,
+  gizmoClickConsumed,
+} from './state'
+import { selectEntity } from './selection'
+
+
+/** Built-in entities to never register */
+export const SKIP_ENTITIES = new Set<Entity>()
+
+/** Entity names to skip (case-insensitive). Add names here to prevent selection. */
+const SKIP_NAMES = new Set(['ground', 'floor'])
+
+type PointerEventsValue = ReturnType<typeof PointerEvents.get>
+const originalPointerEvents = new Map<Entity, PointerEventsValue | null>()
+
+function addEditorHover(entity: Entity, name: string) {
+  const existing = PointerEvents.getMutableOrNull(entity)
+  const entry = {
+    eventType: PointerEventType.PET_DOWN,
+    eventInfo: { button: InputAction.IA_POINTER, hoverText: `Select ${name}`, maxDistance: 100 },
+  }
+  if (existing) {
+    existing.pointerEvents.push(entry)
+  } else {
+    PointerEvents.create(entity, { pointerEvents: [entry] })
+  }
+}
+
+function getEntityName(entity: Entity): string {
+  if (Name.has(entity)) {
+    return Name.get(entity).value
+  }
+  if (GltfContainer.has(entity)) {
+    const src = GltfContainer.get(entity).src
+    const filename = src.split('/').pop() ?? src
+    return filename.replace(/\.(glb|gltf)$/i, '')
+  }
+  if (MeshRenderer.has(entity)) {
+    const mr = MeshRenderer.get(entity) as any
+    const meshCase = mr?.mesh?.$case ?? 'mesh'
+    return `${meshCase} #${entity}`
+  }
+  return `entity #${entity}`
+}
+
+function detectMeshType(entity: Entity): 'box' | 'sphere' | 'cylinder' {
+  if (!MeshRenderer.has(entity)) return 'box'
+  try {
+    const mr = MeshRenderer.get(entity) as any
+    const c = mr?.mesh?.$case
+    if (c === 'sphere') return 'sphere'
+    if (c === 'cylinder') return 'cylinder'
+  } catch {}
+  return 'box'
+}
+
+function estimateBounds(entity: Entity): { centerOffset: Vector3; boundsSize: Vector3; isModel: boolean } {
+  const t = Transform.get(entity)
+  const s = t.scale ?? Vector3.One()
+
+  if (GltfContainer.has(entity)) {
+    return {
+      centerOffset: Vector3.create(0, Math.max(s.y * 0.5, 0.3), 0),
+      boundsSize: Vector3.create(Math.max(s.x, 0.5), Math.max(s.y, 0.5), Math.max(s.z, 0.5)),
+      isModel: true,
+    }
+  }
+
+  return {
+    centerOffset: Vector3.Zero(),
+    boundsSize: Vector3.create(s.x, s.y, s.z),
+    isModel: false,
+  }
+}
+
+export function registerEntity(entity: Entity) {
+  if (selectableInfoMap.has(entity)) return
+  if (editorEntities.has(entity)) return
+  if (SKIP_ENTITIES.has(entity)) return
+
+  // Only declared entities (those with a Name) are editable. Dynamic
+  // entities created at runtime via engine.addEntity() are intentionally
+  // skipped — by convention they have no Name component.
+  if (!Name.has(entity)) return
+
+  const n = Name.get(entity).value.toLowerCase()
+  if (SKIP_NAMES.has(n)) return
+
+  const { centerOffset, boundsSize, isModel } = estimateBounds(entity)
+  const name = getEntityName(entity)
+  const colliderShape = isModel ? 'box' : detectMeshType(entity)
+
+  const hadMeshCollider = MeshCollider.has(entity)
+  if (!hadMeshCollider) {
+    MeshCollider.setBox(entity, ColliderLayer.CL_POINTER)
+  }
+
+  let originalVisibleMask: number | undefined
+  let originalInvisibleMask: number | undefined
+  if (GltfContainer.has(entity)) {
+    const gltf = GltfContainer.get(entity)
+    originalVisibleMask = gltf.visibleMeshesCollisionMask
+    originalInvisibleMask = gltf.invisibleMeshesCollisionMask
+  }
+
+  if (!isModel && Material.has(entity)) {
+    try {
+      const mat = Material.get(entity) as any
+      const pbr = mat?.pbr ?? mat?.material?.pbr
+      if (pbr?.albedoColor) {
+        const c = pbr.albedoColor
+        originalMaterials.set(entity, { r: c.r ?? 0, g: c.g ?? 0, b: c.b ?? 0, a: c.a ?? 1 })
+      }
+    } catch {}
+  }
+
+  // Read parent entity from Transform
+  let parentEntity: number | undefined
+  const t = Transform.get(entity)
+  const rawParent = t.parent
+  if (rawParent !== undefined && rawParent !== 0 && rawParent !== (entity as number)) {
+    parentEntity = rawParent as number
+  }
+
+  const info: SelectableInfo = {
+    name,
+    centerOffset,
+    boundsSize,
+    isModel,
+    colliderShape,
+    originalVisibleMask,
+    originalInvisibleMask,
+    src: GltfContainer.has(entity) ? GltfContainer.get(entity).src : undefined,
+    meshType: !isModel ? colliderShape : undefined,
+    parentEntity,
+  }
+
+  selectableInfoMap.set(entity, info)
+
+  const snapshot = PointerEvents.getOrNull(entity)
+  originalPointerEvents.set(entity, snapshot ? structuredClone(snapshot) : null)
+  addEditorHover(entity, name)
+}
+
+export function discoverySystem() {
+  if (!state.editorActive) return
+
+  for (const [entity] of engine.getEntitiesWith(Transform, MeshRenderer)) {
+    registerEntity(entity)
+  }
+  for (const [entity] of engine.getEntitiesWith(Transform, GltfContainer)) {
+    registerEntity(entity)
+  }
+}
+
+/** Polls pointer-down input per selectable entity. Runs only while editor is
+ *  active so scene click handlers behave normally otherwise. */
+export function editorClickSystem() {
+  if (!state.editorActive || state.isDragging || gizmoClickConsumed) return
+  for (const [entity] of selectableInfoMap) {
+    if (inputSystem.isTriggered(InputAction.IA_POINTER, PointerEventType.PET_DOWN, entity)) {
+      selectEntity(entity)
+      return
+    }
+  }
+}
+
+/** Restore each discovered entity's PointerEvents to the snapshot taken at
+ *  registration time. Called on editor-off so the scene's own click handlers
+ *  see their unmodified component again. */
+export function removeAllPointerEvents() {
+  for (const [entity, original] of originalPointerEvents) {
+    if (original === null) {
+      PointerEvents.deleteFrom(entity)
+    } else {
+      PointerEvents.createOrReplace(entity, original)
+    }
+  }
+}
+
+/** Re-add the editor's hover affordance to each registered entity, leaving
+ *  any user-added entries intact. Inverse of removeAllPointerEvents. */
+export function restoreAllPointerEvents() {
+  for (const [entity, info] of selectableInfoMap) {
+    addEditorHover(entity, info.name)
+  }
+}

package/skills/editor-gizmo/src/__editor/drag.ts

@@ -0,0 +1,265 @@
+/** Ray-plane intersection drag system for translate and rotate. */
+
+import {
+  engine,
+  Entity,
+  Transform,
+  inputSystem,
+  InputAction,
+  PointerEventType,
+  PrimaryPointerInfo,
+} from '@dcl/sdk/ecs'
+import { Vector3, Quaternion } from '@dcl/sdk/math'
+import { Axis, MAX_PARENT_DEPTH, state, selectableInfoMap, handleAxisMap, handleDiscMap, handleArrowMap } from './state'
+import { axisToVector, getDragPlaneNormal, rayPlaneIntersect, hitAngleOnPlane, hitAngleOnWorldPlane, copyVec3, copyQuat, getOtherAxes } from './math-utils'
+import { getActiveCameraTransform, lockCamera, unlockCamera } from './camera'
+import { getGizmoCenter, getParentWorldRotation, setArrowMaterial, setRingMaterial } from './gizmo'
+import { sendEntityUpdate } from './persistence'
+import { captureTransform, pushHistory, TransformSnapshot } from './history'
+
+/**
+ * Convert a world-space displacement vector to local space,
+ * accounting for parent rotation and cumulative scale chain.
+ * Returns the local displacement vector to add to local position.
+ */
+function worldToLocalDelta(entity: Entity, worldDelta: Vector3): Vector3 {
+  // Rotate world delta into local space using inverse parent rotation
+  const parentRot = getParentWorldRotation(entity)
+  const invParent = Quaternion.create(-parentRot.x, -parentRot.y, -parentRot.z, parentRot.w)
+  let local = Vector3.rotate(worldDelta, invParent)
+
+  // Walk up parent chain and accumulate scale per axis
+  const info = selectableInfoMap.get(entity)
+  let parentId = info?.parentEntity
+  let depth = 0
+  let sx = 1, sy = 1, sz = 1
+
+  while (parentId && depth < MAX_PARENT_DEPTH) {
+    const pe = parentId as Entity
+    if (!Transform.has(pe)) break
+    const pt = Transform.get(pe)
+    sx *= pt.scale.x; sy *= pt.scale.y; sz *= pt.scale.z
+    const parentInfo = selectableInfoMap.get(pe)
+    parentId = parentInfo?.parentEntity
+    depth++
+  }
+
+  return Vector3.create(
+    sx !== 0 ? local.x / sx : local.x,
+    sy !== 0 ? local.y / sy : local.y,
+    sz !== 0 ? local.z / sz : local.z,
+  )
+}
+
+let dragBeforeSnapshot: TransformSnapshot | undefined
+/** World-space axis direction for single-axis translate drag (parent-rotated). */
+let dragWorldAxis: Vector3 = Vector3.Right()
+/** World-space rotation axis for rotate drag. */
+let dragRotWorldAxis: Vector3 = Vector3.Up()
+/** Parent world rotation at drag start (for converting world rot back to local). */
+let dragParentWorldRot: { x: number; y: number; z: number; w: number } = Quaternion.Identity()
+/** World-space local axes for plane drag (parent-rotated). */
+let dragLocalAxes: { a1: Axis; d1: Vector3; a2: Axis; d2: Vector3 } = {
+  a1: 'x', d1: Vector3.Right(), a2: 'z', d2: Vector3.Forward()
+}
+
+/**
+ * Start a plane-constrained drag. normalAxis is the axis perpendicular to the plane:
+ * - normalAxis 'y' → drag on XZ plane (horizontal movement)
+ * - normalAxis 'z' → drag on XY plane
+ * - normalAxis 'x' → drag on YZ plane
+ */
+export function startPlaneDrag(normalAxis: Axis) {
+  if (state.selectedEntity === undefined || !Transform.has(state.selectedEntity)) return
+
+  dragBeforeSnapshot = captureTransform(state.selectedEntity)
+
+  const entityPos = Transform.get(state.selectedEntity).position
+  const gizmoCenter = getGizmoCenter(state.selectedEntity)
+  const cameraT = getActiveCameraTransform()
+
+  const pointer = PrimaryPointerInfo.getOrNull(engine.RootEntity)
+  if (!pointer || !pointer.worldRayDirection) return
+
+  // World-aligned plane normal (gizmos are world-aligned)
+  const worldNormal = axisToVector(normalAxis)
+
+  const hit = rayPlaneIntersect(cameraT.position, pointer.worldRayDirection, gizmoCenter, worldNormal)
+  if (!hit) return
+
+  // Determine the two world axes that lie in the plane
+  const axes = getOtherAxes(normalAxis)
+  dragLocalAxes = {
+    a1: axes[0], d1: axisToVector(axes[0]),
+    a2: axes[1], d2: axisToVector(axes[1]),
+  }
+
+  state.isDragging = true
+  state.dragPlaneMode = normalAxis
+  state.dragAxis = 'x' // unused, needs a value
+  state.dragStartPos = Vector3.create(entityPos.x, entityPos.y, entityPos.z)
+  state.dragStartWorldPos = Vector3.create(gizmoCenter.x, gizmoCenter.y, gizmoCenter.z)
+  state.dragStartHit = hit
+  state.dragPlaneNormal = Vector3.create(worldNormal.x, worldNormal.y, worldNormal.z)
+
+  lockCamera()
+}
+
+export function startDrag(axis: Axis) {
+  if (state.selectedEntity === undefined || !Transform.has(state.selectedEntity)) return
+
+  // Capture transform before any changes for undo
+  dragBeforeSnapshot = captureTransform(state.selectedEntity)
+
+  const entityPos = Transform.get(state.selectedEntity).position
+  const gizmoCenter = getGizmoCenter(state.selectedEntity)
+  const cameraT = getActiveCameraTransform()
+  const cameraForward = Vector3.rotate(Vector3.Forward(), cameraT.rotation)
+
+  const pointer = PrimaryPointerInfo.getOrNull(engine.RootEntity)
+  if (!pointer || !pointer.worldRayDirection) return
+
+  if (state.gizmoMode === 'translate') {
+    // World-aligned arrows: drag along world axes directly
+    dragWorldAxis = axisToVector(axis)
+
+    const planeNormal = getDragPlaneNormal(axis, cameraForward, dragWorldAxis)
+    // Use world position (gizmoCenter) for plane intersection, but track local pos for delta
+    const hit = rayPlaneIntersect(cameraT.position, pointer.worldRayDirection, gizmoCenter, planeNormal)
+    if (!hit) return
+
+    state.isDragging = true
+    state.dragPlaneMode = undefined
+    state.dragAxis = axis
+    state.dragStartPos = Vector3.create(entityPos.x, entityPos.y, entityPos.z)
+    state.dragStartWorldPos = Vector3.create(gizmoCenter.x, gizmoCenter.y, gizmoCenter.z)
+    state.dragStartHit = hit
+    state.dragPlaneNormal = Vector3.create(planeNormal.x, planeNormal.y, planeNormal.z)
+  } else {
+    const center = getGizmoCenter(state.selectedEntity)
+    // World-aligned rotation: rings always point along world X, Y, Z
+    const parentRot = getParentWorldRotation(state.selectedEntity)
+    const worldAxis = axisToVector(axis)
+
+    const hit = rayPlaneIntersect(cameraT.position, pointer.worldRayDirection, center, worldAxis)
+    if (!hit) return
+
+    dragRotWorldAxis = worldAxis
+    dragParentWorldRot = Quaternion.create(parentRot.x, parentRot.y, parentRot.z, parentRot.w)
+
+    state.isDragging = true
+    state.dragAxis = axis
+    state.dragPlaneNormal = Vector3.create(worldAxis.x, worldAxis.y, worldAxis.z)
+    state.dragRotCenter = Vector3.create(center.x, center.y, center.z)
+    const entRot = Transform.get(state.selectedEntity).rotation
+    state.dragStartRot = Quaternion.create(entRot.x, entRot.y, entRot.z, entRot.w)
+    state.dragStartAngle = hitAngleOnWorldPlane(hit, center, worldAxis)
+  }
+
+  lockCamera()
+}
+
+export function dragSystem(_dt: number) {
+  if (!state.editorActive) return
+  if (!state.isDragging || state.selectedEntity === undefined || !Transform.has(state.selectedEntity))
+    return
+
+  if (inputSystem.isTriggered(InputAction.IA_POINTER, PointerEventType.PET_UP)) { endDrag(); return }
+  if (!inputSystem.isPressed(InputAction.IA_POINTER)) { endDrag(); return }
+
+  const pointer = PrimaryPointerInfo.getOrNull(engine.RootEntity)
+  if (!pointer || !pointer.worldRayDirection) return
+  const cameraT = getActiveCameraTransform()
+
+  if (state.gizmoMode === 'translate') {
+    // Intersect on the world-space plane (using world position, not local)
+    const hit = rayPlaneIntersect(cameraT.position, pointer.worldRayDirection, state.dragStartWorldPos, state.dragPlaneNormal)
+    if (!hit) return
+
+    const worldDelta = Vector3.subtract(hit, state.dragStartHit)
+
+    let constrainedWorld: Vector3
+    if (state.dragPlaneMode !== undefined) {
+      // Plane drag: keep only the 2 world axes that lie in the plane
+      const comp1 = Vector3.dot(worldDelta, dragLocalAxes.d1)
+      const comp2 = Vector3.dot(worldDelta, dragLocalAxes.d2)
+      constrainedWorld = Vector3.add(
+        Vector3.scale(dragLocalAxes.d1, comp1),
+        Vector3.scale(dragLocalAxes.d2, comp2),
+      )
+    } else {
+      // Single axis: project onto world axis, convert to local
+      const worldDisplacement = Vector3.dot(worldDelta, dragWorldAxis)
+      constrainedWorld = Vector3.scale(dragWorldAxis, worldDisplacement)
+    }
+
+    const localDelta = worldToLocalDelta(state.selectedEntity, constrainedWorld)
+    const t = Transform.getMutable(state.selectedEntity)
+    t.position.x = state.dragStartPos.x + localDelta.x
+    t.position.y = state.dragStartPos.y + localDelta.y
+    t.position.z = state.dragStartPos.z + localDelta.z
+  } else {
+    const hit = rayPlaneIntersect(cameraT.position, pointer.worldRayDirection, state.dragRotCenter, state.dragPlaneNormal)
+    if (!hit) return
+
+    const currentAngle = hitAngleOnWorldPlane(hit, state.dragRotCenter, dragRotWorldAxis)
+    const degrees = (currentAngle - state.dragStartAngle) * (180 / Math.PI)
+
+    // Compute incremental rotation in world space, then convert to local
+    const worldIncremental = Quaternion.fromAngleAxis(degrees, dragRotWorldAxis)
+    // localIncremental = inv(parentWorldRot) * worldIncremental * parentWorldRot
+    // For unit quaternions: inverse = conjugate (negate xyz, keep w)
+    const ip = dragParentWorldRot
+    const invParent = Quaternion.create(-ip.x, -ip.y, -ip.z, ip.w)
+    const localIncremental = Quaternion.multiply(
+      Quaternion.multiply(invParent, worldIncremental),
+      dragParentWorldRot
+    )
+    const newRot = Quaternion.multiply(localIncremental, state.dragStartRot)
+
+    const t = Transform.getMutable(state.selectedEntity)
+    copyQuat(t.rotation, newRot)
+  }
+}
+
+function endDrag() {
+  if (!state.isDragging) return
+  state.isDragging = false
+  state.dragPlaneMode = undefined
+  unlockCamera()
+
+  // Restore gizmo visuals
+  if (state.gizmoMode === 'rotate') {
+    for (const [h] of handleDiscMap) {
+      const a = handleAxisMap.get(h)
+      if (a) setRingMaterial(h, a, false)
+    }
+  } else {
+    for (const [h, parts] of handleArrowMap) {
+      const a = handleAxisMap.get(h)
+      if (!a) continue
+      for (const p of parts) setArrowMaterial(p, a, false)
+    }
+  }
+
+  // Send update, push to history, log
+  if (state.selectedEntity !== undefined && Transform.has(state.selectedEntity)) {
+    const afterSnapshot = captureTransform(state.selectedEntity)
+
+    if (dragBeforeSnapshot) {
+      pushHistory(state.selectedEntity, dragBeforeSnapshot, afterSnapshot)
+      dragBeforeSnapshot = undefined
+    }
+
+    sendEntityUpdate(state.selectedEntity)
+
+    const t = Transform.get(state.selectedEntity)
+    if (state.gizmoMode === 'translate') {
+      const label = state.dragPlaneMode !== undefined ? `plane(${state.dragPlaneMode})` : state.dragAxis
+      console.log(`[editor] move ${label}: pos=(${t.position.x.toFixed(2)}, ${t.position.y.toFixed(2)}, ${t.position.z.toFixed(2)})`)
+    } else {
+      const euler = Quaternion.toEulerAngles(t.rotation)
+      console.log(`[editor] rotate ${state.dragAxis}: rot=(${euler.x.toFixed(1)}, ${euler.y.toFixed(1)}, ${euler.z.toFixed(1)})`)
+    }
+  }
+}