fix: Fix #49 where applyCrossFade not working for copied animators

package/example/ios/FilamentExample.xcodeproj/project.pbxproj

@@ -490,7 +490,7 @@
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
 				CURRENT_PROJECT_VERSION = 1;
-				DEVELOPMENT_TEAM = CJW62Q77E7;
+				DEVELOPMENT_TEAM = LC6XSNN25D;
 				ENABLE_BITCODE = NO;
 				INFOPLIST_FILE = FilamentExample/Info.plist;
 				LD_RUNPATH_SEARCH_PATHS = (
@@ -518,7 +518,7 @@
 				ASSETCATALOG_COMPILER_APPICON_NAME = AppIcon;
 				CLANG_ENABLE_MODULES = YES;
 				CURRENT_PROJECT_VERSION = 1;
-				DEVELOPMENT_TEAM = CJW62Q77E7;
+				DEVELOPMENT_TEAM = LC6XSNN25D;
 				INFOPLIST_FILE = FilamentExample/Info.plist;
 				LD_RUNPATH_SEARCH_PATHS = (
 					"$(inherited)",

package/example/src/App.tsx

@@ -1,8 +1,8 @@
 import * as React from 'react'
-import { useEffect, useRef } from 'react'
+import { useEffect, useMemo, useRef } from 'react'
 
-import { Platform, StyleSheet } from 'react-native'
-import { Filament, useEngine, Float3, useRenderCallback, useAsset, useModel } from 'react-native-filament'
+import { Button, Platform, ScrollView, StyleSheet, View } from 'react-native'
+import { Filament, useEngine, Float3, useRenderCallback, useAsset, useModel, Animator } from 'react-native-filament'
 
 const penguModelPath = Platform.select({
   android: 'custom/pengu.glb',
@@ -14,6 +14,11 @@ const indirectLightPath = Platform.select({
   ios: 'default_env_ibl.ktx',
 })!
 
+const pirateHatPath = Platform.select({
+  android: 'custom/pirate.glb',
+  ios: 'pirate.glb',
+})!
+
 // Camera config:
 const cameraPosition: Float3 = [0, 0, 8]
 const cameraTarget: Float3 = [0, 0, 0]
@@ -22,11 +27,25 @@ const focalLengthInMillimeters = 28
 const near = 0.1
 const far = 1000
 
+const animationInterpolationTime = 5
+
 export default function App() {
   const engine = useEngine()
 
   const pengu = useModel({ engine: engine, path: penguModelPath })
   const light = useAsset({ path: indirectLightPath })
+  const pirateHat = useModel({ engine: engine, path: pirateHatPath })
+  const pirateHatAnimator = useMemo(() => {
+    if (pirateHat.state !== 'loaded' || pengu.state !== 'loaded') {
+      return undefined
+    }
+    return pirateHat.asset.createAnimatorWithAnimationsFrom(pengu.asset)
+  }, [pengu, pirateHat])
+
+  const prevAnimationIndex = useRef<number>()
+  const prevAnimationStarted = useRef<number>()
+  const animationInterpolation = useRef(0)
+  const currentAnimationIndex = useRef(0)
 
   useEffect(() => {
     if (light == null) return
@@ -52,20 +71,81 @@ export default function App() {
       camera.setLensProjection(focalLengthInMillimeters, aspectRatio, near, far)
     }
 
-    if (pengu.state === 'loaded') {
-      pengu.animator.applyAnimation(0, passedSeconds)
-      pengu.animator.updateBoneMatrices()
+    engine.getCamera().lookAt(cameraPosition, cameraTarget, cameraUp)
+
+    if (pengu.state !== 'loaded' || pirateHatAnimator == null) {
+      return
     }
 
-    engine.getCamera().lookAt(cameraPosition, cameraTarget, cameraUp)
+    // Update the animators to play the current animation
+    pengu.animator.applyAnimation(currentAnimationIndex.current, passedSeconds)
+    pirateHatAnimator.applyAnimation(currentAnimationIndex.current, passedSeconds)
+
+    // Eventually apply a cross fade
+    if (prevAnimationIndex.current != null) {
+      if (prevAnimationStarted.current == null) {
+        prevAnimationStarted.current = passedSeconds
+      }
+      animationInterpolation.current += passedSeconds - prevAnimationStarted.current
+      const alpha = animationInterpolation.current / animationInterpolationTime
+
+      // Blend animations using a cross fade
+      pengu.animator.applyCrossFade(prevAnimationIndex.current, prevAnimationStarted.current!, alpha)
+      pirateHatAnimator.applyCrossFade(prevAnimationIndex.current, prevAnimationStarted.current!, alpha)
+
+      // Reset the prev animation once the transition is completed
+      if (alpha >= 1) {
+        prevAnimationIndex.current = undefined
+        prevAnimationStarted.current = undefined
+        animationInterpolation.current = 0
+      }
+    }
+
+    pengu.animator.updateBoneMatrices()
+    pirateHatAnimator.updateBoneMatrices()
   })
 
-  return <Filament style={styles.filamentView} engine={engine} />
+  const animations = useMemo(() => {
+    if (pengu.state !== 'loaded') return []
+    const count = pengu.animator.getAnimationCount()
+    const names = []
+    for (let i = 0; i < count; i++) {
+      names.push(pengu.animator.getAnimationName(i))
+    }
+    return names
+  }, [pengu])
+
+  return (
+    <View style={styles.container}>
+      <Filament style={styles.filamentView} engine={engine} />
+      <ScrollView style={styles.btnContainer}>
+        {animations.map((name, i) => (
+          <Button
+            key={name}
+            title={name}
+            onPress={() => {
+              prevAnimationIndex.current = currentAnimationIndex.current
+              currentAnimationIndex.current = i
+            }}
+          />
+        ))}
+      </ScrollView>
+    </View>
+  )
 }
 
 const styles = StyleSheet.create({
+  container: {
+    flex: 1,
+  },
   filamentView: {
     flex: 1,
     backgroundColor: 'lightblue',
   },
+  btnContainer: {
+    height: 200,
+    width: '100%',
+    position: 'absolute',
+    bottom: 0,
+  },
 })

package/filament_animator_feat.patch

@@ -33,7 +33,7 @@ index 199555a40..9111df050 100644
      Animator(const Animator& animator) = delete;
      Animator(Animator&& animator) = delete;
 diff --git a/libs/gltfio/src/Animator.cpp b/libs/gltfio/src/Animator.cpp
-index 99a4269d0..036adcb8d 100644
+index 99a4269d0..dd8825d28 100644
 --- a/libs/gltfio/src/Animator.cpp
 +++ b/libs/gltfio/src/Animator.cpp
 @@ -238,6 +238,9 @@ Animator::Animator(FFilamentAsset const* asset, FFilamentInstance* instance) {
@@ -46,3 +46,24 @@ index 99a4269d0..036adcb8d 100644
  void Animator::applyCrossFade(size_t previousAnimIndex, float previousAnimTime, float alpha) {
      mImpl->stashCrossFade();
      applyAnimation(previousAnimIndex, previousAnimTime);
+@@ -368,7 +371,8 @@ void AnimatorImpl::stashCrossFade() {
+         return index;
+     };
+
+-    const Instance root = tm.getInstance(asset->mRoot);
++    const Entity rootEntity = instance ? instance->getRoot() : asset->mRoot;
++    const Instance root = tm.getInstance(rootEntity);
+     const size_t count = recursiveCount(root, 0, recursiveCount);
+     crossFade.reserve(count);
+     crossFade.resize(count);
+@@ -394,7 +398,9 @@ void AnimatorImpl::applyCrossFade(float alpha) {
+         }
+         return index;
+     };
+-    recursiveFn(tm.getInstance(asset->mRoot), 0, recursiveFn);
++    const Entity rootEntity = instance ? instance->getRoot() : asset->mRoot;
++    const Instance root = tm.getInstance(rootEntity);
++    recursiveFn(root, 0, recursiveFn);
+ }
+
+ void AnimatorImpl::addChannels(const FixedCapacityVector<Entity>& nodeMap,