babylon.sixDofDragBehavior.ts 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213
  1. module BABYLON {
  2. /**
  3. * A behavior that when attached to a mesh will allow the mesh to be dragged around based on directions and origin of the pointer's ray
  4. */
  5. export class SixDofDragBehavior implements Behavior<Mesh> {
  6. private static _virtualScene:Scene;
  7. private _ownerNode:Mesh;
  8. private _sceneRenderObserver:Nullable<Observer<Scene>> = null;
  9. private _scene:Scene;
  10. private _targetPosition = new Vector3(0,0,0);
  11. private _virtualOriginMesh:AbstractMesh;
  12. private _virtualDragMesh:AbstractMesh;
  13. private _pointerObserver:Nullable<Observer<PointerInfo>>;
  14. private _moving = false;
  15. private _startingOrientation = new Quaternion();
  16. /**
  17. * How much faster the object should move when the controller is moving towards it. This is useful to bring objects that are far away from the user to them faster. Set this to 0 to avoid any speed increase. (Default: 3)
  18. */
  19. private zDragFactor = 3;
  20. /**
  21. * If the behavior is currently in a dragging state
  22. */
  23. public dragging = false;
  24. /**
  25. * The distance towards the target drag position to move each frame. This can be useful to avoid jitter. Set this to 1 for no delay. (Default: 0.2)
  26. */
  27. public dragDeltaRatio = 0.2;
  28. /**
  29. * The id of the pointer that is currently interacting with the behavior (-1 when no pointer is active)
  30. */
  31. public currentDraggingPointerID = -1;
  32. /**
  33. * If camera controls should be detached during the drag
  34. */
  35. public detatchCameraControls = true;
  36. constructor(){
  37. }
  38. /**
  39. * The name of the behavior
  40. */
  41. public get name(): string {
  42. return "SixDofDrag";
  43. }
  44. /**
  45. * Initializes the behavior
  46. */
  47. public init() {}
  48. /**
  49. * Attaches the scale behavior the passed in mesh
  50. * @param ownerNode The mesh that will be scaled around once attached
  51. */
  52. public attach(ownerNode: Mesh): void {
  53. this._ownerNode = ownerNode;
  54. this._scene = this._ownerNode.getScene();
  55. if(!SixDofDragBehavior._virtualScene){
  56. SixDofDragBehavior._virtualScene = new BABYLON.Scene(this._scene.getEngine());
  57. this._scene.getEngine().scenes.pop();
  58. }
  59. var pickedMesh:Nullable<AbstractMesh> = null;
  60. var lastSixDofOriginPosition = new BABYLON.Vector3(0,0,0);
  61. // Setup virtual meshes to be used for dragging without dirtying the existing scene
  62. this._virtualOriginMesh = new BABYLON.AbstractMesh("", SixDofDragBehavior._virtualScene);
  63. this._virtualOriginMesh.rotationQuaternion = new Quaternion();
  64. this._virtualDragMesh = new BABYLON.AbstractMesh("", SixDofDragBehavior._virtualScene);
  65. this._virtualDragMesh.rotationQuaternion = new Quaternion();
  66. var pickPredicate = (m:AbstractMesh)=>{
  67. return this._ownerNode == m || m.isDescendantOf(this._ownerNode);
  68. }
  69. var attachedElement:Nullable<HTMLElement> = null;
  70. this._pointerObserver = this._scene.onPointerObservable.add((pointerInfo, eventState)=>{
  71. if (pointerInfo.type == BABYLON.PointerEventTypes.POINTERDOWN) {
  72. if(!this.dragging && pointerInfo.pickInfo && pointerInfo.pickInfo.hit && pointerInfo.pickInfo.pickedMesh && pointerInfo.pickInfo.ray && pickPredicate(pointerInfo.pickInfo.pickedMesh)){
  73. if(this._scene.activeCamera && this._scene.activeCamera.cameraRigMode == Camera.RIG_MODE_NONE){
  74. pointerInfo.pickInfo.ray.origin.copyFrom(this._scene.activeCamera!.position)
  75. }
  76. pickedMesh = this._ownerNode;
  77. lastSixDofOriginPosition.copyFrom(pointerInfo.pickInfo.ray.origin);
  78. // Set position and orientation of the controller
  79. this._virtualOriginMesh.position.copyFrom(pointerInfo.pickInfo.ray.origin);
  80. this._virtualOriginMesh.lookAt(pointerInfo.pickInfo.ray.origin.subtract(pointerInfo.pickInfo.ray.direction));
  81. // Attach the virtual drag mesh to the virtual origin mesh so it can be dragged
  82. this._virtualOriginMesh.removeChild(this._virtualDragMesh);
  83. this._virtualDragMesh.position.copyFrom(pickedMesh.absolutePosition);
  84. if(!pickedMesh.rotationQuaternion){
  85. pickedMesh.rotationQuaternion = Quaternion.RotationYawPitchRoll(pickedMesh.rotation.y,pickedMesh.rotation.x,pickedMesh.rotation.z);
  86. }
  87. var oldParent=pickedMesh.parent;
  88. pickedMesh.setParent(null);
  89. this._virtualDragMesh.rotationQuaternion!.copyFrom(pickedMesh.rotationQuaternion);
  90. pickedMesh.setParent(oldParent);
  91. this._virtualOriginMesh.addChild(this._virtualDragMesh);
  92. // Update state
  93. this._targetPosition.copyFrom(this._virtualDragMesh.absolutePosition);
  94. this.dragging = true;
  95. this.currentDraggingPointerID = (<PointerEvent>pointerInfo.event).pointerId;
  96. // Detatch camera controls
  97. if(this.detatchCameraControls && this._scene.activeCamera){
  98. if(this._scene.activeCamera.inputs.attachedElement){
  99. attachedElement = this._scene.activeCamera.inputs.attachedElement;
  100. this._scene.activeCamera.detachControl(this._scene.activeCamera.inputs.attachedElement);
  101. }else{
  102. attachedElement = null;
  103. }
  104. }
  105. }
  106. }else if(pointerInfo.type == BABYLON.PointerEventTypes.POINTERUP){
  107. if(this.currentDraggingPointerID == (<PointerEvent>pointerInfo.event).pointerId){
  108. this.dragging = false;
  109. this._moving = false;
  110. this.currentDraggingPointerID = -1;
  111. pickedMesh = null;
  112. this._virtualOriginMesh.removeChild(this._virtualDragMesh);
  113. // Reattach camera controls
  114. if(this.detatchCameraControls && attachedElement && this._scene.activeCamera){
  115. this._scene.activeCamera.attachControl(attachedElement, true);
  116. }
  117. }
  118. }else if(pointerInfo.type == BABYLON.PointerEventTypes.POINTERMOVE){
  119. if(this.currentDraggingPointerID == (<PointerEvent>pointerInfo.event).pointerId && this.dragging && pointerInfo.pickInfo && pointerInfo.pickInfo.ray && pickedMesh){
  120. var zDragFactor = this.zDragFactor;
  121. if(this._scene.activeCamera && this._scene.activeCamera.cameraRigMode == Camera.RIG_MODE_NONE){
  122. pointerInfo.pickInfo.ray.origin.copyFrom(this._scene.activeCamera!.position)
  123. zDragFactor = 0;
  124. }
  125. // Calculate controller drag distance in controller space
  126. var originDragDifference = pointerInfo.pickInfo.ray.origin.subtract(lastSixDofOriginPosition);
  127. lastSixDofOriginPosition.copyFrom(pointerInfo.pickInfo.ray.origin);
  128. var localOriginDragDifference = -Vector3.Dot(originDragDifference, pointerInfo.pickInfo.ray.direction);
  129. this._virtualOriginMesh.addChild(this._virtualDragMesh);
  130. // Determine how much the controller moved to/away towards the dragged object and use this to move the object further when its further away
  131. this._virtualDragMesh.position.z -= this._virtualDragMesh.position.z < 1 ? localOriginDragDifference*this.zDragFactor : localOriginDragDifference*zDragFactor*this._virtualDragMesh.position.z;
  132. if(this._virtualDragMesh.position.z < 0){
  133. this._virtualDragMesh.position.z = 0;
  134. }
  135. // Update the controller position
  136. this._virtualOriginMesh.position.copyFrom(pointerInfo.pickInfo.ray.origin);
  137. this._virtualOriginMesh.lookAt(pointerInfo.pickInfo.ray.origin.subtract(pointerInfo.pickInfo.ray.direction));
  138. this._virtualOriginMesh.removeChild(this._virtualDragMesh)
  139. // Move the virtualObjectsPosition into the picked mesh's space if needed
  140. this._targetPosition.copyFrom(this._virtualDragMesh.absolutePosition);
  141. if(pickedMesh.parent){
  142. Vector3.TransformCoordinatesToRef(this._targetPosition, Matrix.Invert(pickedMesh.parent.getWorldMatrix()), this._targetPosition);
  143. }
  144. if(!this._moving){
  145. this._startingOrientation.copyFrom(this._virtualDragMesh.rotationQuaternion!)
  146. }
  147. this._moving = true;
  148. }
  149. }
  150. });
  151. var tmpQuaternion = new Quaternion();
  152. // On every frame move towards target scaling to avoid jitter caused by vr controllers
  153. this._sceneRenderObserver = ownerNode.getScene().onBeforeRenderObservable.add(()=>{
  154. if(this.dragging && this._moving && pickedMesh){
  155. // Slowly move mesh to avoid jitter
  156. pickedMesh.position.addInPlace(this._targetPosition.subtract(pickedMesh.position).scale(this.dragDeltaRatio));
  157. // Get change in rotation
  158. tmpQuaternion.copyFrom(this._startingOrientation);
  159. tmpQuaternion.x = -tmpQuaternion.x;
  160. tmpQuaternion.y = -tmpQuaternion.y;
  161. tmpQuaternion.z = -tmpQuaternion.z;
  162. this._virtualDragMesh.rotationQuaternion!.multiplyToRef(tmpQuaternion, tmpQuaternion);
  163. // Convert change in rotation to only y axis rotation
  164. Quaternion.RotationYawPitchRollToRef(tmpQuaternion.toEulerAngles("xyz").y,0,0, tmpQuaternion);
  165. tmpQuaternion.multiplyToRef(this._startingOrientation, tmpQuaternion);
  166. // Slowly move mesh to avoid jitter
  167. var oldParent=pickedMesh.parent;
  168. pickedMesh.setParent(null);
  169. Quaternion.SlerpToRef(pickedMesh.rotationQuaternion!, tmpQuaternion, this.dragDeltaRatio, pickedMesh.rotationQuaternion!);
  170. pickedMesh.setParent(oldParent);
  171. }
  172. });
  173. }
  174. /**
  175. * Detaches the behavior from the mesh
  176. */
  177. public detach(): void {
  178. if(this._scene){
  179. this._scene.onPointerObservable.remove(this._pointerObserver);
  180. }
  181. if(this._ownerNode){
  182. this._ownerNode.getScene().onBeforeRenderObservable.remove(this._sceneRenderObserver);
  183. }
  184. if(this._virtualOriginMesh){
  185. this._virtualOriginMesh.dispose();
  186. }
  187. if(this._virtualDragMesh){
  188. this._virtualDragMesh.dispose();
  189. }
  190. }
  191. }
  192. }