yvan-rcs-web/src/core/controls/EsDragControl2.ts

import * as THREE from 'three'
import type Viewport from '@/core/engine/Viewport.ts'
import type IControls from '@/core/controls/IControls.ts'
import { Curve } from 'three'
import { getClosestObject } from '@/core/ModelUtils.ts'
import EventBus from '@/runtime/EventBus.ts'

/**
 * DragControl2 - ThreeJS 拖拽管理器（仅限 X/Z 平面）
 */
export default class DragControl2 implements IControls {
  private viewport: Viewport
  private _is_enabled: boolean = true
  private domElement: HTMLElement
  public isDragging: boolean = false
  private isPointerDown: boolean = false
  private dragStartMouse: THREE.Vector2 = new THREE.Vector2()

  private dragShadows: THREE.Group | null = null

  init(viewport: Viewport): void {
    this.viewport = viewport

    const domElement = this.viewport.renderer.domElement
    domElement.addEventListener('pointermove', this.onPointerMove)
    domElement.addEventListener('pointerdown', this.onPointerDown)
    domElement.addEventListener('pointerup', this.onPointerUp)
    domElement.addEventListener('pointerleave', this.onPointerLeave)

    domElement.style.cursor = 'auto'
    this.domElement = domElement
  }


  /**
   * 设置启用/禁用
   */
  public set enabled(value: boolean) {
    this._is_enabled = value
    if (!value) {
      this.cleanupDrag()
    }
  }

  public get enabled(): boolean {
    return this._is_enabled
  }

  /**
   * 卸载资源
   */
  dispose(): void {
    if (this.domElement) {
      this.domElement.removeEventListener('pointermove', this.onPointerMove)
      this.domElement.removeEventListener('pointerdown', this.onPointerDown)
      this.domElement.removeEventListener('pointerup', this.onPointerUp)
      this.domElement.removeEventListener('pointerleave', this.onPointerLeave)

      this.cleanupDrag()
      this.domElement.style.cursor = 'auto'
      this.viewport = null
    }
  }

  /**
   * 清理拖拽状态
   */
  private cleanupDrag(): void {
    this.viewport.renderer.domElement.style.cursor = 'auto'
    this.isDragging = false
    this.isPointerDown = false
    this.dragStartMouse.set(NaN, NaN)
    this.removeShadows()
  }

  /**
   * 获取当前鼠标坐标（归一化设备坐标）
   */
  private getMousePosition(clientX: number, clientY: number): THREE.Vector2 {
    const rect = this.viewport.renderer.domElement.getBoundingClientRect()
    return new THREE.Vector2(
      ((clientX - rect.left) / rect.width) * 2 - 1,
      ((clientY - rect.top) / rect.height) * -2 + 1
    )
  }

  /**
   * 射线检测，返回第一个可拖拽对象
   */
  private getIntersectedDraggableObject(mouse: THREE.Vector2): THREE.Object3D | null {
    const raycaster = new THREE.Raycaster()
    raycaster.setFromCamera(mouse, this.viewport.camera)

    const draggableObjects = this.viewport.entityManager._draggableObjects || []
    const intersects = raycaster.intersectObjects(draggableObjects, true)

    if (intersects.length > 0) {
      return getClosestObject(intersects[0].object)
    }
  }

  /**
   * 创建拖拽阴影
   */
  private createShadows(objects: THREE.Object3D[]): void {
    this.removeShadows()

    console.log('createShadows', objects.map(obj => obj.name))

    this.dragShadows = new THREE.Group()
    for (const obj of objects) {
      if (!obj.userData.entityId) {
        console.error('Object does not have entityId:', obj.name)
        continue // 跳过没有 entityId 的对象
      }

      const shadow = obj.clone()

      shadow.userData = {
        isShadow: true,
        entityId: obj.userData.entityId,
        originPosition: obj.position.clone() // 保存原始位置
      }
      this.dragShadows.add(shadow)
    }
    this.viewport.scene.add(this.dragShadows)
  }

  /**
   * 移除阴影
   */
  private removeShadows(): void {
    if (this.dragShadows) {
      this.viewport.scene.remove(this.dragShadows)
      this.dragShadows = null
    }
  }

