three-stdlib 2.8.2 → 2.8.6
Sign up to get free protection for your applications and to get access to all the features.
- package/{BufferGeometryUtils-582025b8.js → BufferGeometryUtils-1a7a235c.js} +2 -1
- package/{BufferGeometryUtils-9eb5c2e7.js → BufferGeometryUtils-971dfde3.js} +0 -0
- package/animation/MMDAnimationHelper.d.ts +17 -17
- package/animation/MMDPhysics.d.ts +3 -3
- package/csm/CSM.d.ts +47 -22
- package/csm/CSMHelper.d.ts +20 -7
- package/effects/OutlineEffect.d.ts +4 -4
- package/effects/OutlineEffect.js +8 -2
- package/exporters/GLTFExporter.js +5 -10
- package/geometries/ConvexGeometry.d.ts +1 -1
- package/geometries/ParametricGeometries.d.ts +4 -2
- package/helpers/RectAreaLightHelper.d.ts +3 -3
- package/index.cjs.js +1 -1
- package/index.d.ts +9 -4
- package/index.js +9 -4
- package/libs/MotionControllers.cjs.js +1 -0
- package/libs/MotionControllers.js +403 -0
- package/loaders/AssimpLoader.js +39 -10
- package/loaders/ColladaLoader.js +22 -5
- package/loaders/EXRLoader.js +5 -1
- package/loaders/FBXLoader.js +10 -2
- package/loaders/GLTFLoader.cjs.js +1 -1
- package/loaders/GLTFLoader.d.ts +44 -20
- package/loaders/GLTFLoader.js +0 -1
- package/loaders/LDrawLoader.d.ts +6 -0
- package/loaders/MTLLoader.d.ts +18 -18
- package/loaders/RGBMLoader.d.ts +10 -10
- package/loaders/RGBMLoader.js +253 -178
- package/loaders/SVGLoader.d.ts +5 -3
- package/loaders/SVGLoader.js +10 -5
- package/loaders/lwo/IFFParser.js +4 -1
- package/math/OBB.d.ts +1 -1
- package/misc/GPUComputationRenderer.d.ts +8 -6
- package/misc/MD2CharacterComplex.js +9 -2
- package/misc/Volume.d.ts +2 -0
- package/modifiers/CurveModifier.cjs.js +1 -1
- package/modifiers/CurveModifier.js +1 -1
- package/modifiers/EdgeSplitModifier.cjs.js +1 -1
- package/modifiers/SimplifyModifier.cjs.js +1 -1
- package/nodes/inputs/ColorNode.d.ts +2 -2
- package/nodes/inputs/TextureNode.d.ts +3 -2
- package/nodes/materials/StandardNodeMaterial.d.ts +1 -1
- package/nodes/materials/nodes/StandardNode.d.ts +1 -0
- package/nodes/utils/ColorSpaceNode.d.ts +1 -1
- package/nodes/utils/JoinNode.d.ts +1 -0
- package/objects/MarchingCubes.d.ts +12 -4
- package/objects/Reflector.d.ts +4 -2
- package/objects/ReflectorForSSRPass.d.ts +6 -6
- package/objects/Refractor.d.ts +4 -2
- package/objects/Water.d.ts +4 -3
- package/objects/Water2.d.ts +12 -3
- package/package.json +2 -3
- package/postprocessing/ClearPass.d.ts +3 -3
- package/postprocessing/SAOPass.d.ts +3 -2
- package/postprocessing/SSAARenderPass.d.ts +3 -3
- package/postprocessing/SSAOPass.d.ts +3 -2
- package/postprocessing/SSRPass.d.ts +14 -17
- package/postprocessing/TAARenderPass.d.ts +2 -2
- package/renderers/CSS2DRenderer.d.ts +5 -1
- package/renderers/CSS3DRenderer.d.ts +5 -1
- package/renderers/webgpu/WebGPUTextures.js +62 -41
- package/shaders/SSRShader.d.ts +1 -2
- package/utils/BufferGeometryUtils.cjs.js +1 -1
- package/utils/BufferGeometryUtils.js +2 -1
- package/utils/LDrawUtils.cjs.js +1 -1
- package/utils/LDrawUtils.d.ts +5 -0
- package/utils/LDrawUtils.js +1 -1
- package/utils/RoughnessMipmapper.js +5 -1
- package/utils/SceneUtils.d.ts +10 -12
- package/utils/ShadowMapViewer.js +4 -1
- package/webxr/OculusHandModel.cjs.js +1 -0
- package/webxr/OculusHandModel.d.ts +19 -0
- package/webxr/OculusHandModel.js +72 -0
- package/webxr/OculusHandPointerModel.cjs.js +1 -0
- package/webxr/OculusHandPointerModel.d.ts +63 -0
- package/webxr/OculusHandPointerModel.js +248 -0
- package/webxr/Text2D.cjs.js +1 -0
- package/webxr/Text2D.d.ts +3 -0
- package/webxr/Text2D.js +32 -0
- package/webxr/VRButton.cjs.js +1 -1
- package/webxr/VRButton.js +17 -1
- package/webxr/XRControllerModelFactory.cjs.js +1 -1
- package/webxr/XRControllerModelFactory.js +65 -66
- package/webxr/XREstimatedLight.cjs.js +1 -1
- package/webxr/XREstimatedLight.js +1 -0
- package/webxr/XRHandMeshModel.cjs.js +1 -0
- package/webxr/XRHandMeshModel.d.ts +11 -0
- package/webxr/XRHandMeshModel.js +55 -0
- package/webxr/XRHandModelFactory.cjs.js +1 -1
- package/webxr/XRHandModelFactory.d.ts +3 -3
- package/webxr/XRHandModelFactory.js +47 -50
- package/webxr/XRHandPrimitiveModel.cjs.js +1 -1
- package/webxr/XRHandPrimitiveModel.d.ts +1 -1
- package/webxr/XRHandPrimitiveModel.js +31 -41
- package/csm/Frustum.d.ts +0 -16
- package/csm/Shader.d.ts +0 -6
- package/loaders/XLoader.d.ts +0 -19
- package/shaders/FresnelShader.d.ts +0 -13
- package/shaders/ParallaxShader.d.ts +0 -20
- package/utils/RoughnessMipmapper.d.ts +0 -7
- package/webxr/XRHandOculusMeshModel.cjs.js +0 -1
- package/webxr/XRHandOculusMeshModel.d.ts +0 -23
- package/webxr/XRHandOculusMeshModel.js +0 -89
@@ -365,47 +365,68 @@ class WebGPUTextures {
|
|
365
365
|
|
366
366
|
_getBlockData(format) {
|
367
367
|
// this method is only relevant for compressed texture formats
|
368
|
-
if (format === GPUTextureFormat.BC1RGBAUnorm || format === GPUTextureFormat.BC1RGBAUnormSRGB)
|
369
|
-
|
370
|
-
|
371
|
-
|
372
|
-
|
373
|
-
|
374
|
-
|
375
|
-
|
376
|
-
|
377
|
-
|
378
|
-
|
379
|
-
|
380
|
-
|
381
|
-
|
382
|
-
|
383
|
-
|
384
|
-
|
385
|
-
|
386
|
-
if (format === GPUTextureFormat.
|
387
|
-
|
388
|
-
|
389
|
-
|
390
|
-
|
391
|
-
|
392
|
-
|
393
|
-
|
394
|
-
|
395
|
-
|
396
|
-
|
397
|
-
|
398
|
-
|
399
|
-
|
400
|
-
|
401
|
-
|
402
|
-
|
403
|
-
|
404
|
-
if (format === GPUTextureFormat.
|
405
|
-
|
406
|
-
|
407
|
-
|
408
|
-
|
368
|
+
if (format === GPUTextureFormat.BC1RGBAUnorm || format === GPUTextureFormat.BC1RGBAUnormSRGB) {
|
369
|
+
return {
|
370
|
+
byteLength: 8,
|
371
|
+
width: 4,
|
372
|
+
height: 4
|
373
|
+
};
|
374
|
+
} // DXT1
|
375
|
+
|
376
|
+
|
377
|
+
if (format === GPUTextureFormat.BC2RGBAUnorm || format === GPUTextureFormat.BC2RGBAUnormSRGB) {
|
378
|
+
return {
|
379
|
+
byteLength: 16,
|
380
|
+
width: 4,
|
381
|
+
height: 4
|
382
|
+
};
|
383
|
+
} // DXT3
|
384
|
+
|
385
|
+
|
386
|
+
if (format === GPUTextureFormat.BC3RGBAUnorm || format === GPUTextureFormat.BC3RGBAUnormSRGB) {
|
387
|
+
return {
|
388
|
+
byteLength: 16,
|
389
|
+
width: 4,
|
390
|
+
height: 4
|
391
|
+
};
|
392
|
+
} // DXT5
|
393
|
+
|
394
|
+
|
395
|
+
if (format === GPUTextureFormat.BC4RUnorm || format === GPUTextureFormat.BC4RSNorm) {
|
396
|
+
return {
|
397
|
+
byteLength: 8,
|
398
|
+
width: 4,
|
399
|
+
height: 4
|
400
|
+
};
|
401
|
+
} // RGTC1
|
402
|
+
|
403
|
+
|
404
|
+
if (format === GPUTextureFormat.BC5RGUnorm || format === GPUTextureFormat.BC5RGSnorm) {
|
405
|
+
return {
|
406
|
+
byteLength: 16,
|
407
|
+
width: 4,
|
408
|
+
height: 4
|
409
|
+
};
|
410
|
+
} // RGTC2
|
411
|
+
|
412
|
+
|
413
|
+
if (format === GPUTextureFormat.BC6HRGBUFloat || format === GPUTextureFormat.BC6HRGBFloat) {
|
414
|
+
return {
|
415
|
+
byteLength: 16,
|
416
|
+
width: 4,
|
417
|
+
height: 4
|
418
|
+
};
|
419
|
+
} // BPTC (float)
|
420
|
+
|
421
|
+
|
422
|
+
if (format === GPUTextureFormat.BC7RGBAUnorm || format === GPUTextureFormat.BC7RGBAUnormSRGB) {
|
423
|
+
return {
|
424
|
+
byteLength: 16,
|
425
|
+
width: 4,
|
426
|
+
height: 4
|
427
|
+
};
|
428
|
+
} // BPTC (unorm)
|
429
|
+
|
409
430
|
}
|
410
431
|
|
411
432
|
_getBytesPerTexel(format) {
|
package/shaders/SSRShader.d.ts
CHANGED
@@ -27,8 +27,7 @@ export interface SSRShader {
|
|
27
27
|
opacity: IUniform<number>;
|
28
28
|
maxDistance: IUniform<number>;
|
29
29
|
cameraRange: IUniform<number>;
|
30
|
-
|
31
|
-
thickTolerance: IUniform<number>;
|
30
|
+
thickness: IUniform<number>;
|
32
31
|
};
|
33
32
|
vertexShader: string;
|
34
33
|
fragmentShader: string;
|
@@ -1 +1 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),require("three"),require("../types/helpers.cjs.js");var e=require("../BufferGeometryUtils-
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0}),require("three"),require("../types/helpers.cjs.js");var e=require("../BufferGeometryUtils-971dfde3.js");exports.computeMorphedAttributes=e.computeMorphedAttributes,exports.estimateBytesUsed=e.estimateBytesUsed,exports.interleaveAttributes=e.interleaveAttributes,exports.mergeBufferAttributes=e.mergeBufferAttributes,exports.mergeBufferGeometries=e.mergeBufferGeometries,exports.mergeVertices=e.mergeVertices,exports.toTrianglesDrawMode=e.toTrianglesDrawMode;
|
@@ -485,7 +485,8 @@ function computeMorphedAttributes(object) {
|
|
485
485
|
|
486
486
|
const morphInfluences = object.morphTargetInfluences;
|
487
487
|
|
488
|
-
if (
|
488
|
+
if ( // @ts-expect-error
|
489
|
+
material.morphTargets && morphAttribute && morphInfluences) {
|
489
490
|
_morphA.set(0, 0, 0);
|
490
491
|
|
491
492
|
_morphB.set(0, 0, 0);
|
package/utils/LDrawUtils.cjs.js
CHANGED
@@ -1 +1 @@
|
|
1
|
-
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("three"),r=require("../BufferGeometryUtils-
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var t=require("three"),r=require("../BufferGeometryUtils-971dfde3.js");require("../types/helpers.cjs.js");exports.LDrawUtils=class{static mergeObject(e){function i(r,e,i,n){const a=new t.BufferGeometry,o=r.getAttribute("position").array,s=3===i?r.getAttribute("normal").array:null,u=Math.min(e.count,Math.floor(o.length/3)-e.start),l=3*e.start,c=3*(e.start+u),f=o.subarray(l,c),m=null!==s?s.subarray(l,c):null;if(a.setAttribute("position",new t.BufferAttribute(f,3)),null!==m&&a.setAttribute("normal",new t.BufferAttribute(m,3)),n){const e=r.getAttribute("control0").array.subarray(l,c),i=r.getAttribute("control1").array.subarray(l,c),n=r.getAttribute("direction").array.subarray(l,c);a.setAttribute("control0",new t.BufferAttribute(e,3,!1)),a.setAttribute("control1",new t.BufferAttribute(i,3,!1)),a.setAttribute("direction",new t.BufferAttribute(n,3,!1))}return a}function n(t,r,e){const i=e[t.uuid];i?i.arr.push(r):e[t.uuid]={mat:t,arr:[r]}}function a(t,r){if(!t)return;const e=t.array,i=Math.floor(e.length/3);let n=0;for(let t=0;t<i;t++){const t=e[n],i=e[n+1],a=e[n+2];e[n]=e[n+3],e[n+1]=e[n+4],e[n+2]=e[n+5],e[n+3]=t,e[n+4]=i,e[n+5]=a,n+=3*r}}const o={},s={},u={};e.updateMatrixWorld(!0);const l=new t.Matrix3;e.traverse((t=>{if(t.isMesh|t.isLineSegments){const r=t.isMesh?3:2,e=t.geometry.clone();t.matrixWorld.determinant()<0&&(a(e.attributes.position,r),a(e.attributes.normal,r)),e.applyMatrix4(t.matrixWorld),t.isConditionalLine&&(e.attributes.control0.applyMatrix4(t.matrixWorld),e.attributes.control1.applyMatrix4(t.matrixWorld),l.getNormalMatrix(t.matrixWorld),e.attributes.direction.applyNormalMatrix(l));const c=t.isMesh?o:t.isConditionalLine?u:s;if(Array.isArray(t.material))for(const a in e.groups){const o=e.groups[a];n(t.material[o.materialIndex],i(e,o,r,t.isConditionalLine),c)}else n(t.material,e,c)}}));const c=new t.Group,f=Object.keys(o);for(const e in f){const i=o[f[e]],n=r.mergeBufferGeometries(i.arr);c.add(new t.Mesh(n,i.mat))}const m=Object.keys(s);for(const e in m){const i=s[m[e]],n=r.mergeBufferGeometries(i.arr);c.add(new t.LineSegments(n,i.mat))}const b=Object.keys(u);for(const e in b){const i=u[b[e]],n=r.mergeBufferGeometries(i.arr),a=new t.LineSegments(n,i.mat);a.isConditionalLine=!0,c.add(a)}return c.userData.constructionStep=0,c.userData.numConstructionSteps=1,c}};
|
package/utils/LDrawUtils.js
CHANGED
@@ -1,5 +1,5 @@
|
|
1
1
|
import { Matrix3, Group, Mesh, LineSegments, BufferGeometry, BufferAttribute } from 'three';
|
2
|
-
import { m as mergeBufferGeometries } from '../BufferGeometryUtils-
|
2
|
+
import { m as mergeBufferGeometries } from '../BufferGeometryUtils-1a7a235c.js';
|
3
3
|
import '../types/helpers.js';
|
4
4
|
|
5
5
|
class LDrawUtils {
|
@@ -31,7 +31,11 @@ RoughnessMipmapper.prototype = {
|
|
31
31
|
roughnessMap,
|
32
32
|
normalMap
|
33
33
|
} = material;
|
34
|
-
|
34
|
+
|
35
|
+
if (roughnessMap === null || normalMap === null || !roughnessMap.generateMipmaps || material.userData.roughnessUpdated) {
|
36
|
+
return;
|
37
|
+
}
|
38
|
+
|
35
39
|
material.userData.roughnessUpdated = true;
|
36
40
|
var width = Math.max(roughnessMap.image.width, normalMap.image.width);
|
37
41
|
var height = Math.max(roughnessMap.image.height, normalMap.image.height);
|
package/utils/SceneUtils.d.ts
CHANGED
@@ -1,14 +1,12 @@
|
|
1
1
|
import { BufferGeometry, Group, InstancedMesh, Material, Object3D, Scene } from 'three';
|
2
2
|
|
3
|
-
export
|
4
|
-
|
5
|
-
|
6
|
-
|
7
|
-
|
8
|
-
|
9
|
-
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
function attach(child: Object3D, scene: Scene, parent: Object3D): void;
|
14
|
-
}
|
3
|
+
export function createMeshesFromInstancedMesh(instancedMesh: InstancedMesh): Group;
|
4
|
+
export function createMultiMaterialObject(geometry: BufferGeometry, materials: Material[]): Group;
|
5
|
+
/**
|
6
|
+
* @deprecated Use scene.attach( child ) instead.
|
7
|
+
*/
|
8
|
+
export function detach(child: Object3D, parent: Object3D, scene: Scene): void;
|
9
|
+
/**
|
10
|
+
* @deprecated Use parent.attach( child ) instead.
|
11
|
+
*/
|
12
|
+
export function attach(child: Object3D, scene: Scene, parent: Object3D): void;
|
package/utils/ShadowMapViewer.js
CHANGED
@@ -111,7 +111,10 @@ var ShadowMapViewer = function (light) {
|
|
111
111
|
var width = scope.size.width;
|
112
112
|
var height = scope.size.height;
|
113
113
|
mesh.position.set(-window.innerWidth / 2 + width / 2 + this.x, window.innerHeight / 2 - height / 2 - this.y, 0);
|
114
|
-
|
114
|
+
|
115
|
+
if (doRenderLabel) {
|
116
|
+
labelMesh.position.set(mesh.position.x, mesh.position.y - scope.size.height / 2 + labelCanvas.height / 2, 0);
|
117
|
+
}
|
115
118
|
}
|
116
119
|
};
|
117
120
|
|
@@ -0,0 +1 @@
|
|
1
|
+
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("three"),t=require("./XRHandMeshModel.cjs.js");require("../loaders/GLTFLoader.cjs.js");class o extends e.Object3D{constructor(e){super(),this.controller=e,this.motionController=null,this.envMap=null,this.mesh=null,e.addEventListener("connected",(o=>{const n=o.data;n.hand&&!this.motionController&&(this.xrInputSource=n,this.motionController=new t.XRHandMeshModel(this,e,this.path,n.handedness))})),e.addEventListener("disconnected",(()=>{this.clear(),this.motionController=null}))}updateMatrixWorld(e){super.updateMatrixWorld(e),this.motionController&&this.motionController.updateMesh()}getPointerPosition(){const e=this.controller.joints["index-finger-tip"];return e?e.position:null}intersectBoxObject(t){const o=this.getPointerPosition();if(o){const n=new e.Sphere(o,.01),r=(new e.Box3).setFromObject(t);return n.intersectsBox(r)}return!1}checkButton(e){this.intersectBoxObject(e)?e.onPress():e.onClear(),e.isPressed()&&e.whilePressed()}}exports.OculusHandModel=o;
|
@@ -0,0 +1,19 @@
|
|
1
|
+
import { Object3D, Sphere, Box3, Mesh, Texture, Vector3 } from 'three';
|
2
|
+
|
3
|
+
export class OculusHandModel extends Object3D {
|
4
|
+
controller: Object3D;
|
5
|
+
motionController: Object3D | null;
|
6
|
+
envMap: Texture | null;
|
7
|
+
|
8
|
+
mesh: Mesh | null;
|
9
|
+
|
10
|
+
constructor(controller: Object3D);
|
11
|
+
|
12
|
+
updateMatrixWorld(force?: boolean): void;
|
13
|
+
|
14
|
+
getPointerPosition(): Vector3 | null;
|
15
|
+
|
16
|
+
intersectBoxObject(boxObject: Object3D): boolean;
|
17
|
+
|
18
|
+
checkButton(button: Object3D): void;
|
19
|
+
}
|
@@ -0,0 +1,72 @@
|
|
1
|
+
import { Object3D, Sphere, Box3 } from 'three';
|
2
|
+
import { XRHandMeshModel } from './XRHandMeshModel.js';
|
3
|
+
|
4
|
+
const TOUCH_RADIUS = 0.01;
|
5
|
+
const POINTING_JOINT = 'index-finger-tip';
|
6
|
+
|
7
|
+
class OculusHandModel extends Object3D {
|
8
|
+
constructor(controller) {
|
9
|
+
super();
|
10
|
+
this.controller = controller;
|
11
|
+
this.motionController = null;
|
12
|
+
this.envMap = null;
|
13
|
+
this.mesh = null;
|
14
|
+
controller.addEventListener('connected', event => {
|
15
|
+
const xrInputSource = event.data;
|
16
|
+
|
17
|
+
if (xrInputSource.hand && !this.motionController) {
|
18
|
+
this.xrInputSource = xrInputSource;
|
19
|
+
this.motionController = new XRHandMeshModel(this, controller, this.path, xrInputSource.handedness);
|
20
|
+
}
|
21
|
+
});
|
22
|
+
controller.addEventListener('disconnected', () => {
|
23
|
+
this.clear();
|
24
|
+
this.motionController = null;
|
25
|
+
});
|
26
|
+
}
|
27
|
+
|
28
|
+
updateMatrixWorld(force) {
|
29
|
+
super.updateMatrixWorld(force);
|
30
|
+
|
31
|
+
if (this.motionController) {
|
32
|
+
this.motionController.updateMesh();
|
33
|
+
}
|
34
|
+
}
|
35
|
+
|
36
|
+
getPointerPosition() {
|
37
|
+
const indexFingerTip = this.controller.joints[POINTING_JOINT];
|
38
|
+
|
39
|
+
if (indexFingerTip) {
|
40
|
+
return indexFingerTip.position;
|
41
|
+
} else {
|
42
|
+
return null;
|
43
|
+
}
|
44
|
+
}
|
45
|
+
|
46
|
+
intersectBoxObject(boxObject) {
|
47
|
+
const pointerPosition = this.getPointerPosition();
|
48
|
+
|
49
|
+
if (pointerPosition) {
|
50
|
+
const indexSphere = new Sphere(pointerPosition, TOUCH_RADIUS);
|
51
|
+
const box = new Box3().setFromObject(boxObject);
|
52
|
+
return indexSphere.intersectsBox(box);
|
53
|
+
} else {
|
54
|
+
return false;
|
55
|
+
}
|
56
|
+
}
|
57
|
+
|
58
|
+
checkButton(button) {
|
59
|
+
if (this.intersectBoxObject(button)) {
|
60
|
+
button.onPress();
|
61
|
+
} else {
|
62
|
+
button.onClear();
|
63
|
+
}
|
64
|
+
|
65
|
+
if (button.isPressed()) {
|
66
|
+
button.whilePressed();
|
67
|
+
}
|
68
|
+
}
|
69
|
+
|
70
|
+
}
|
71
|
+
|
72
|
+
export { OculusHandModel };
|
@@ -0,0 +1 @@
|
|
1
|
+
"use strict";function t(t){if(t&&t.__esModule)return t;var e=Object.create(null);return t&&Object.keys(t).forEach((function(i){if("default"!==i){var s=Object.getOwnPropertyDescriptor(t,i);Object.defineProperty(e,i,s.get?s:{enumerable:!0,get:function(){return t[i]}})}})),e.default=t,Object.freeze(e)}Object.defineProperty(exports,"__esModule",{value:!0});var e=t(require("three"));const i=new e.Vector3(0,1,0),s=new e.Vector3(0,0,1);class r extends e.Object3D{constructor(t,e){super(),this.hand=t,this.controller=e,this.motionController=null,this.envMap=null,this.mesh=null,this.pointerGeometry=null,this.pointerMesh=null,this.pointerObject=null,this.pinched=!1,this.attached=!1,this.cursorObject=null,this.raycaster=null,t.addEventListener("connected",(t=>{const e=t.data;e.hand&&(this.visible=!0,this.xrInputSource=e,this.createPointer())}))}_drawVerticesRing(t,e,i){const r=e.clone();for(var o=0;o<16;o++){r.applyAxisAngle(s,2*Math.PI/16);const e=16*i+o;t[3*e]=r.x,t[3*e+1]=r.y,t[3*e+2]=r.z}}_updatePointerVertices(t){const s=this.pointerGeometry.attributes.position.array,r=new e.Vector3(.002,0,-1*(.035-t));this._drawVerticesRing(s,r,0);const o=new e.Vector3(Math.sin(110*Math.PI/180)*t,Math.cos(110*Math.PI/180)*t,0);for(var n=0;n<12;n++)this._drawVerticesRing(s,o,n+1),o.applyAxisAngle(i,110*Math.PI/180/-24);const a=new e.Vector3(0,0,-1*(.035-t));s[624]=a.x,s[625]=a.y,s[626]=a.z;const c=new e.Vector3(0,0,t);s[627]=c.x,s[628]=c.y,s[629]=c.z,this.pointerGeometry.setAttribute("position",new e.Float32BufferAttribute(s,3))}createPointer(){var t,i;const s=new Array(630).fill(0),r=[];for(this.pointerGeometry=new e.BufferGeometry,this.pointerGeometry.setAttribute("position",new e.Float32BufferAttribute(s,3)),this._updatePointerVertices(.01),t=0;t<12;t++){for(i=0;i<15;i++)r.push(16*t+i,16*t+i+1,16*(t+1)+i),r.push(16*t+i+1,16*(t+1)+i+1,16*(t+1)+i);r.push(16*(t+1)-1,16*t,16*(t+2)-1),r.push(16*t,16*(t+1),16*(t+2)-1)}for(t=0;t<15;t++)r.push(208,t+1,t),r.push(209,t+192,t+192+1);r.push(208,0,15),r.push(209,207,192);const o=new e.MeshBasicMaterial;o.transparent=!0,o.opacity=.4,this.pointerGeometry.setIndex(r),this.pointerMesh=new e.Mesh(this.pointerGeometry,o),this.pointerMesh.position.set(0,0,-.01),this.pointerObject=new e.Object3D,this.pointerObject.add(this.pointerMesh),this.raycaster=new e.Raycaster;const n=new e.SphereGeometry(.02,10,10),a=new e.MeshBasicMaterial;a.transparent=!0,a.opacity=.4,this.cursorObject=new e.Mesh(n,a),this.pointerObject.add(this.cursorObject),this.add(this.pointerObject)}_updateRaycaster(){if(this.raycaster){const t=this.pointerObject.matrixWorld,i=new e.Matrix4;i.identity().extractRotation(t),this.raycaster.ray.origin.setFromMatrixPosition(t),this.raycaster.ray.direction.set(0,0,-1).applyMatrix4(i)}}_updatePointer(){this.pointerObject.visible=this.controller.visible;const t=this.hand.joints["index-finger-tip"],e=this.hand.joints["thumb-tip"],i=t.position.distanceTo(e.position),s=t.position.clone().add(e.position).multiplyScalar(.5);this.pointerObject.position.copy(s),this.pointerObject.quaternion.copy(this.controller.quaternion),this.pinched=i<=.02;const r=(i-.01)/.04,o=(i-.01)/.01;if(r>1)this._updatePointerVertices(.01),this.pointerMesh.position.set(0,0,-.01),this.pointerMesh.material.opacity=.4;else if(r>0){const t=.007*r+.003;this._updatePointerVertices(t),o<1?(this.pointerMesh.position.set(0,0,-1*t-.02*(1-o)),this.pointerMesh.material.opacity=.4+.6*(1-o)):(this.pointerMesh.position.set(0,0,-1*t),this.pointerMesh.material.opacity=.4)}else this._updatePointerVertices(.003),this.pointerMesh.position.set(0,0,-.023),this.pointerMesh.material.opacity=1;this.cursorObject.material.opacity=this.pointerMesh.material.opacity}updateMatrixWorld(t){super.updateMatrixWorld(t),this.pointerGeometry&&(this._updatePointer(),this._updateRaycaster())}isPinched(){return this.pinched}setAttached(t){this.attached=t}isAttached(){return this.attached}intersectObject(t,e=!0){if(this.raycaster)return this.raycaster.intersectObject(t,e)}intersectObjects(t,e=!0){if(this.raycaster)return this.raycaster.intersectObjects(t,e)}checkIntersections(t,i=!1){if(this.raycaster&&!this.attached){const s=this.raycaster.intersectObjects(t,i),r=new e.Vector3(0,0,-1);if(s.length>0){const t=s[0].distance;this.cursorObject.position.copy(r.multiplyScalar(t))}else this.cursorObject.position.copy(r.multiplyScalar(1.5))}}setCursor(t){const i=new e.Vector3(0,0,-1);this.raycaster&&!this.attached&&this.cursorObject.position.copy(i.multiplyScalar(t))}}exports.OculusHandPointerModel=r;
|
@@ -0,0 +1,63 @@
|
|
1
|
+
import {
|
2
|
+
BufferGeometry,
|
3
|
+
Intersection,
|
4
|
+
Mesh,
|
5
|
+
MeshBasicMaterial,
|
6
|
+
Object3D,
|
7
|
+
Raycaster,
|
8
|
+
SphereBufferGeometry,
|
9
|
+
Texture,
|
10
|
+
Vector3,
|
11
|
+
} from 'three';
|
12
|
+
|
13
|
+
export class OculusHandPointerModel extends Object3D {
|
14
|
+
hand: Object3D;
|
15
|
+
controller: Object3D;
|
16
|
+
motionController: Object3D | null;
|
17
|
+
|
18
|
+
envMap: Texture | null;
|
19
|
+
|
20
|
+
mesh: Mesh | null;
|
21
|
+
|
22
|
+
pointerGeometry: BufferGeometry | null;
|
23
|
+
pointerMesh: Mesh<BufferGeometry, MeshBasicMaterial> | null;
|
24
|
+
pointerObject: Object3D | null;
|
25
|
+
|
26
|
+
pinched: boolean;
|
27
|
+
attached: boolean;
|
28
|
+
|
29
|
+
cursorObject: Mesh<SphereBufferGeometry, MeshBasicMaterial> | null;
|
30
|
+
|
31
|
+
raycaster: Raycaster;
|
32
|
+
|
33
|
+
visible: boolean;
|
34
|
+
xrInputSource: unknown;
|
35
|
+
|
36
|
+
constructor(hand: Object3D, controller: Object3D);
|
37
|
+
|
38
|
+
private _drawVerticesRing(vertices: number[], baseVector: Vector3, ringIndex: number): void;
|
39
|
+
|
40
|
+
private _updatePointerVertices(rearRadius: number): void;
|
41
|
+
|
42
|
+
public createPointer(): void;
|
43
|
+
|
44
|
+
private _updateRaycaster(): void;
|
45
|
+
|
46
|
+
private _updatePointer(): void;
|
47
|
+
|
48
|
+
public updateMatrixWorld(force?: boolean): void;
|
49
|
+
|
50
|
+
public isPinched(): boolean;
|
51
|
+
|
52
|
+
public setAttached(attached: boolean): void;
|
53
|
+
|
54
|
+
public isAttached(): boolean;
|
55
|
+
|
56
|
+
public intersectObject(object: Object3D, recursive?: boolean): Intersection[] | void;
|
57
|
+
|
58
|
+
public intersectObjects(objects: Object3D[], recursive?: boolean): Intersection[] | void;
|
59
|
+
|
60
|
+
public checkIntersections(objects: Object3D[], recursive?: boolean): void;
|
61
|
+
|
62
|
+
public setCursor(distance: number): void;
|
63
|
+
}
|
@@ -0,0 +1,248 @@
|
|
1
|
+
import * as THREE from 'three';
|
2
|
+
|
3
|
+
const PINCH_MAX = 0.05;
|
4
|
+
const PINCH_THRESHOLD = 0.02;
|
5
|
+
const PINCH_MIN = 0.01;
|
6
|
+
const POINTER_ADVANCE_MAX = 0.02;
|
7
|
+
const POINTER_OPACITY_MAX = 1;
|
8
|
+
const POINTER_OPACITY_MIN = 0.4;
|
9
|
+
const POINTER_FRONT_RADIUS = 0.002;
|
10
|
+
const POINTER_REAR_RADIUS = 0.01;
|
11
|
+
const POINTER_REAR_RADIUS_MIN = 0.003;
|
12
|
+
const POINTER_LENGTH = 0.035;
|
13
|
+
const POINTER_SEGMENTS = 16;
|
14
|
+
const POINTER_RINGS = 12;
|
15
|
+
const POINTER_HEMISPHERE_ANGLE = 110;
|
16
|
+
const YAXIS = new THREE.Vector3(0, 1, 0);
|
17
|
+
const ZAXIS = new THREE.Vector3(0, 0, 1);
|
18
|
+
const CURSOR_RADIUS = 0.02;
|
19
|
+
const CURSOR_MAX_DISTANCE = 1.5;
|
20
|
+
|
21
|
+
class OculusHandPointerModel extends THREE.Object3D {
|
22
|
+
constructor(hand, controller) {
|
23
|
+
super();
|
24
|
+
this.hand = hand;
|
25
|
+
this.controller = controller;
|
26
|
+
this.motionController = null;
|
27
|
+
this.envMap = null;
|
28
|
+
this.mesh = null;
|
29
|
+
this.pointerGeometry = null;
|
30
|
+
this.pointerMesh = null;
|
31
|
+
this.pointerObject = null;
|
32
|
+
this.pinched = false;
|
33
|
+
this.attached = false;
|
34
|
+
this.cursorObject = null;
|
35
|
+
this.raycaster = null;
|
36
|
+
hand.addEventListener('connected', event => {
|
37
|
+
const xrInputSource = event.data;
|
38
|
+
|
39
|
+
if (xrInputSource.hand) {
|
40
|
+
this.visible = true;
|
41
|
+
this.xrInputSource = xrInputSource;
|
42
|
+
this.createPointer();
|
43
|
+
}
|
44
|
+
});
|
45
|
+
}
|
46
|
+
|
47
|
+
_drawVerticesRing(vertices, baseVector, ringIndex) {
|
48
|
+
const segmentVector = baseVector.clone();
|
49
|
+
|
50
|
+
for (var i = 0; i < POINTER_SEGMENTS; i++) {
|
51
|
+
segmentVector.applyAxisAngle(ZAXIS, Math.PI * 2 / POINTER_SEGMENTS);
|
52
|
+
const vid = ringIndex * POINTER_SEGMENTS + i;
|
53
|
+
vertices[3 * vid] = segmentVector.x;
|
54
|
+
vertices[3 * vid + 1] = segmentVector.y;
|
55
|
+
vertices[3 * vid + 2] = segmentVector.z;
|
56
|
+
}
|
57
|
+
}
|
58
|
+
|
59
|
+
_updatePointerVertices(rearRadius) {
|
60
|
+
const vertices = this.pointerGeometry.attributes.position.array; // first ring for front face
|
61
|
+
|
62
|
+
const frontFaceBase = new THREE.Vector3(POINTER_FRONT_RADIUS, 0, -1 * (POINTER_LENGTH - rearRadius));
|
63
|
+
|
64
|
+
this._drawVerticesRing(vertices, frontFaceBase, 0); // rings for rear hemisphere
|
65
|
+
|
66
|
+
|
67
|
+
const rearBase = new THREE.Vector3(Math.sin(Math.PI * POINTER_HEMISPHERE_ANGLE / 180) * rearRadius, Math.cos(Math.PI * POINTER_HEMISPHERE_ANGLE / 180) * rearRadius, 0);
|
68
|
+
|
69
|
+
for (var i = 0; i < POINTER_RINGS; i++) {
|
70
|
+
this._drawVerticesRing(vertices, rearBase, i + 1);
|
71
|
+
|
72
|
+
rearBase.applyAxisAngle(YAXIS, Math.PI * POINTER_HEMISPHERE_ANGLE / 180 / (POINTER_RINGS * -2));
|
73
|
+
} // front and rear face center vertices
|
74
|
+
|
75
|
+
|
76
|
+
const frontCenterIndex = POINTER_SEGMENTS * (1 + POINTER_RINGS);
|
77
|
+
const rearCenterIndex = POINTER_SEGMENTS * (1 + POINTER_RINGS) + 1;
|
78
|
+
const frontCenter = new THREE.Vector3(0, 0, -1 * (POINTER_LENGTH - rearRadius));
|
79
|
+
vertices[frontCenterIndex * 3] = frontCenter.x;
|
80
|
+
vertices[frontCenterIndex * 3 + 1] = frontCenter.y;
|
81
|
+
vertices[frontCenterIndex * 3 + 2] = frontCenter.z;
|
82
|
+
const rearCenter = new THREE.Vector3(0, 0, rearRadius);
|
83
|
+
vertices[rearCenterIndex * 3] = rearCenter.x;
|
84
|
+
vertices[rearCenterIndex * 3 + 1] = rearCenter.y;
|
85
|
+
vertices[rearCenterIndex * 3 + 2] = rearCenter.z;
|
86
|
+
this.pointerGeometry.setAttribute('position', new THREE.Float32BufferAttribute(vertices, 3)); // verticesNeedUpdate = true;
|
87
|
+
}
|
88
|
+
|
89
|
+
createPointer() {
|
90
|
+
var i, j;
|
91
|
+
const vertices = new Array(((POINTER_RINGS + 1) * POINTER_SEGMENTS + 2) * 3).fill(0); // const vertices = [];
|
92
|
+
|
93
|
+
const indices = [];
|
94
|
+
this.pointerGeometry = new THREE.BufferGeometry();
|
95
|
+
this.pointerGeometry.setAttribute('position', new THREE.Float32BufferAttribute(vertices, 3));
|
96
|
+
|
97
|
+
this._updatePointerVertices(POINTER_REAR_RADIUS); // construct faces to connect rings
|
98
|
+
|
99
|
+
|
100
|
+
for (i = 0; i < POINTER_RINGS; i++) {
|
101
|
+
for (j = 0; j < POINTER_SEGMENTS - 1; j++) {
|
102
|
+
indices.push(i * POINTER_SEGMENTS + j, i * POINTER_SEGMENTS + j + 1, (i + 1) * POINTER_SEGMENTS + j);
|
103
|
+
indices.push(i * POINTER_SEGMENTS + j + 1, (i + 1) * POINTER_SEGMENTS + j + 1, (i + 1) * POINTER_SEGMENTS + j);
|
104
|
+
}
|
105
|
+
|
106
|
+
indices.push((i + 1) * POINTER_SEGMENTS - 1, i * POINTER_SEGMENTS, (i + 2) * POINTER_SEGMENTS - 1);
|
107
|
+
indices.push(i * POINTER_SEGMENTS, (i + 1) * POINTER_SEGMENTS, (i + 2) * POINTER_SEGMENTS - 1);
|
108
|
+
} // construct front and rear face
|
109
|
+
|
110
|
+
|
111
|
+
const frontCenterIndex = POINTER_SEGMENTS * (1 + POINTER_RINGS);
|
112
|
+
const rearCenterIndex = POINTER_SEGMENTS * (1 + POINTER_RINGS) + 1;
|
113
|
+
|
114
|
+
for (i = 0; i < POINTER_SEGMENTS - 1; i++) {
|
115
|
+
indices.push(frontCenterIndex, i + 1, i);
|
116
|
+
indices.push(rearCenterIndex, i + POINTER_SEGMENTS * POINTER_RINGS, i + POINTER_SEGMENTS * POINTER_RINGS + 1);
|
117
|
+
}
|
118
|
+
|
119
|
+
indices.push(frontCenterIndex, 0, POINTER_SEGMENTS - 1);
|
120
|
+
indices.push(rearCenterIndex, POINTER_SEGMENTS * (POINTER_RINGS + 1) - 1, POINTER_SEGMENTS * POINTER_RINGS);
|
121
|
+
const material = new THREE.MeshBasicMaterial();
|
122
|
+
material.transparent = true;
|
123
|
+
material.opacity = POINTER_OPACITY_MIN;
|
124
|
+
this.pointerGeometry.setIndex(indices);
|
125
|
+
this.pointerMesh = new THREE.Mesh(this.pointerGeometry, material);
|
126
|
+
this.pointerMesh.position.set(0, 0, -1 * POINTER_REAR_RADIUS);
|
127
|
+
this.pointerObject = new THREE.Object3D();
|
128
|
+
this.pointerObject.add(this.pointerMesh);
|
129
|
+
this.raycaster = new THREE.Raycaster(); // create cursor
|
130
|
+
|
131
|
+
const cursorGeometry = new THREE.SphereGeometry(CURSOR_RADIUS, 10, 10);
|
132
|
+
const cursorMaterial = new THREE.MeshBasicMaterial();
|
133
|
+
cursorMaterial.transparent = true;
|
134
|
+
cursorMaterial.opacity = POINTER_OPACITY_MIN;
|
135
|
+
this.cursorObject = new THREE.Mesh(cursorGeometry, cursorMaterial);
|
136
|
+
this.pointerObject.add(this.cursorObject);
|
137
|
+
this.add(this.pointerObject);
|
138
|
+
}
|
139
|
+
|
140
|
+
_updateRaycaster() {
|
141
|
+
if (this.raycaster) {
|
142
|
+
const pointerMatrix = this.pointerObject.matrixWorld;
|
143
|
+
const tempMatrix = new THREE.Matrix4();
|
144
|
+
tempMatrix.identity().extractRotation(pointerMatrix);
|
145
|
+
this.raycaster.ray.origin.setFromMatrixPosition(pointerMatrix);
|
146
|
+
this.raycaster.ray.direction.set(0, 0, -1).applyMatrix4(tempMatrix);
|
147
|
+
}
|
148
|
+
}
|
149
|
+
|
150
|
+
_updatePointer() {
|
151
|
+
this.pointerObject.visible = this.controller.visible;
|
152
|
+
const indexTip = this.hand.joints['index-finger-tip'];
|
153
|
+
const thumbTip = this.hand.joints['thumb-tip'];
|
154
|
+
const distance = indexTip.position.distanceTo(thumbTip.position);
|
155
|
+
const position = indexTip.position.clone().add(thumbTip.position).multiplyScalar(0.5);
|
156
|
+
this.pointerObject.position.copy(position);
|
157
|
+
this.pointerObject.quaternion.copy(this.controller.quaternion);
|
158
|
+
this.pinched = distance <= PINCH_THRESHOLD;
|
159
|
+
const pinchScale = (distance - PINCH_MIN) / (PINCH_MAX - PINCH_MIN);
|
160
|
+
const focusScale = (distance - PINCH_MIN) / (PINCH_THRESHOLD - PINCH_MIN);
|
161
|
+
|
162
|
+
if (pinchScale > 1) {
|
163
|
+
this._updatePointerVertices(POINTER_REAR_RADIUS);
|
164
|
+
|
165
|
+
this.pointerMesh.position.set(0, 0, -1 * POINTER_REAR_RADIUS);
|
166
|
+
this.pointerMesh.material.opacity = POINTER_OPACITY_MIN;
|
167
|
+
} else if (pinchScale > 0) {
|
168
|
+
const rearRadius = (POINTER_REAR_RADIUS - POINTER_REAR_RADIUS_MIN) * pinchScale + POINTER_REAR_RADIUS_MIN;
|
169
|
+
|
170
|
+
this._updatePointerVertices(rearRadius);
|
171
|
+
|
172
|
+
if (focusScale < 1) {
|
173
|
+
this.pointerMesh.position.set(0, 0, -1 * rearRadius - (1 - focusScale) * POINTER_ADVANCE_MAX);
|
174
|
+
this.pointerMesh.material.opacity = POINTER_OPACITY_MIN + (1 - focusScale) * (POINTER_OPACITY_MAX - POINTER_OPACITY_MIN);
|
175
|
+
} else {
|
176
|
+
this.pointerMesh.position.set(0, 0, -1 * rearRadius);
|
177
|
+
this.pointerMesh.material.opacity = POINTER_OPACITY_MIN;
|
178
|
+
}
|
179
|
+
} else {
|
180
|
+
this._updatePointerVertices(POINTER_REAR_RADIUS_MIN);
|
181
|
+
|
182
|
+
this.pointerMesh.position.set(0, 0, -1 * POINTER_REAR_RADIUS_MIN - POINTER_ADVANCE_MAX);
|
183
|
+
this.pointerMesh.material.opacity = POINTER_OPACITY_MAX;
|
184
|
+
}
|
185
|
+
|
186
|
+
this.cursorObject.material.opacity = this.pointerMesh.material.opacity;
|
187
|
+
}
|
188
|
+
|
189
|
+
updateMatrixWorld(force) {
|
190
|
+
super.updateMatrixWorld(force);
|
191
|
+
|
192
|
+
if (this.pointerGeometry) {
|
193
|
+
this._updatePointer();
|
194
|
+
|
195
|
+
this._updateRaycaster();
|
196
|
+
}
|
197
|
+
}
|
198
|
+
|
199
|
+
isPinched() {
|
200
|
+
return this.pinched;
|
201
|
+
}
|
202
|
+
|
203
|
+
setAttached(attached) {
|
204
|
+
this.attached = attached;
|
205
|
+
}
|
206
|
+
|
207
|
+
isAttached() {
|
208
|
+
return this.attached;
|
209
|
+
}
|
210
|
+
|
211
|
+
intersectObject(object, recursive = true) {
|
212
|
+
if (this.raycaster) {
|
213
|
+
return this.raycaster.intersectObject(object, recursive);
|
214
|
+
}
|
215
|
+
}
|
216
|
+
|
217
|
+
intersectObjects(objects, recursive = true) {
|
218
|
+
if (this.raycaster) {
|
219
|
+
return this.raycaster.intersectObjects(objects, recursive);
|
220
|
+
}
|
221
|
+
}
|
222
|
+
|
223
|
+
checkIntersections(objects, recursive = false) {
|
224
|
+
if (this.raycaster && !this.attached) {
|
225
|
+
const intersections = this.raycaster.intersectObjects(objects, recursive);
|
226
|
+
const direction = new THREE.Vector3(0, 0, -1);
|
227
|
+
|
228
|
+
if (intersections.length > 0) {
|
229
|
+
const intersection = intersections[0];
|
230
|
+
const distance = intersection.distance;
|
231
|
+
this.cursorObject.position.copy(direction.multiplyScalar(distance));
|
232
|
+
} else {
|
233
|
+
this.cursorObject.position.copy(direction.multiplyScalar(CURSOR_MAX_DISTANCE));
|
234
|
+
}
|
235
|
+
}
|
236
|
+
}
|
237
|
+
|
238
|
+
setCursor(distance) {
|
239
|
+
const direction = new THREE.Vector3(0, 0, -1);
|
240
|
+
|
241
|
+
if (this.raycaster && !this.attached) {
|
242
|
+
this.cursorObject.position.copy(direction.multiplyScalar(distance));
|
243
|
+
}
|
244
|
+
}
|
245
|
+
|
246
|
+
}
|
247
|
+
|
248
|
+
export { OculusHandPointerModel };
|
@@ -0,0 +1 @@
|
|
1
|
+
"use strict";function e(e){if(e&&e.__esModule)return e;var t=Object.create(null);return e&&Object.keys(e).forEach((function(r){if("default"!==r){var n=Object.getOwnPropertyDescriptor(e,r);Object.defineProperty(t,r,n.get?n:{enumerable:!0,get:function(){return e[r]}})}})),t.default=e,Object.freeze(t)}Object.defineProperty(exports,"__esModule",{value:!0});var t=e(require("three"));exports.createText=function(e,r){const n=document.createElement("canvas"),l=n.getContext("2d");let o=null;const a=100;l.font="normal 100px Arial",o=l.measureText(e);const c=o.width;n.width=c,n.height=a,l.font="normal 100px Arial",l.textAlign="center",l.textBaseline="middle",l.fillStyle="#ffffff",l.fillText(e,c/2,50);const i=new t.Texture(n);i.needsUpdate=!0;const f=new t.MeshBasicMaterial({color:16777215,side:t.DoubleSide,map:i,transparent:!0}),s=new t.PlaneGeometry(r*c/a,r);return new t.Mesh(s,f)};
|