WebVRManager.js 8.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377
  1. /**
  2. * @author mrdoob / http://mrdoob.com/
  3. */
  4. import { Group } from '../../objects/Group.js';
  5. import { Matrix4 } from '../../math/Matrix4.js';
  6. import { Vector3 } from '../../math/Vector3.js';
  7. import { Vector4 } from '../../math/Vector4.js';
  8. import { Quaternion } from '../../math/Quaternion.js';
  9. import { ArrayCamera } from '../../cameras/ArrayCamera.js';
  10. import { PerspectiveCamera } from '../../cameras/PerspectiveCamera.js';
  11. import { WebGLAnimation } from '../webgl/WebGLAnimation.js';
  12. function WebVRManager( renderer ) {
  13. var scope = this;
  14. var device = null;
  15. var frameData = null;
  16. var poseTarget = null;
  17. var controllers = [];
  18. var standingMatrix = new Matrix4();
  19. var standingMatrixInverse = new Matrix4();
  20. if ( typeof window !== 'undefined' && 'VRFrameData' in window ) {
  21. frameData = new window.VRFrameData();
  22. window.addEventListener( 'vrdisplaypresentchange', onVRDisplayPresentChange, false );
  23. }
  24. var matrixWorldInverse = new Matrix4();
  25. var tempQuaternion = new Quaternion();
  26. var tempPosition = new Vector3();
  27. var cameraL = new PerspectiveCamera();
  28. cameraL.bounds = new Vector4( 0.0, 0.0, 0.5, 1.0 );
  29. cameraL.layers.enable( 1 );
  30. var cameraR = new PerspectiveCamera();
  31. cameraR.bounds = new Vector4( 0.5, 0.0, 0.5, 1.0 );
  32. cameraR.layers.enable( 2 );
  33. var cameraVR = new ArrayCamera( [ cameraL, cameraR ] );
  34. cameraVR.layers.enable( 1 );
  35. cameraVR.layers.enable( 2 );
  36. //
  37. function isPresenting() {
  38. return device !== null && device.isPresenting === true;
  39. }
  40. var currentSize, currentPixelRatio;
  41. function onVRDisplayPresentChange() {
  42. if ( isPresenting() ) {
  43. var eyeParameters = device.getEyeParameters( 'left' );
  44. var renderWidth = eyeParameters.renderWidth;
  45. var renderHeight = eyeParameters.renderHeight;
  46. currentPixelRatio = renderer.getPixelRatio();
  47. currentSize = renderer.getSize();
  48. renderer.setDrawingBufferSize( renderWidth * 2, renderHeight, 1 );
  49. animation.start();
  50. } else if ( scope.enabled ) {
  51. renderer.setDrawingBufferSize( currentSize.width, currentSize.height, currentPixelRatio );
  52. animation.stop();
  53. }
  54. }
  55. //
  56. var triggers = [];
  57. function findGamepad( id ) {
  58. var gamepads = navigator.getGamepads && navigator.getGamepads();
  59. for ( var i = 0, j = 0, l = gamepads.length; i < l; i ++ ) {
  60. var gamepad = gamepads[ i ];
  61. if ( gamepad && ( gamepad.id === 'Daydream Controller' ||
  62. gamepad.id === 'Gear VR Controller' || gamepad.id === 'Oculus Go Controller' ||
  63. gamepad.id === 'OpenVR Gamepad' || gamepad.id.startsWith( 'Oculus Touch' ) ||
  64. gamepad.id.startsWith( 'Spatial Controller' ) ) ) {
  65. if ( j === id ) return gamepad;
  66. j ++;
  67. }
  68. }
  69. }
  70. function updateControllers() {
  71. for ( var i = 0; i < controllers.length; i ++ ) {
  72. var controller = controllers[ i ];
  73. var gamepad = findGamepad( i );
  74. if ( gamepad !== undefined && gamepad.pose !== undefined ) {
  75. if ( gamepad.pose === null ) return;
  76. // Pose
  77. var pose = gamepad.pose;
  78. if ( pose.hasPosition === false ) controller.position.set( 0.2, - 0.6, - 0.05 );
  79. if ( pose.position !== null ) controller.position.fromArray( pose.position );
  80. if ( pose.orientation !== null ) controller.quaternion.fromArray( pose.orientation );
  81. controller.matrix.compose( controller.position, controller.quaternion, controller.scale );
  82. controller.matrix.premultiply( standingMatrix );
  83. controller.matrix.decompose( controller.position, controller.quaternion, controller.scale );
  84. controller.matrixWorldNeedsUpdate = true;
  85. controller.visible = true;
  86. // Trigger
  87. var buttonId = gamepad.id === 'Daydream Controller' ? 0 : 1;
  88. if ( triggers[ i ] !== gamepad.buttons[ buttonId ].pressed ) {
  89. triggers[ i ] = gamepad.buttons[ buttonId ].pressed;
  90. if ( triggers[ i ] === true ) {
  91. controller.dispatchEvent( { type: 'selectstart' } );
  92. } else {
  93. controller.dispatchEvent( { type: 'selectend' } );
  94. controller.dispatchEvent( { type: 'select' } );
  95. }
  96. }
  97. } else {
  98. controller.visible = false;
  99. }
  100. }
  101. }
  102. //
  103. this.enabled = false;
  104. this.userHeight = 1.6;
  105. this.getController = function ( id ) {
  106. var controller = controllers[ id ];
  107. if ( controller === undefined ) {
  108. controller = new Group();
  109. controller.matrixAutoUpdate = false;
  110. controller.visible = false;
  111. controllers[ id ] = controller;
  112. }
  113. return controller;
  114. };
  115. this.getDevice = function () {
  116. return device;
  117. };
  118. this.setDevice = function ( value ) {
  119. if ( value !== undefined ) device = value;
  120. animation.setContext( value );
  121. };
  122. this.setPoseTarget = function ( object ) {
  123. if ( object !== undefined ) poseTarget = object;
  124. };
  125. this.getCamera = function ( camera ) {
  126. if ( device === null ) {
  127. camera.position.set( 0, scope.userHeight, 0 );
  128. return camera;
  129. }
  130. device.depthNear = camera.near;
  131. device.depthFar = camera.far;
  132. device.getFrameData( frameData );
  133. //
  134. var stageParameters = device.stageParameters;
  135. if ( stageParameters ) {
  136. standingMatrix.fromArray( stageParameters.sittingToStandingTransform );
  137. } else {
  138. standingMatrix.makeTranslation( 0, scope.userHeight, 0 );
  139. }
  140. var pose = frameData.pose;
  141. var poseObject = poseTarget !== null ? poseTarget : camera;
  142. // We want to manipulate poseObject by its position and quaternion components since users may rely on them.
  143. poseObject.matrix.copy( standingMatrix );
  144. poseObject.matrix.decompose( poseObject.position, poseObject.quaternion, poseObject.scale );
  145. if ( pose.orientation !== null ) {
  146. tempQuaternion.fromArray( pose.orientation );
  147. poseObject.quaternion.multiply( tempQuaternion );
  148. }
  149. if ( pose.position !== null ) {
  150. tempQuaternion.setFromRotationMatrix( standingMatrix );
  151. tempPosition.fromArray( pose.position );
  152. tempPosition.applyQuaternion( tempQuaternion );
  153. poseObject.position.add( tempPosition );
  154. }
  155. poseObject.updateMatrixWorld();
  156. if ( device.isPresenting === false ) return camera;
  157. //
  158. cameraL.near = camera.near;
  159. cameraR.near = camera.near;
  160. cameraL.far = camera.far;
  161. cameraR.far = camera.far;
  162. cameraVR.matrixWorld.copy( camera.matrixWorld );
  163. cameraVR.matrixWorldInverse.copy( camera.matrixWorldInverse );
  164. cameraL.matrixWorldInverse.fromArray( frameData.leftViewMatrix );
  165. cameraR.matrixWorldInverse.fromArray( frameData.rightViewMatrix );
  166. // TODO (mrdoob) Double check this code
  167. standingMatrixInverse.getInverse( standingMatrix );
  168. cameraL.matrixWorldInverse.multiply( standingMatrixInverse );
  169. cameraR.matrixWorldInverse.multiply( standingMatrixInverse );
  170. var parent = poseObject.parent;
  171. if ( parent !== null ) {
  172. matrixWorldInverse.getInverse( parent.matrixWorld );
  173. cameraL.matrixWorldInverse.multiply( matrixWorldInverse );
  174. cameraR.matrixWorldInverse.multiply( matrixWorldInverse );
  175. }
  176. // envMap and Mirror needs camera.matrixWorld
  177. cameraL.matrixWorld.getInverse( cameraL.matrixWorldInverse );
  178. cameraR.matrixWorld.getInverse( cameraR.matrixWorldInverse );
  179. cameraL.projectionMatrix.fromArray( frameData.leftProjectionMatrix );
  180. cameraR.projectionMatrix.fromArray( frameData.rightProjectionMatrix );
  181. // HACK (mrdoob)
  182. // https://github.com/w3c/webvr/issues/203
  183. cameraVR.projectionMatrix.copy( cameraL.projectionMatrix );
  184. //
  185. var layers = device.getLayers();
  186. if ( layers.length ) {
  187. var layer = layers[ 0 ];
  188. if ( layer.leftBounds !== null && layer.leftBounds.length === 4 ) {
  189. cameraL.bounds.fromArray( layer.leftBounds );
  190. }
  191. if ( layer.rightBounds !== null && layer.rightBounds.length === 4 ) {
  192. cameraR.bounds.fromArray( layer.rightBounds );
  193. }
  194. }
  195. updateControllers();
  196. return cameraVR;
  197. };
  198. this.getStandingMatrix = function () {
  199. return standingMatrix;
  200. };
  201. this.isPresenting = isPresenting;
  202. // Animation Loop
  203. var animation = new WebGLAnimation();
  204. this.setAnimationLoop = function ( callback ) {
  205. animation.setAnimationLoop( callback );
  206. };
  207. this.submitFrame = function () {
  208. if ( isPresenting() ) device.submitFrame();
  209. };
  210. this.dispose = function () {
  211. if ( typeof window !== 'undefined' ) {
  212. window.removeEventListener( 'vrdisplaypresentchange', onVRDisplayPresentChange );
  213. }
  214. };
  215. }
  216. export { WebVRManager };