1 line
13 KiB
Plaintext
1 line
13 KiB
Plaintext
|
{"version":3,"file":"DragControls.cjs","sources":["../../src/controls/DragControls.ts"],"sourcesContent":["import { Camera, Intersection, Matrix4, Object3D, Plane, Raycaster, Vector2, Vector3 } from 'three'\nimport { EventDispatcher } from './EventDispatcher'\n\nexport interface DragControlsEventMap {\n /**\n * Fires when the pointer is moved onto a 3D object, or onto one of its children.\n */\n hoveron: { object: Object3D };\n\n /**\n * Fires when the pointer is moved out of a 3D object.\n */\n hoveroff: { object: Object3D };\n\n /**\n * Fires when the user starts to drag a 3D object.\n */\n dragstart: { object: Object3D };\n\n /**\n * Fires when the user drags a 3D object.\n */\n drag: { object: Object3D };\n\n /**\n * Fires when the user has finished dragging a 3D object.\n */\n dragend: { object: Object3D };\n}\n\nclass DragControls extends EventDispatcher<DragControlsEventMap> {\n public enabled = true\n public transformGroup = false\n\n private _objects: Object3D[]\n private _camera: Camera\n private _domElement: HTMLElement\n\n private _plane = new Plane()\n private _raycaster = new Raycaster()\n\n private _mouse = new Vector2()\n private _offset = new Vector3()\n private _intersection = new Vector3()\n private _worldPosition = new Vector3()\n private _inverseMatrix = new Matrix4()\n private _intersections: Intersection[] = []\n private _selected: Object3D | null = null\n private _hovered: Object3D | null = null\n\n constructor(_objects: Object3D[], _camera: Camera, _domElement: HTMLElement) {\n super()\n\n this._objects = _objects\n this._camera = _camera\n this._domElement = _domElement\n\n this.activate()\n }\n\n public activate = (): void => {\n this._domElement.addEventListener('pointermove', this.onPointerMove)\n this._domElement.addEventListener('pointerdown', this.onPointerDown)\n this._domElement.addEventListener('pointerup', this.onPointerCancel)\n this._domElement.addEventListener('pointerleave', this.onPointerCancel)\n this._domElement.addEventListener('touchmove', this.onTouchMove)\n this._domElement.addEventListener('touchstart', this.onTouchStart)\n this._domElement.addEventListener('touchend', this.onTouchEnd)\n }\n\n public deactivate = (): void => {\n this._domElement.removeEventListener('pointermove', this.onPointerMove)\n this._domElement.removeEventListener('pointerdown', this.onPointerDown)\n this._domElement.removeEventListener('pointerup', this.onPointerCancel)\n this._domElement.removeEventListener('pointerleave', this.onPointerCancel)\n this._domElement.removeEventListener('touchmove', this.onTouchMove)\n this._domElement.removeEventListener('touchstart', this.onTouchStart)\n this._domElement.removeEventListener('touchend', this.onTouchEnd)\n\n this._domElement.style.cursor = ''\n }\n\n // TODO: confirm if this can be removed?\n public dispose = (): void => this.deactivate()\n\n public getObjects = (): Object3D[] => this._objects\n\n public getRaycaster = (): Raycaster => this._raycaster\n\n private onMouseMove = (event: MouseEvent): void => {\n const rect = this._domElement.getBoundingClientRect()\n\n this._mouse.x = ((event.clientX - rect.left) / rect.width) * 2 - 1\n this._mouse.y = -((event.clientY - rect.top) / rect.height) * 2 + 1\n\n this._raycaster.setFromCamera(this._mouse, this._camera)\n\n if (this._selected && this.enabled) {\n if (this._raycaster.ray.intersectPlane(this._plane, this._intersection)) {\n this._selected.position.copy(this._intersection.sub(this._offset).applyMatrix4(this._inverseMatrix))\n }\n\n // @ts-ignore\n this.dispatchEvent({ type: 'drag', object: this._selected })\n\n return\n }\n\n this._intersections.length = 0\n\n this._raycaster.setFromCamera(this._mouse, this._camera)\n this._raycaster.intersectObjects(this._objects, true, this._intersections)\n\n if (this._intersections.length > 0) {\n const object = this._intersections[0].object\n\n this._plane.setFromNormalAndCo
|