Skip to content

Commit c2adda4

Browse files
cabaniercabanier
committed
Updated to new WebXR Hands API
1 parent a8f0beb commit c2adda4

File tree

4 files changed

+45
-81
lines changed

4 files changed

+45
-81
lines changed

‎examples/jsm/webxr/XRHandPrimitiveModel.js‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -36,13 +36,13 @@ class XRHandPrimitiveModel {
3636
const tipMaterial = new MeshStandardMaterial( { color: 0x999999, roughness: 1, metalness: 0 } );
3737

3838
const tipIndexes = [
39-
window.XRHand.THUMB_PHALANX_TIP,
40-
window.XRHand.INDEX_PHALANX_TIP,
41-
window.XRHand.MIDDLE_PHALANX_TIP,
42-
window.XRHand.RING_PHALANX_TIP,
43-
window.XRHand.LITTLE_PHALANX_TIP
39+
4,
40+
9,
41+
14,
42+
19,
43+
24,
4444
];
45-
for ( let i = 0; i <= window.XRHand.LITTLE_PHALANX_TIP; i ++ ) {
45+
for ( let i = 0; i <= 24; i ++ ) {
4646

4747
var cube = new Mesh( geometry, tipIndexes.indexOf( i ) !== - 1 ? tipMaterial : jointMaterial );
4848
cube.castShadow = true;

‎examples/webxr_vr_handinput_cubes.html‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -160,7 +160,7 @@
160160

161161
if ( grabbing ) {
162162

163-
const indexTip = controller.joints[ XRHand.INDEX_PHALANX_TIP ];
163+
const indexTip = controller.joints[ 9 ];
164164
const sphere = collideObject( indexTip );
165165

166166
if ( sphere ) {
@@ -172,7 +172,7 @@
172172
scaling.active = true;
173173
scaling.object = sphere;
174174
scaling.initialScale = sphere.scale.x;
175-
scaling.initialDistance = indexTip.position.distanceTo( hand2.joints[ XRHand.INDEX_PHALANX_TIP ].position );
175+
scaling.initialDistance = indexTip.position.distanceTo( hand2.joints[ 9 ].position );
176176
return;
177177

178178
}
@@ -190,7 +190,7 @@
190190
const spawn = new THREE.Mesh( geometry, material );
191191
spawn.geometry.computeBoundingSphere();
192192

193-
const indexTip = controller.joints[ XRHand.INDEX_PHALANX_TIP ];
193+
const indexTip = controller.joints[ 9 ];
194194
spawn.position.copy( indexTip.position );
195195
spawn.quaternion.copy( indexTip.quaternion );
196196

@@ -222,7 +222,7 @@
222222
function onPinchStartRight( event ) {
223223

224224
const controller = event.target;
225-
const indexTip = controller.joints[ XRHand.INDEX_PHALANX_TIP ];
225+
const indexTip = controller.joints[ 9 ];
226226
const object = collideObject( indexTip );
227227
if ( object ) {
228228

@@ -266,8 +266,8 @@
266266

267267
if ( scaling.active ) {
268268

269-
const indexTip1Pos = hand1.joints[ XRHand.INDEX_PHALANX_TIP ].position;
270-
const indexTip2Pos = hand2.joints[ XRHand.INDEX_PHALANX_TIP ].position;
269+
const indexTip1Pos = hand1.joints[ 9 ].position;
270+
const indexTip2Pos = hand2.joints[ 9 ].position;
271271
const distance = indexTip1Pos.distanceTo( indexTip2Pos );
272272
const newScale = scaling.initialScale + distance / scaling.initialDistance - 1;
273273
scaling.object.scale.setScalar( newScale );

‎src/renderers/webxr/WebXR.d.ts‎

Lines changed: 0 additions & 33 deletions
Original file line numberDiff line numberDiff line change
@@ -271,40 +271,7 @@ export interface XRJointPose extends XRPose {
271271
}
272272

273273
export declare class XRHand extends Array<XRJointSpace> {
274-
275274
readonly length: number;
276-
277-
static readonly WRIST = 0;
278-
279-
static readonly THUMB_METACARPAL = 1;
280-
static readonly THUMB_PHALANX_PROXIMAL = 2;
281-
static readonly THUMB_PHALANX_DISTAL = 3;
282-
static readonly THUMB_PHALANX_TIP = 4;
283-
284-
static readonly INDEX_METACARPAL = 5;
285-
static readonly INDEX_PHALANX_PROXIMAL = 6;
286-
static readonly INDEX_PHALANX_INTERMEDIATE = 7;
287-
static readonly INDEX_PHALANX_DISTAL = 8;
288-
static readonly INDEX_PHALANX_TIP = 9;
289-
290-
static readonly MIDDLE_METACARPAL = 10;
291-
static readonly MIDDLE_PHALANX_PROXIMAL = 11;
292-
static readonly MIDDLE_PHALANX_INTERMEDIATE = 12;
293-
static readonly MIDDLE_PHALANX_DISTAL = 13;
294-
static readonly MIDDLE_PHALANX_TIP = 14;
295-
296-
static readonly RING_METACARPAL = 15;
297-
static readonly RING_PHALANX_PROXIMAL = 16;
298-
static readonly RING_PHALANX_INTERMEDIATE = 17;
299-
static readonly RING_PHALANX_DISTAL = 18;
300-
static readonly RING_PHALANX_TIP = 19;
301-
302-
static readonly LITTLE_METACARPAL = 20;
303-
static readonly LITTLE_PHALANX_PROXIMAL = 21;
304-
static readonly LITTLE_PHALANX_INTERMEDIATE = 22;
305-
static readonly LITTLE_PHALANX_DISTAL = 23;
306-
static readonly LITTLE_PHALANX_TIP = 24;
307-
308275
}
309276

310277
declare type Constructor<T = object> = {

‎src/renderers/webxr/WebXRController.js‎

Lines changed: 33 additions & 36 deletions
Original file line numberDiff line numberDiff line change
@@ -25,7 +25,7 @@ Object.assign( WebXRController.prototype, {
2525

2626
if ( window.XRHand ) {
2727

28-
for ( let i = 0; i <= window.XRHand.LITTLE_PHALANX_TIP; i ++ ) {
28+
for ( let i = 0; i <= 24; i ++ ) {
2929

3030
// The transform of this joint will be updated with the joint pose on each frame
3131
const joint = new Group();
@@ -138,54 +138,51 @@ Object.assign( WebXRController.prototype, {
138138
if ( hand && inputSource.hand ) {
139139

140140
handPose = true;
141+
let i = 0;
141142

142-
for ( let i = 0; i <= window.XRHand.LITTLE_PHALANX_TIP; i ++ ) {
143+
for ( let inputjoint of inputSource.hand.values() ) {
143144

144-
if ( inputSource.hand[ i ] ) {
145+
// Update the joints groups with the XRJoint poses
146+
const jointPose = frame.getJointPose( inputjoint, referenceSpace );
147+
const joint = hand.joints[ i++ ];
145148

146-
// Update the joints groups with the XRJoint poses
147-
const jointPose = frame.getJointPose( inputSource.hand[ i ], referenceSpace );
148-
const joint = hand.joints[ i ];
149+
if ( jointPose !== null ) {
149150

150-
if ( jointPose !== null ) {
151+
joint.matrix.fromArray( jointPose.transform.matrix );
152+
joint.matrix.decompose( joint.position, joint.rotation, joint.scale );
153+
joint.jointRadius = jointPose.radius;
151154

152-
joint.matrix.fromArray( jointPose.transform.matrix );
153-
joint.matrix.decompose( joint.position, joint.rotation, joint.scale );
154-
joint.jointRadius = jointPose.radius;
155-
156-
}
157-
158-
joint.visible = jointPose !== null;
155+
}
159156

160-
// Custom events
157+
joint.visible = jointPose !== null;
161158

162-
// Check pinch
163-
const indexTip = hand.joints[ window.XRHand.INDEX_PHALANX_TIP ];
164-
const thumbTip = hand.joints[ window.XRHand.THUMB_PHALANX_TIP ];
165-
const distance = indexTip.position.distanceTo( thumbTip.position );
159+
// Custom events
166160

167-
const distanceToPinch = 0.02;
168-
const threshold = 0.005;
161+
// Check pinchz
162+
const indexTip = hand.joints[ 9 ];
163+
const thumbTip = hand.joints[ 4 ];
164+
const distance = indexTip.position.distanceTo( thumbTip.position );
169165

170-
if ( hand.inputState.pinching && distance > distanceToPinch + threshold ) {
166+
const distanceToPinch = 0.02;
167+
const threshold = 0.005;
171168

172-
hand.inputState.pinching = false;
173-
this.dispatchEvent( {
174-
type: "pinchend",
175-
handedness: inputSource.handedness,
176-
target: this
177-
} );
169+
if ( hand.inputState.pinching && distance > distanceToPinch + threshold ) {
178170

179-
} else if ( ! hand.inputState.pinching && distance <= distanceToPinch - threshold ) {
171+
hand.inputState.pinching = false;
172+
this.dispatchEvent( {
173+
type: "pinchend",
174+
handedness: inputSource.handedness,
175+
target: this
176+
} );
180177

181-
hand.inputState.pinching = true;
182-
this.dispatchEvent( {
183-
type: "pinchstart",
184-
handedness: inputSource.handedness,
185-
target: this
186-
} );
178+
} else if ( ! hand.inputState.pinching && distance <= distanceToPinch - threshold ) {
187179

188-
}
180+
hand.inputState.pinching = true;
181+
this.dispatchEvent( {
182+
type: "pinchstart",
183+
handedness: inputSource.handedness,
184+
target: this
185+
} );
189186

190187
}
191188

0 commit comments

Comments
 (0)