WebXRController.js 5.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299
  1. import { Vector3 } from '../../math/Vector3.js';
  2. import { Group } from '../../objects/Group.js';
  3. const _moveEvent = { type: 'move' };
  4. class WebXRController {
  5. constructor() {
  6. this._targetRay = null;
  7. this._grip = null;
  8. this._hand = null;
  9. }
  10. getHandSpace() {
  11. if ( this._hand === null ) {
  12. this._hand = new Group();
  13. this._hand.matrixAutoUpdate = false;
  14. this._hand.visible = false;
  15. this._hand.joints = {};
  16. this._hand.inputState = { pinching: false };
  17. }
  18. return this._hand;
  19. }
  20. getTargetRaySpace() {
  21. if ( this._targetRay === null ) {
  22. this._targetRay = new Group();
  23. this._targetRay.matrixAutoUpdate = false;
  24. this._targetRay.visible = false;
  25. this._targetRay.hasLinearVelocity = false;
  26. this._targetRay.linearVelocity = new Vector3();
  27. this._targetRay.hasAngularVelocity = false;
  28. this._targetRay.angularVelocity = new Vector3();
  29. }
  30. return this._targetRay;
  31. }
  32. getGripSpace() {
  33. if ( this._grip === null ) {
  34. this._grip = new Group();
  35. this._grip.matrixAutoUpdate = false;
  36. this._grip.visible = false;
  37. this._grip.hasLinearVelocity = false;
  38. this._grip.linearVelocity = new Vector3();
  39. this._grip.hasAngularVelocity = false;
  40. this._grip.angularVelocity = new Vector3();
  41. }
  42. return this._grip;
  43. }
  44. dispatchEvent( event ) {
  45. if ( this._targetRay !== null ) {
  46. this._targetRay.dispatchEvent( event );
  47. }
  48. if ( this._grip !== null ) {
  49. this._grip.dispatchEvent( event );
  50. }
  51. if ( this._hand !== null ) {
  52. this._hand.dispatchEvent( event );
  53. }
  54. return this;
  55. }
  56. disconnect( inputSource ) {
  57. this.dispatchEvent( { type: 'disconnected', data: inputSource } );
  58. if ( this._targetRay !== null ) {
  59. this._targetRay.visible = false;
  60. }
  61. if ( this._grip !== null ) {
  62. this._grip.visible = false;
  63. }
  64. if ( this._hand !== null ) {
  65. this._hand.visible = false;
  66. }
  67. return this;
  68. }
  69. update( inputSource, frame, referenceSpace ) {
  70. let inputPose = null;
  71. let gripPose = null;
  72. let handPose = null;
  73. const targetRay = this._targetRay;
  74. const grip = this._grip;
  75. const hand = this._hand;
  76. if ( inputSource && frame.session.visibilityState !== 'visible-blurred' ) {
  77. if ( targetRay !== null ) {
  78. inputPose = frame.getPose( inputSource.targetRaySpace, referenceSpace );
  79. if ( inputPose !== null ) {
  80. targetRay.matrix.fromArray( inputPose.transform.matrix );
  81. targetRay.matrix.decompose( targetRay.position, targetRay.rotation, targetRay.scale );
  82. if ( inputPose.linearVelocity !== null ) {
  83. targetRay.hasLinearVelocity = true;
  84. targetRay.linearVelocity.copy( inputPose.linearVelocity );
  85. } else {
  86. targetRay.hasLinearVelocity = false;
  87. }
  88. if ( inputPose.angularVelocity !== null ) {
  89. targetRay.hasAngularVelocity = true;
  90. targetRay.angularVelocity.copy( inputPose.angularVelocity );
  91. } else {
  92. targetRay.hasAngularVelocity = false;
  93. }
  94. this.dispatchEvent( _moveEvent );
  95. }
  96. }
  97. if ( hand && inputSource.hand ) {
  98. handPose = true;
  99. for ( const inputjoint of inputSource.hand.values() ) {
  100. // Update the joints groups with the XRJoint poses
  101. const jointPose = frame.getJointPose( inputjoint, referenceSpace );
  102. if ( hand.joints[ inputjoint.jointName ] === undefined ) {
  103. // The transform of this joint will be updated with the joint pose on each frame
  104. const joint = new Group();
  105. joint.matrixAutoUpdate = false;
  106. joint.visible = false;
  107. hand.joints[ inputjoint.jointName ] = joint;
  108. // ??
  109. hand.add( joint );
  110. }
  111. const joint = hand.joints[ inputjoint.jointName ];
  112. if ( jointPose !== null ) {
  113. joint.matrix.fromArray( jointPose.transform.matrix );
  114. joint.matrix.decompose( joint.position, joint.rotation, joint.scale );
  115. joint.jointRadius = jointPose.radius;
  116. }
  117. joint.visible = jointPose !== null;
  118. }
  119. // Custom events
  120. // Check pinchz
  121. const indexTip = hand.joints[ 'index-finger-tip' ];
  122. const thumbTip = hand.joints[ 'thumb-tip' ];
  123. const distance = indexTip.position.distanceTo( thumbTip.position );
  124. const distanceToPinch = 0.02;
  125. const threshold = 0.005;
  126. if ( hand.inputState.pinching && distance > distanceToPinch + threshold ) {
  127. hand.inputState.pinching = false;
  128. this.dispatchEvent( {
  129. type: 'pinchend',
  130. handedness: inputSource.handedness,
  131. target: this
  132. } );
  133. } else if ( ! hand.inputState.pinching && distance <= distanceToPinch - threshold ) {
  134. hand.inputState.pinching = true;
  135. this.dispatchEvent( {
  136. type: 'pinchstart',
  137. handedness: inputSource.handedness,
  138. target: this
  139. } );
  140. }
  141. } else {
  142. if ( grip !== null && inputSource.gripSpace ) {
  143. gripPose = frame.getPose( inputSource.gripSpace, referenceSpace );
  144. if ( gripPose !== null ) {
  145. grip.matrix.fromArray( gripPose.transform.matrix );
  146. grip.matrix.decompose( grip.position, grip.rotation, grip.scale );
  147. if ( gripPose.linearVelocity !== null ) {
  148. grip.hasLinearVelocity = true;
  149. grip.linearVelocity.copy( gripPose.linearVelocity );
  150. } else {
  151. grip.hasLinearVelocity = false;
  152. }
  153. if ( gripPose.angularVelocity !== null ) {
  154. grip.hasAngularVelocity = true;
  155. grip.angularVelocity.copy( gripPose.angularVelocity );
  156. } else {
  157. grip.hasAngularVelocity = false;
  158. }
  159. }
  160. }
  161. }
  162. }
  163. if ( targetRay !== null ) {
  164. targetRay.visible = ( inputPose !== null );
  165. }
  166. if ( grip !== null ) {
  167. grip.visible = ( gripPose !== null );
  168. }
  169. if ( hand !== null ) {
  170. hand.visible = ( handPose !== null );
  171. }
  172. return this;
  173. }
  174. }
  175. export { WebXRController };
粤ICP备19079148号