mujoco-react 10.3.0 → 10.4.0

package/dist/index.js

@@ -1,5 +1,5 @@
-import { withContacts, getContact, captureCameraFrame, captureCameraFrameBlob, createCameraFrameCaptureSession, CAMERA_FRAME_CAPTURE_PRE_RENDER_USER_DATA_KEY, CAPTURE_EXCLUDE_KEY } from './chunk-6AZEFI6A.js';
-export { CAMERA_FRAME_CAPTURE_PRE_RENDER_USER_DATA_KEY, CAMERA_FRAME_CAPTURE_RENDER_USER_DATA_KEY, CAPTURE_EXCLUDE_KEY, ModelActuators, ModelBodies, ModelCameras, ModelGeoms, ModelJoints, ModelKeyframes, ModelResources, ModelSensors, ModelSites, ScenarioLighting, SplatEnvironment, SplatEnvironmentReadinessStatus, VisualScenarioEffects, captureCameraFrame, captureCameraFrameBlob, createCameraFrameCaptureSession, createPairedSplatEnvironment, createSparkSplatViewerUrl, createSplatEnvironmentUserData, createSplatSceneConfig, createVisualScenarioExecutionContext, getContact, getScenarioBackground, getScenarioCameraPosition, getSplatEnvironmentReadiness, registerModelResources, renderCameraFrameToCanvas, useSplatEnvironment, useSplatSceneConfig, useVisualScenarioEffects, useVisualScenarioExecutionContext, withSplatEnvironment } from './chunk-6AZEFI6A.js';
+import { withContacts, getContact, captureCameraFrame, captureCameraFrameBlob, createCameraFrameCaptureSession, CAMERA_FRAME_CAPTURE_PRE_RENDER_USER_DATA_KEY, CAPTURE_EXCLUDE_KEY } from './chunk-FBXXXPLQ.js';
+export { CAMERA_FRAME_CAPTURE_PRE_RENDER_USER_DATA_KEY, CAMERA_FRAME_CAPTURE_RENDER_USER_DATA_KEY, CAPTURE_EXCLUDE_KEY, ModelActuators, ModelBodies, ModelCameras, ModelGeoms, ModelJoints, ModelKeyframes, ModelResources, ModelSensors, ModelSites, ScenarioLighting, SplatEnvironment, SplatEnvironmentReadinessStatus, VisualScenarioEffects, captureCameraFrame, captureCameraFrameBlob, createCameraFrameCaptureSession, createPairedSplatEnvironment, createSparkSplatViewerUrl, createSplatEnvironmentUserData, createSplatSceneConfig, createVisualScenarioExecutionContext, getContact, getScenarioBackground, getScenarioCameraPosition, getSplatEnvironmentReadiness, registerModelResources, renderCameraFrameToCanvas, useSplatEnvironment, useSplatSceneConfig, useVisualScenarioEffects, useVisualScenarioExecutionContext, withSplatEnvironment } from './chunk-FBXXXPLQ.js';
 import loadMujoco from '@mujoco/mujoco';
 import defaultMujocoWasmUrl from '@mujoco/mujoco/mujoco.wasm?url';
 import { createContext, forwardRef, useRef, useEffect, useContext, useState, useCallback, useMemo, useLayoutEffect } from 'react';
@@ -4867,11 +4867,161 @@ var _contactNormal = new THREE11.Vector3();
 var MAX_CONTACT_ARROWS = 50;
 var CAMERA_DEBUG_LENGTH = 0.12;
 var CAMERA_DEBUG_FRUSTUM_DEPTH = 0.08;
