aiden/VR-Web-Player
1
0
Fork 0
forked from EXT/VR180-Web-Player
Code Actions Activity

Toned down hands/controlers
All checks were successful
Test / test (push) Successful in 9m31s
Details

Browse Source
This commit is contained in:
Aiden
2026-06-11 09:36:32 +10:00
parent cdaed5c712
commit 229c25947a
1 changed files with 29 additions and 34 deletions
Download Patch File Download Diff File Expand all files Collapse all files

63
src/vr180player/xr/pointer-overlays.ts
View File

@@ -10,8 +10,8 @@ export type VrOverlayVisibilityOptions = {
hideDelayMs?: number; hideDelayMs?: number;
}; };
export const INPUT_OVERLAY_HIDE_DELAY_MS = 2500; export const INPUT_OVERLAY_HIDE_DELAY_MS = 1600;
export const INPUT_OVERLAY_FADE_DURATION_MS = 200; export const INPUT_OVERLAY_FADE_DURATION_MS = 260;
export const INPUT_OVERLAY_RENDER_ORDER = 10000; export const INPUT_OVERLAY_RENDER_ORDER = 10000;
export const POINTER_LENGTH = 5; export const POINTER_LENGTH = 5;
export const POINTER_MIN_LENGTH = 0.06; export const POINTER_MIN_LENGTH = 0.06;
@@ -19,29 +19,9 @@ export const POINTER_HIT_SURFACE_OFFSET = 0.015;
const HAND_JOINT_NAMES = [ const HAND_JOINT_NAMES = [
'wrist', 'wrist',
'thumb-metacarpal',
'thumb-phalanx-proximal',
'thumb-phalanx-distal',
'thumb-tip', 'thumb-tip',
'index-finger-metacarpal',
'index-finger-phalanx-proximal',
'index-finger-phalanx-intermediate',
'index-finger-phalanx-distal',
'index-finger-tip', 'index-finger-tip',
'middle-finger-metacarpal',
'middle-finger-phalanx-proximal',
'middle-finger-phalanx-intermediate',
'middle-finger-phalanx-distal',
'middle-finger-tip', 'middle-finger-tip',
'ring-finger-metacarpal',
'ring-finger-phalanx-proximal',
'ring-finger-phalanx-intermediate',
'ring-finger-phalanx-distal',
'ring-finger-tip',
'pinky-finger-metacarpal',
'pinky-finger-phalanx-proximal',
'pinky-finger-phalanx-intermediate',
'pinky-finger-phalanx-distal',
'pinky-finger-tip' 'pinky-finger-tip'
]; ];
@@ -123,7 +103,7 @@ export class VrOverlayVisibility {
object.traverse?.((child: any) => { object.traverse?.((child: any) => {
const materials = Array.isArray(child.material) ? child.material : [child.material]; const materials = Array.isArray(child.material) ? child.material : [child.material];
materials.filter(Boolean).forEach((material: any) => { materials.filter(Boolean).forEach((material: any) => {
material.opacity = opacity; material.opacity = opacity * getOverlayMaterialMaxOpacity(material);
material.transparent = true; material.transparent = true;
material.depthTest = false; material.depthTest = false;
material.depthWrite = false; material.depthWrite = false;
@@ -153,7 +133,7 @@ export function createPointerOverlay(index: number, overlayVisibility: VrOverlay
const group = new THREE.Group(); const group = new THREE.Group();
group.name = `vrPointerOverlay${index}`; group.name = `vrPointerOverlay${index}`;
const pointerMaterial = createOverlayLineMaterial(index === 0 ? 0x8fd8ff : 0xffc16b, 0.75); const pointerMaterial = createOverlayLineMaterial(index === 0 ? 0xb9e8ff : 0xffd99a, 0.28);
const pointerGeometry = new THREE.BufferGeometry().setFromPoints([ const pointerGeometry = new THREE.BufferGeometry().setFromPoints([
new THREE.Vector3(0, 0, 0), new THREE.Vector3(0, 0, 0),
new THREE.Vector3(0, 0, -POINTER_LENGTH) new THREE.Vector3(0, 0, -POINTER_LENGTH)
@@ -163,8 +143,8 @@ export function createPointerOverlay(index: number, overlayVisibility: VrOverlay
pointerLine.renderOrder = INPUT_OVERLAY_RENDER_ORDER; pointerLine.renderOrder = INPUT_OVERLAY_RENDER_ORDER;
group.add(pointerLine); group.add(pointerLine);
const tipMaterial = createOverlayMeshMaterial(index === 0 ? 0x8fd8ff : 0xffc16b, 0.9); const tipMaterial = createOverlayMeshMaterial(index === 0 ? 0xd8f5ff : 0xffe6ba, 0.42);
const tipMesh = new THREE.Mesh(new THREE.SphereGeometry(0.018, 12, 8), tipMaterial); const tipMesh = new THREE.Mesh(new THREE.SphereGeometry(0.01, 10, 6), tipMaterial);
tipMesh.name = `vrPointerTip${index}`; tipMesh.name = `vrPointerTip${index}`;
tipMesh.position.z = -POINTER_LENGTH; tipMesh.position.z = -POINTER_LENGTH;
tipMesh.renderOrder = INPUT_OVERLAY_RENDER_ORDER + 1; tipMesh.renderOrder = INPUT_OVERLAY_RENDER_ORDER + 1;
@@ -195,7 +175,7 @@ export function createControllerOverlay(index: number, overlayVisibility: VrOver
const group = new THREE.Group(); const group = new THREE.Group();
group.name = `vrControllerOverlay${index}`; group.name = `vrControllerOverlay${index}`;
const material = createOverlayLineMaterial(index === 0 ? 0x8fd8ff : 0xffc16b, 0.8); const material = createOverlayLineMaterial(index === 0 ? 0xb9e8ff : 0xffd99a, 0.24);
const outlineGeometry = new THREE.BufferGeometry().setFromPoints([ const outlineGeometry = new THREE.BufferGeometry().setFromPoints([
new THREE.Vector3(-0.045, -0.025, -0.08), new THREE.Vector3(-0.045, -0.025, -0.08),
new THREE.Vector3(0.045, -0.025, -0.08), new THREE.Vector3(0.045, -0.025, -0.08),
@@ -210,8 +190,8 @@ export function createControllerOverlay(index: number, overlayVisibility: VrOver
outline.renderOrder = INPUT_OVERLAY_RENDER_ORDER; outline.renderOrder = INPUT_OVERLAY_RENDER_ORDER;
group.add(outline); group.add(outline);
const originMaterial = createOverlayMeshMaterial(0xffffff, 0.75); const originMaterial = createOverlayMeshMaterial(0xffffff, 0.28);
const origin = new THREE.Mesh(new THREE.SphereGeometry(0.012, 10, 6), originMaterial); const origin = new THREE.Mesh(new THREE.SphereGeometry(0.007, 8, 5), originMaterial);
origin.name = `vrControllerOrigin${index}`; origin.name = `vrControllerOrigin${index}`;
origin.renderOrder = INPUT_OVERLAY_RENDER_ORDER + 1; origin.renderOrder = INPUT_OVERLAY_RENDER_ORDER + 1;
group.add(origin); group.add(origin);
@@ -226,7 +206,7 @@ export function createHandOverlay(hand: any, index: number, overlayVisibility: V
return; return;
} }
const material = createOverlayMeshMaterial(index === 0 ? 0x8fd8ff : 0xffc16b, 0.85); const material = createOverlayMeshMaterial(index === 0 ? 0xb9e8ff : 0xffd99a, 0.26);
joints.forEach(({ joint, name }) => { joints.forEach(({ joint, name }) => {
if (!joint || joint.userData?.vrwpHandOverlayMarker) { if (!joint || joint.userData?.vrwpHandOverlayMarker) {
return; return;
@@ -234,8 +214,8 @@ export function createHandOverlay(hand: any, index: number, overlayVisibility: V
const isTip = name.endsWith('tip'); const isTip = name.endsWith('tip');
const isWrist = name === 'wrist'; const isWrist = name === 'wrist';
const radius = isWrist ? 0.014 : isTip ? 0.011 : 0.008; const radius = isWrist ? 0.008 : isTip ? 0.006 : 0.005;
const marker = new THREE.Mesh(new THREE.SphereGeometry(radius, 10, 6), material); const marker = new THREE.Mesh(new THREE.SphereGeometry(radius, 8, 5), material);
marker.name = `vrHandJointOverlay${index}-${name}`; marker.name = `vrHandJointOverlay${index}-${name}`;
marker.renderOrder = INPUT_OVERLAY_RENDER_ORDER + 2; marker.renderOrder = INPUT_OVERLAY_RENDER_ORDER + 2;
marker.frustumCulled = false; marker.frustumCulled = false;
@@ -289,23 +269,38 @@ export function setPointerOverlayLength(pointerOverlay: any, length: number): vo
} }
export function createOverlayLineMaterial(color: number, opacity: number): any { export function createOverlayLineMaterial(color: number, opacity: number): any {
return new THREE.LineBasicMaterial({ const material = new THREE.LineBasicMaterial({
color, color,
depthTest: false, depthTest: false,
depthWrite: false, depthWrite: false,
opacity, opacity,
transparent: true transparent: true
}); });
material.userData = {
...material.userData,
vrwpOverlayMaxOpacity: opacity
};
return material;
} }
export function createOverlayMeshMaterial(color: number, opacity: number): any { export function createOverlayMeshMaterial(color: number, opacity: number): any {
return new THREE.MeshBasicMaterial({ const material = new THREE.MeshBasicMaterial({
color, color,
depthTest: false, depthTest: false,
depthWrite: false, depthWrite: false,
opacity, opacity,
transparent: true transparent: true
}); });
material.userData = {
...material.userData,
vrwpOverlayMaxOpacity: opacity
};
return material;
}
function getOverlayMaterialMaxOpacity(material: any): number {
const maxOpacity = material.userData?.vrwpOverlayMaxOpacity;
return Number.isFinite(maxOpacity) ? maxOpacity : 1;
} }
function getHandJoints(hand: any): Array<{ joint: any; name: string }> { function getHandJoints(hand: any): Array<{ joint: any; name: string }> {