  /**
   * 更新阴影位置（仅 X/Z 平面）
   */
  private updateShadows(newPosition: THREE.Vector2): void {
    if (!this.dragShadows) return

    // 计算新位置与拖拽开始位置的偏移量
    const offsetX = newPosition.x - this.dragStartMouse.x
    const offsetZ = newPosition.y - this.dragStartMouse.y

    this.dragShadows.children.forEach((shadow, index) => {
      const newPosX = shadow.userData.originPosition.x + offsetX
      const newPosZ = shadow.userData.originPosition.z + offsetZ

      shadow.position.set(newPosX, shadow.userData.originPosition.y, newPosZ) // 锁定 Y 轴高度
      console.log(`Updated shadow position for ${shadow.name}:`, shadow.position)
    })
  }

  private dragComplete = (startPos: THREE.Vector2, targetPos: THREE.Vector2): void => {
    // console.log(`Drag completed from ${startPos.toArray()} to ${targetPos.toArray()}`)
    this.viewport.stateManager.beginStateUpdate()
    for (const object of this.dragShadows.children) {
      const entityId = object.userData.entityId
      if (entityId) {
        const entity = this.viewport.stateManager.findItemById(entityId)
        if (entity) {
          // 更新实体位置
          entity.tf[0][0] = object.position.x
          entity.tf[0][2] = object.position.z

        } else {
          system.showErrorDialog('not found entityId:' + entityId)
        }
      } else {
        system.showErrorDialog('not found entity')
      }
    }
    this.viewport.stateManager.endStateUpdate()
    EventBus.dispatch('multiselectedObjectChanged', {
      multiSelectedObjects: this.viewport.state.multiSelectedObjects
    })
    EventBus.dispatch('selectedObjectPropertyChanged', {})

    this.cleanupDrag()
  }

  /**
   * pointermove 事件处理
   */
  private onPointerMove = (event: PointerEvent): void => {
    if (!this.enabled) return

    if (!isNaN(this.dragStartMouse.x) && !isNaN(this.dragStartMouse.y) && this.dragShadows) {
      this.isDragging = true
      // 更新鼠标样式
      this.viewport.renderer.domElement.style.cursor = 'grabbing'

      // 更新阴影位置（锁定 Y 轴）
      this.updateShadows(new THREE.Vector2(CurrentMouseInfo.x, CurrentMouseInfo.z))

    } else {

      const mouse = this.getMousePosition(event.clientX, event.clientY)
      const intersected = this.getIntersectedDraggableObject(mouse)
      if (intersected) {
        this.viewport.renderer.domElement.style.cursor = 'grab'
      } else {
        this.viewport.renderer.domElement.style.cursor = 'auto'
      }
    }
  }

  /**
   * pointerdown 事件处理
   */
  private onPointerDown = (event: PointerEvent): void => {
    if (!this.enabled) return

    const mouse = this.getMousePosition(event.clientX, event.clientY)
    const intersected = this.getIntersectedDraggableObject(mouse)

    if (!intersected) return

    this.isPointerDown = true
    this.dragStartMouse.set(intersected.position.x, intersected.position.z)
    this.viewport.controls.enabled = false

    let selectedObjects = [intersected]
    if (this.viewport.state.multiSelectedObjects.length > 0) {
      if (this.viewport.state.multiSelectedObjects.includes(intersected)) {
        // drag multi-selected objects
        selectedObjects = this.viewport.state.multiSelectedObjects
      }
    }

    this.createShadows(selectedObjects)
  }


  /**
   * pointerup 事件处理
   */
  private onPointerUp = (event: PointerEvent): void => {
    if (!this.enabled) return

    this.dragStartMouse.set(NaN, NaN)
    this.isPointerDown = false
    // console.log('enable controls')
    this.viewport.controls.enabled = true

    if (this.isDragging) {
      const startPos = this.dragStartMouse
      const targetPos = new THREE.Vector2(CurrentMouseInfo.x, CurrentMouseInfo.z)

      if (startPos && targetPos) {
        this.dragComplete(startPos, targetPos)
      }
    }
  }

  /**
   * pointerleave 事件处理
   */
  private onPointerLeave = (_event: PointerEvent): void => {
    if (!this.enabled) return
    this.cleanupDrag()
  }

  /**
   * 取消当前拖拽状态
   */
  cancelDrag(): void {
    if (this.isDragging || this.isPointerDown) {
      this.cleanupDrag()
      this.viewport.renderer.domElement.style.cursor = 'auto'
      this.viewport.controls.enabled = true
    }
  }
}