+function toVector32(value, fallback) {
+  if (!value) return fallback.clone();
+  return value instanceof THREE11.Vector3 ? value.clone() : new THREE11.Vector3(value[0], value[1], value[2]);
+}
+function createCameraLabel(text, color) {
+  const canvas = document.createElement("canvas");
+  canvas.width = 256;
+  canvas.height = 64;
+  const ctx = canvas.getContext("2d");
+  ctx.fillStyle = new THREE11.Color(color).getStyle();
+  ctx.font = "bold 32px monospace";
+  ctx.textAlign = "center";
+  ctx.fillText(text, 128, 42);
+  const texture = new THREE11.CanvasTexture(canvas);
+  const sprite = new THREE11.Sprite(
+    new THREE11.SpriteMaterial({
+      map: texture,
+      depthTest: false,
+      transparent: true
+    })
+  );
+  sprite.position.set(0, 0.014, 0.01);
+  sprite.scale.set(0.05, 0.012, 1);
+  sprite.renderOrder = 999;
+  return sprite;
+}
+function createVirtualCameraDebugObject(camera, index) {
+  const color = camera.color ?? "#ff3d71";
+  const aimColor = camera.aimColor ?? "#38bdf8";
+  const markerScale = camera.markerScale ?? 1;
+  const cameraPosition = toVector32(camera.position, new THREE11.Vector3());
+  const configuredUp = toVector32(camera.up, new THREE11.Vector3(0, 0, 1)).normalize();
+  const cameraQuaternion = new THREE11.Quaternion();
+  const forward = new THREE11.Vector3();
+  if (camera.quaternion) {
+    if (camera.quaternion instanceof THREE11.Quaternion) {
+      cameraQuaternion.copy(camera.quaternion);
+    } else {
+      cameraQuaternion.set(
+        camera.quaternion[0],
+        camera.quaternion[1],
+        camera.quaternion[2],
+        camera.quaternion[3]
+      );
+    }
+    forward.set(0, 0, -1).applyQuaternion(cameraQuaternion).normalize();
+  } else {
+    const target2 = toVector32(
+      camera.lookAt,
+      cameraPosition.clone().add(new THREE11.Vector3(0, 0, -1))
+    );
+    forward.copy(target2).sub(cameraPosition);
+    if (forward.lengthSq() < 1e-8) forward.set(0, 0, -1);
+    forward.normalize();
+    cameraQuaternion.setFromRotationMatrix(
+      new THREE11.Matrix4().lookAt(cameraPosition, target2, configuredUp)
+    );
+  }
+  const target = camera.lookAt ? toVector32(camera.lookAt, cameraPosition.clone().add(forward)) : cameraPosition.clone().addScaledVector(forward, 0.4);
+  const distanceToTarget = Math.max(target.distanceTo(cameraPosition), 1e-3);
+  const depth = camera.frustumDepth ?? Math.min(Math.max(distanceToTarget * 0.42, 0.16), 0.45);
+  const fov = camera.fov ?? 50;
+  const aspect = (camera.width ?? 640) / (camera.height ?? 480);
+  const right = forward.clone().cross(configuredUp);
+  if (right.lengthSq() < 1e-8) right.set(1, 0, 0);
+  right.normalize();
+  const orthogonalUp = right.clone().cross(forward).normalize();
+  const frustumHeight = 2 * Math.tan(THREE11.MathUtils.degToRad(fov) / 2) * depth;
+  const frustumWidth = frustumHeight * aspect;
+  const center = cameraPosition.clone().addScaledVector(forward, depth);
+  const halfRight = right.clone().multiplyScalar(frustumWidth / 2);
+  const halfUp = orthogonalUp.clone().multiplyScalar(frustumHeight / 2);
+  const topLeft = center.clone().sub(halfRight).add(halfUp);
+  const topRight = center.clone().add(halfRight).add(halfUp);
+  const bottomRight = center.clone().add(halfRight).sub(halfUp);
+  const bottomLeft = center.clone().sub(halfRight).sub(halfUp);
+  const frustumPoints = [
+    cameraPosition,
+    topLeft,
+    cameraPosition,
+    topRight,
+    cameraPosition,
+    bottomRight,
+    cameraPosition,
+    bottomLeft,
+    topLeft,
+    topRight,
+    topRight,
+    bottomRight,
+    bottomRight,
+    bottomLeft,
+    bottomLeft,
+    topLeft
+  ];
+  const group = new THREE11.Group();
+  group.name = camera.name ?? `virtual-camera-${index}`;
+  group.renderOrder = 999;
+  group.frustumCulled = false;
+  const frustum = new THREE11.LineSegments(
+    new THREE11.BufferGeometry().setFromPoints(frustumPoints),
+    new THREE11.LineBasicMaterial({
+      color,
+      transparent: true,
+      opacity: 0.9,
+      depthTest: false
+    })
+  );
+  frustum.renderOrder = 999;
+  frustum.frustumCulled = false;
+  group.add(frustum);
+  const aim = new THREE11.LineSegments(
+    new THREE11.BufferGeometry().setFromPoints([cameraPosition, target]),
+    new THREE11.LineBasicMaterial({
+      color: aimColor,
+      transparent: true,
+      opacity: 0.95,
+      depthTest: false
+    })
+  );
+  aim.renderOrder = 999;
+  aim.frustumCulled = false;
+  group.add(aim);
+  const markerGroup = new THREE11.Group();
+  markerGroup.position.copy(cameraPosition);
+  markerGroup.quaternion.copy(cameraQuaternion);
+  markerGroup.renderOrder = 999;
+  markerGroup.frustumCulled = false;
+  markerGroup.add(new THREE11.Mesh(
+    new THREE11.BoxGeometry(0.045 * markerScale, 0.028 * markerScale, 0.022 * markerScale),
+    new THREE11.MeshBasicMaterial({ color, depthTest: false })
+  ));
+  const lens = new THREE11.Mesh(
+    new THREE11.BoxGeometry(0.025 * markerScale, 0.018 * markerScale, 0.014 * markerScale),
+    new THREE11.MeshBasicMaterial({ color: aimColor, depthTest: false })
+  );
+  lens.position.set(0, 0, -0.021 * markerScale);
+  markerGroup.add(lens);
+  if (camera.name) markerGroup.add(createCameraLabel(camera.name, color));
+  group.add(markerGroup);
+  const targetMarker = new THREE11.Mesh(
+    new THREE11.SphereGeometry(0.018 * markerScale, 16, 10),
+    new THREE11.MeshBasicMaterial({ color: aimColor, depthTest: false })
+  );
+  targetMarker.position.copy(target);
+  targetMarker.renderOrder = 999;
+  targetMarker.frustumCulled = false;
+  group.add(targetMarker);
+  return group;
+}
 function Debug({
   showGeoms = false,
   showSites = false,
   showJoints = false,
   showCameras = false,
+  virtualCameras = [],
   showContacts = false,
   showCOM = false,
   showInertia = false,
@@ -4888,6 +5038,7 @@ function Debug({
     const sites = [];
     const joints = [];
     const cameras = [];
+    const virtualCameraObjects = [];
     const comMarkers = [];
     if (showGeoms) {
       for (let i = 0; i < model.ngeom; i++) {
@@ -5066,6 +5217,9 @@ function Debug({
         cameras.push(group);
       }
     }
+    for (let i = 0; i < virtualCameras.length; i += 1) {
+      virtualCameraObjects.push(createVirtualCameraDebugObject(virtualCameras[i], i));
+    }
     if (showCOM) {
       for (let i = 1; i < model.nbody; i++) {
         const geometry = new THREE11.SphereGeometry(5e-3, 6, 6);
@@ -5075,8 +5229,8 @@ function Debug({
         comMarkers.push(mesh);
       }
     }
-    return { geoms, sites, joints, cameras, comMarkers };
-  }, [status, mjModelRef, showGeoms, showSites, showJoints, showCameras, showCOM]);
+    return { geoms, sites, joints, cameras, virtualCameraObjects, comMarkers };
+  }, [status, mjModelRef, showGeoms, showSites, showJoints, showCameras, virtualCameras, showCOM]);
   useEffect(() => {
     const group = groupRef.current;
     if (!group || !debugGeometry) return;
@@ -5085,6 +5239,7 @@ function Debug({
       ...debugGeometry.sites,
       ...debugGeometry.joints,
       ...debugGeometry.cameras,
+      ...debugGeometry.virtualCameraObjects,
       ...debugGeometry.comMarkers
     ];
     for (const obj of allObjects) group.add(obj);