@lovelace_lol/embody 0.0.9 → 0.0.11

package/README.md

@@ -87,6 +87,11 @@ spent. Each native mesh raycast is indivisible; a large mesh can still cause a
 frame drop, and slicing does not reduce total raycast CPU time. Interactive
 annotation changes retain synchronous queries so a marker samples one pose.
 Replacement, clearing and disposal cancel stale loads before scene commits.
+New 3D markers and separated endpoints invalidate the cached camera layout.
+Visible markers receive the current zoom sizing and Rust viewport constraints
+before paint; hidden markers receive that layout before reveal captures label
+scales. Viewport clipping also follows the animated label size during reveal
+overshoot. Markers added during a reveal stay hidden until its layout pass resumes.
 
 For first reveal, call `controller.prepareModelForRender(model, { signal })`
 from the existing `beforeReveal` callback (or directly before attaching the

package/dist/index.js

@@ -1,5 +1,5 @@
 import * as THREE3 from 'three';
-import { NoBlending, MultiplyBlending, SubtractiveBlending, AdditiveBlending, NormalBlending, Vector3, Box3, Timer, Matrix4, AnimationMixer, AdditiveAnimationBlendMode, NormalAnimationBlendMode, LoopOnce, LoopRepeat, LoopPingPong, PropertyBinding, Quaternion, AnimationUtils, InterpolateDiscrete, InterpolateLinear, MathUtils, Mesh, PlaneGeometry, ShadowMaterial, HemisphereLight, DirectionalLight, SRGBColorSpace, ACESFilmicToneMapping, WebGLRenderer, Scene, Color, PerspectiveCamera, PCFShadowMap, PCFSoftShadowMap, NumberKeyframeTrack, QuaternionKeyframeTrack, VectorKeyframeTrack, AnimationClip, PMREMGenerator, FloatType, Float32BufferAttribute, Euler, BufferAttribute, WebGPUCoordinateSystem, WebGLCoordinateSystem } from 'three';
+import { NoBlending, MultiplyBlending, SubtractiveBlending, AdditiveBlending, NormalBlending, Vector3, Box3, Timer, Matrix4, AnimationMixer, AdditiveAnimationBlendMode, NormalAnimationBlendMode, LoopOnce, LoopRepeat, LoopPingPong, PropertyBinding, Euler, Quaternion, AnimationUtils, InterpolateDiscrete, InterpolateLinear, MathUtils, Mesh, PlaneGeometry, ShadowMaterial, HemisphereLight, DirectionalLight, SRGBColorSpace, ACESFilmicToneMapping, WebGLRenderer, Scene, Color, PerspectiveCamera, PCFShadowMap, PCFSoftShadowMap, NumberKeyframeTrack, QuaternionKeyframeTrack, VectorKeyframeTrack, AnimationClip, PMREMGenerator, FloatType, Float32BufferAttribute, BufferAttribute, WebGPUCoordinateSystem, WebGLCoordinateSystem } from 'three';
 import { CC4_HUMANOID_SKELETON_TEMPLATE, HUMANOID_SKELETON_TEMPLATES, DEFAULT_HAIR_COLOR_APPEARANCE, initEmbodyCore, requireInitializedEmbodyCore } from '@lovelace_lol/embody/wasm';
 export * from '@lovelace_lol/embody/wasm';
 export { CC4_HUMANOID_SKELETON_TEMPLATE, DEFAULT_AXIS_TO_CHANNEL, DEFAULT_BONE_MAX_DEGREES, DEFAULT_HAIR_COLOR_APPEARANCE, HAIR_COLOR_PRESETS, HUMANOID_SKELETON_TEMPLATES, JOINT_CONTROL_SECTION, VISEME_KEYS } from '@lovelace_lol/embody/wasm';
@@ -1207,6 +1207,7 @@ var DPthree3DMarkers = class {
     // Calculated from model size - collapse expanded regions when zoomed out
     __publicField(this, "lastCameraDistance", -1);
     // Cache to avoid unnecessary checks
+    __publicField(this, "markerLayoutDirty", false);
     __publicField(this, "visibilityAnimationActive", false);
     __publicField(this, "visibilityAnimationScheduler", new AnimationFrameTaskScheduler());
     __publicField(this, "visibilityAnimationStates", []);
@@ -1370,6 +1371,8 @@ var DPthree3DMarkers = class {
         return;
       }
       this.separateOverlappingMarkers(annotationCameraCore);
+      this.markerLayoutDirty = true;
+      this.update();
       console.log(`[3DMarkers] loadRegions complete. Created markers for:`, Array.from(this.markerMeshes.keys()));
       console.log(`[3DMarkers] lineEndpoints:`, Array.from(this.lineEndpoints.keys()));
       console.log(`[3DMarkers] resolvedStyles:`, Array.from(this.resolvedStyles.keys()));
@@ -1841,6 +1844,12 @@ var DPthree3DMarkers = class {
     this.markerTargetVisibility.set(region.name, !startHidden && !region.isFallback);
     this.markerAngleGateVisibility.delete(region.name);
     this.markerViewportVisibility.set(region.name, true);
+    this.markerLayoutDirty = true;
+    if (this.visibilityAnimationActive) {
+      this.setMarkerObjectsVisible(region.name, false, false);
+    } else {
+      this.update();
+    }
   }
   /**
    * Embody Rust owns endpoint layout; the Three adapter applies the returned positions
@@ -2456,7 +2465,7 @@ var DPthree3DMarkers = class {
     const dy = this.camera.position.y - this.modelCenter.y;
     const dz = this.camera.position.z - this.modelCenter.z;
     const cameraDistance = Math.sqrt(dx * dx + dy * dy + dz * dz);
-    const distanceChanged = this.lastCameraDistance < 0 || Math.abs(cameraDistance - this.lastCameraDistance) > this.lastCameraDistance * 0.02;
+    const distanceChanged = this.markerLayoutDirty || this.lastCameraDistance < 0 || Math.abs(cameraDistance - this.lastCameraDistance) > this.lastCameraDistance * 0.02;
     if (distanceChanged) {
       const previousDistance = this.lastCameraDistance;
       this.lastCameraDistance = cameraDistance;
@@ -2467,22 +2476,27 @@ var DPthree3DMarkers = class {
         sphere.scale.setScalar(clampedScale);
       }
       const shouldBeZoomedIn = cameraDistance < this.zoomThreshold;
-      if (shouldBeZoomedIn !== this.isZoomedIn) {
+      const zoomChanged = shouldBeZoomedIn !== this.isZoomedIn;
+      if (this.markerLayoutDirty || zoomChanged) {
         this.isZoomedIn = shouldBeZoomedIn;
-        this.applyZoomScale(shouldBeZoomedIn ? ZOOMED_IN_LINE_SCALE : 1);
+        this.applyZoomScale(
+          shouldBeZoomedIn ? ZOOMED_IN_LINE_SCALE : 1,
+          zoomChanged || shouldBeZoomedIn
+        );
       }
       const crossedAutoCollapseThreshold = previousDistance >= 0 && previousDistance <= this.autoCollapseThreshold && cameraDistance > this.autoCollapseThreshold;
       if (crossedAutoCollapseThreshold) {
         this.collapseAllRegions();
       }
     }
-    const cameraMoved = !this.hasCameraAngleUpdateSnapshot || this.lastCameraAngleUpdatePosition.distanceToSquared(this.camera.position) > 1e-4 || 1 - Math.abs(this.lastCameraAngleUpdateQuaternion.dot(this.camera.quaternion)) > 1e-5;
+    const cameraMoved = this.markerLayoutDirty || !this.hasCameraAngleUpdateSnapshot || this.lastCameraAngleUpdatePosition.distanceToSquared(this.camera.position) > 1e-4 || 1 - Math.abs(this.lastCameraAngleUpdateQuaternion.dot(this.camera.quaternion)) > 1e-5;
     if (!cameraMoved) {
       return;
     }
     this.lastCameraAngleUpdatePosition.copy(this.camera.position);
     this.lastCameraAngleUpdateQuaternion.copy(this.camera.quaternion);
     this.hasCameraAngleUpdateSnapshot = true;
+    this.markerLayoutDirty = false;
     const cameraAngle = getModelLocalOrbitAngle(this.model, this.modelCenter, this.camera.position);
     for (const [name, sphere] of this.markerMeshes) {
       const markerAngle = sphere.userData.cameraAngle;
@@ -2520,14 +2534,16 @@ var DPthree3DMarkers = class {
   }
   /**
    * Apply zoom-based scaling to all markers, lines, and labels.
-   * Only called when crossing the zoom threshold (not every frame).
+   * Runs on zoom threshold crossings and when marker geometry changes.
    */
-  applyZoomScale(scaleFactor) {
+  applyZoomScale(scaleFactor, scaleSpheres = true) {
     const isZoomed = scaleFactor < 1;
     const sphereScaleFactor = isZoomed ? ZOOMED_IN_SPHERE_SCALE : 1;
     const labelScaleFactor = isZoomed ? ZOOMED_IN_LABEL_SCALE : 1;
-    for (const sphere of this.markerMeshes.values()) {
-      sphere.scale.setScalar(sphereScaleFactor);
+    if (scaleSpheres) {
+      for (const sphere of this.markerMeshes.values()) {
+        sphere.scale.setScalar(sphereScaleFactor);
+      }
     }
     for (const line of this.lineMeshes.values()) {
       const material = line.material;
@@ -2631,6 +2647,10 @@ var DPthree3DMarkers = class {
         object.visible = true;
         this.setObjectOpacity(object, opacity * itemOpacityFactor);
       }
+      const name = state.label?.object.userData.annotation;
+      if (typeof name === "string" && !this.updateMarkerLineLayout(name)) {
+        this.setMarkerObjectsVisible(name, false, false);
+      }
     }
   }
   restoreVisibilityAnimationStates(states) {
@@ -2816,6 +2836,8 @@ var DPthree3DMarkers = class {
     this.stopVisibilityAnimation(true);
     if (visible) {
       this.markerGroup.visible = true;
+      this.markerLayoutDirty = true;
+      this.update();
     }
     this.visibilityAnimationStates = this.captureVisibilityAnimationStates();
     if (this.visibilityAnimationStates.length === 0) {
@@ -2878,6 +2900,7 @@ var DPthree3DMarkers = class {
     this.markerAngleGateVisibility.clear();
     this.markerViewportVisibility.clear();
     this.soloedMarker = null;
+    this.markerLayoutDirty = false;
     this.hasCameraAngleUpdateSnapshot = false;
   }
   // ============ SOLO MODE ============
@@ -6733,8 +6756,30 @@ function bindModelReferencePose(model, referencePose) {
   if (index !== referencePose.nodes.length) throw new Error("Incompatible reference pose hierarchy: extra captured nodes");
   return bindings2;
 }
-
-// three/clipBindings.ts
+function withComponentTracks(clip) {
+  let expanded = false;
+  const tracks = clip.tracks.flatMap((track) => {
+    const parsed = PropertyBinding.parseTrackName(track.name);
+    const euler = parsed.propertyName === "rotation";
+    if (!euler && !["morphTargetInfluences", "weights"].includes(parsed.propertyName) || parsed.propertyIndex !== void 0) return [track];
+    const cubic = track.createInterpolant.isInterpolantFactoryMethodGLTFCubicSpline === true;
+    const parts = cubic ? 3 : 1;
+    const width = track.getValueSize() / parts;
+    if (!Number.isInteger(width) || width < 1 || euler && width !== 3) throw new Error(`Invalid component track ${JSON.stringify(track.name)}.`);
+    expanded = true;
+    return Array.from({ length: width }, (_, component) => {
+      const scalar = track.clone();
+      scalar.name = `${track.name}[${euler ? ["x", "y", "z"][component] : component}]`;
+      scalar.values = track.values.slice(0, track.times.length * parts);
+      for (let sample = 0; sample < scalar.values.length; sample += 1) scalar.values[sample] = track.values[sample * width + component];
+      return scalar;
+    });
+  });
+  if (!expanded) return clip;
+  const indexed = clip.clone();
+  indexed.tracks = tracks;
+  return indexed;
+}
 function concreteTrackName(target, inspection) {
   if (!target) return void 0;
   if (target.kind === "morphTarget") {
@@ -6746,6 +6791,7 @@ function concreteTrackName(target, inspection) {
     const property = target.property ?? "rotation";
     if (!object) return void 0;
     if (property === "rotation" || property === "quaternion") return `${object.uuid}.quaternion`;
+    if (property === "eulerX" || property === "eulerY" || property === "eulerZ") return `${object.uuid}.rotation[${property.slice(-1).toLowerCase()}]`;
     if (property === "position" || property === "scale") return `${object.uuid}.${property}`;
   }
   if (target.kind === "meshVisibility") {
@@ -6856,6 +6902,7 @@ var ThreeNativePlaybackConnector = class {
    */
   playNativeClip(clip, options = {}) {
     this.beforeOperation();
+    clip = withComponentTracks(clip);
     const [ir] = serializeAnimationClips(this.binding.model, [clip], this.binding.inspection);
     if (ir.tracks.length !== clip.tracks.length) {
       throw new Error("Every native playback track must serialize against the bound model.");
@@ -6903,6 +6950,7 @@ var ThreeNativePlaybackConnector = class {
   /** Edit authored samples, retaining the native action and its loop/fade progress. */
   replaceClip(handle, clip) {
     this.beforeOperation();
+    clip = withComponentTracks(clip);
     const resource = this.resources.get(handle);
     if (!resource) throw new Error("Unknown, foreign or stale playback handle.");
     const [ir] = serializeAnimationClips(this.binding.model, [clip], this.binding.inspection);
@@ -7411,10 +7459,17 @@ var Embody = class _Embody {
     switch (parsed.propertyName) {
       case "quaternion":
         return Object.values(reference.transform.rotation);
+      case "rotation": {
+        const rotation = reference.transform.rotation;
+        const euler = reference.rotationEuler ?? new Euler().setFromQuaternion(new Quaternion(rotation.x, rotation.y, rotation.z, rotation.w), reference.rotationOrder);
+        const axis = parsed.propertyIndex;
+        return axis === "x" || axis === "y" || axis === "z" ? [euler[axis]] : [euler.x, euler.y, euler.z];
+      }
       case "position":
         return Object.values(reference.transform.position);
       case "scale":
         return Object.values(reference.transform.scale);
+      case "weights":
       case "morphTargetInfluences": {
         const mesh = object;
         const index = typeof parsed.propertyIndex === "string" && !/^\d+$/.test(parsed.propertyIndex) ? mesh.morphTargetDictionary?.[parsed.propertyIndex] : Number(parsed.propertyIndex);
@@ -7431,7 +7486,7 @@ var Embody = class _Embody {
     if (!nativeSource) {
       ir = this.compile(source, options);
     }
-    const clip = nativeSource ? source.clip.clone() : createAnimationClipFromClipIR(ir, this.inspection);
+    const clip = nativeSource ? withComponentTracks(source.clip).clone() : createAnimationClipFromClipIR(ir, this.inspection);
     if (ir) {
       const predecessor = this.current.get(source.name);
       const outgoing = predecessor?.connector.getAction(predecessor.id);
@@ -9590,6 +9645,10 @@ function createAnimationClipFromClipIR(clip, inspection) {
       if (property === "rotation" || property === "quaternion") {
         if (track.inheritStart) object.quaternion.toArray(values, 0);
         tracks.push(new QuaternionKeyframeTrack(trackName, times, values, interpolation));
+      } else if (property === "eulerX" || property === "eulerY" || property === "eulerZ") {
+        const axis = property.slice(-1).toLowerCase();
+        if (track.inheritStart) values[0] = object.rotation[axis];
+        tracks.push(new NumberKeyframeTrack(trackName, times, values, interpolation));
       } else if (property === "position") {
         if (track.inheritStart) object.position.toArray(values, 0);
         tracks.push(new VectorKeyframeTrack(trackName, times, values, interpolation));
@@ -9623,7 +9682,7 @@ function serializeAnimationClips(model, clips, inspection) {
       channelKinds.set(kind, id);
       return id;
     };
-    clip.tracks.forEach((track, index) => {
+    withComponentTracks(clip).tracks.forEach((track, index) => {
       const found = findTrackTarget(model, track);
       if (!found?.object) return;
       const { parsed, object } = found;
@@ -9638,7 +9697,7 @@ function serializeAnimationClips(model, clips, inspection) {
       } else if (property === "visible" && object.isMesh) {
         target = { kind: "meshVisibility", meshId: meshIds.get(object) };
       } else {
-        const transformProperty = property === "quaternion" || property === "rotation" ? "rotation" : property === "position" ? "position" : property === "scale" ? "scale" : null;
+        const transformProperty = property === "rotation" && ["x", "y", "z"].includes(String(parsed.propertyIndex)) ? `euler${String(parsed.propertyIndex).toUpperCase()}` : property === "quaternion" ? "rotation" : property === "position" ? "position" : property === "scale" ? "scale" : null;
         if (transformProperty) {
           const boneId = boneIds.get(object);
           target = boneId ? { kind: "boneTransform", boneId, property: transformProperty } : { kind: "objectTransform", objectId: objectIds.get(object), property: transformProperty };