Expose the grip space for XR controllers

src/renderers/webxr/WebXRManager.d.ts

@@ -7,6 +7,7 @@ export class WebXRManager {
 
 	enabled: boolean;
 	getController( id: number ): Group;
+	getControllerGrip( id: number ): Group;
 	setFramebufferScaleFactor( value: number ): void;
 	setReferenceSpaceType( value: string ): void;
 	getSession(): any;

src/renderers/webxr/WebXRManager.js

@@ -52,15 +52,43 @@ function WebXRManager( renderer, gl ) {
 
 		if ( controller === undefined ) {
 
-			controller = new Group();
-			controller.matrixAutoUpdate = false;
-			controller.visible = false;
+			controller = {};
+			controllers[ id ] = controller;
+
+		}
+
+		if ( controller.targetRay === undefined ) {
+
+			controller.targetRay = new Group();
+			controller.targetRay.matrixAutoUpdate = false;
+			controller.targetRay.visible = false;
+
+		}
+
+		return controller.targetRay;
 
+	};
+
+	this.getControllerGrip = function ( id ) {
+
+		var controller = controllers[ id ];
+
+		if ( controller === undefined ) {
+
+			controller = {};
 			controllers[ id ] = controller;
 
 		}
 
-		return controller;
+		if ( controller.grip === undefined ) {
+
+			controller.grip = new Group();
+			controller.grip.matrixAutoUpdate = false;
+			controller.grip.visible = false;
+
+		}
+
+		return controller.grip;
 
 	};
 
@@ -72,7 +100,17 @@ function WebXRManager( renderer, gl ) {
 
 		if ( controller ) {
 
-			controller.dispatchEvent( { type: event.type } );
+			if ( controller.targetRay ) {
+
+				controller.targetRay.dispatchEvent( { type: event.type } );
+
+			}
+
+			if ( controller.grip ) {
+
+				controller.grip.dispatchEvent( { type: event.type } );
+
+			}
 
 		}
 
@@ -82,8 +120,19 @@ function WebXRManager( renderer, gl ) {
 
 		inputSourcesMap.forEach( function ( controller, inputSource ) {
 
-			controller.dispatchEvent( { type: 'disconnected', data: inputSource } );
-			controller.visible = false;
+			if ( controller.targetRay ) {
+
+				controller.targetRay.dispatchEvent( { type: 'disconnected', data: inputSource } );
+				controller.targetRay.visible = false;
+
+			}
+
+			if ( controller.grip ) {
+
+				controller.grip.dispatchEvent( { type: 'disconnected', data: inputSource } );
+				controller.grip.visible = false;
+
+			}
 
 		} );
 
@@ -197,7 +246,18 @@ function WebXRManager( renderer, gl ) {
 
 			if ( controller ) {
 
-				controller.dispatchEvent( { type: 'disconnected', data: inputSource } );
+				if ( controller.targetRay ) {
+
+					controller.targetRay.dispatchEvent( { type: 'disconnected', data: inputSource } );
+
+				}
+	
+				if ( controller.grip ) {
+
+					controller.grip.dispatchEvent( { type: 'disconnected', data: inputSource } );
+
+				}
+
 				inputSourcesMap.delete( inputSource );
 
 			}
@@ -213,7 +273,17 @@ function WebXRManager( renderer, gl ) {
 
 			if ( controller ) {
 
-				controller.dispatchEvent( { type: 'connected', data: inputSource } );
+				if ( controller.targetRay ) {
+
+					controller.targetRay.dispatchEvent( { type: 'connected', data: inputSource } );
+
+				}
+	
+				if ( controller.grip ) {
+
+					controller.grip.dispatchEvent( { type: 'connected', data: inputSource } );
+
+				}
 
 			}
 
@@ -375,23 +445,50 @@ function WebXRManager( renderer, gl ) {
 
 			var inputSource = inputSources[ i ];
 
+			var inputPose = null;
+			var gripPose = null;
+
 			if ( inputSource ) {
 
-				var inputPose = frame.getPose( inputSource.targetRaySpace, referenceSpace );
+				if ( controller.targetRay ) {
 
-				if ( inputPose !== null ) {
+					inputPose = frame.getPose( inputSource.targetRaySpace, referenceSpace );
 
-					controller.matrix.fromArray( inputPose.transform.matrix );
-					controller.matrix.decompose( controller.position, controller.rotation, controller.scale );
-					controller.visible = true;
+					if ( inputPose !== null ) {
 
-					continue;
+						controller.targetRay.matrix.fromArray( inputPose.transform.matrix );
+						controller.targetRay.matrix.decompose( controller.targetRay.position, controller.targetRay.rotation, controller.targetRay.scale );
+
+					}
+
+				}
+
+				if ( inputSource.gripSpace && controller.grip ) {
+
+					gripPose = frame.getPose( inputSource.gripSpace, referenceSpace );
+
+					if ( gripPose !== null ) {
+
+						controller.grip.matrix.fromArray( gripPose.transform.matrix );
+						controller.grip.matrix.decompose( controller.grip.position, controller.grip.rotation, controller.grip.scale );
+
+					}
 
 				}
 
 			}
 
-			controller.visible = false;
+			if ( controller.targetRay ) {
+
+				controller.targetRay.visible = inputPose !== null;
+
+			}
+
+			if ( controller.grip ) {
+
+				controller.grip.visible = gripPose !== null;
+
+			}
 
 		}