react-native-filament/lib/commonjs/react/Animator.js

A real-time physically based 3D rendering engine for React Native

"use strict";

Object.defineProperty(exports, "__esModule", {
  value: true
});
exports.Animator = Animator;
var _react = _interopRequireWildcard(require("react"));
var _RenderCallbackContext = require("./RenderCallbackContext");
var _useAnimator = require("../hooks/useAnimator");
var _reactNativeWorkletsCore = require("react-native-worklets-core");
var _usePrevious = _interopRequireDefault(require("../hooks/usePrevious"));
var _ParentInstancesContext = require("./ParentInstancesContext");
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function (e) { return e ? t : r; })(e); }
function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != typeof e && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && Object.prototype.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
/**
 * Can be used to control the animation of a Model.
 * For pausing, playing, it is recommended to conditionally render the Animator component.
 *
 * @example
 * ```jsx
 * <Model source={DroneGlb}>
 *  <Animator animationIndex={2} />
 * </Model>
 * ```
 */
function Animator(props) {
  const instances = _react.default.useContext(_ParentInstancesContext.ParentInstancesContext);
  if (instances == null) {
    throw new Error('Animator must be used inside a <Model> or <ModelInstance> component.');
  }
  const instance = instances[0];
  if (instance == null) {
    // Should never happen
    throw new Error('No instances found for the parent Model component. This is a bug.');
  }
  return /*#__PURE__*/_react.default.createElement(AnimatorImpl, _extends({
    instance: instance
  }, props));
}
function AnimatorImpl({
  instance,
  animationIndex: animationIndexProp = 0,
  transitionDuration = 0,
  onAnimationsLoaded
}) {
  const animator = (0, _useAnimator.useAnimator)(instance);

  // State for cross fading animations
  const prevAnimationIndex = (0, _reactNativeWorkletsCore.useSharedValue)(undefined);
  const prevAnimationStarted = (0, _reactNativeWorkletsCore.useSharedValue)(undefined);
  const animationInterpolation = (0, _reactNativeWorkletsCore.useSharedValue)(0);
  _RenderCallbackContext.RenderCallbackContext.useRenderCallback(({
    passedSeconds
  }) => {
    'worklet';

    if (animator == null) {
      return;
    }
    const animationIndex = typeof animationIndexProp === 'number' ? animationIndexProp : animationIndexProp.value;
    animator.applyAnimation(animationIndex, passedSeconds);

    // Eventually apply a cross fade
    if (prevAnimationIndex.value != null && transitionDuration > 0) {
      if (prevAnimationStarted.value == null) {
        prevAnimationStarted.value = passedSeconds;
      }
      animationInterpolation.value += passedSeconds - prevAnimationStarted.value;
      const alpha = animationInterpolation.value / transitionDuration;

      // Blend animations using a cross fade
      animator.applyCrossFade(prevAnimationIndex.value, prevAnimationStarted.value, alpha);

      // Reset the prev animation once the transition is completed
      if (alpha >= 1) {
        prevAnimationIndex.value = undefined;
        prevAnimationStarted.value = undefined;
        animationInterpolation.value = 0;
      }
    }
    animator.updateBoneMatrices();
  }, [animator, animationIndexProp]);

  // Update prevAnimationIndex when animationIndexProp changes
  const previousAnimationIndexProp = (0, _usePrevious.default)(animationIndexProp);
  (0, _react.useEffect)(() => {
    // Update previous index if the prop is just a number:
    if (typeof animationIndexProp === 'number') {
      if (typeof previousAnimationIndexProp !== 'number') return;
      prevAnimationIndex.value = previousAnimationIndexProp;
      return;
    }

    // Update previous index if the prop is a shared value:
    let value = animationIndexProp.value;
    const removeListener = animationIndexProp.addListener(() => {
      prevAnimationIndex.value = value;
      value = animationIndexProp.value;
    });
    return () => {
      removeListener();
    };
  }, [animationIndexProp, prevAnimationIndex, previousAnimationIndexProp]);

  // Get all animations and return them using the onAnimationsLoaded callback
  (0, _react.useEffect)(() => {
    if (animator == null || onAnimationsLoaded == null) {
      return;
    }
    const animations = [];
    for (let i = 0; i < animator.getAnimationCount(); i++) {
      animations.push({
        index: i,
        duration: animator.getAnimationDuration(i),
        name: animator.getAnimationName(i)
      });
    }
    onAnimationsLoaded(animations);
  }, [animator, onAnimationsLoaded]);
  return null;
}
//# sourceMappingURL=Animator.js.map