react-native-worklets 0.0.1-alpha → 0.1.0

package/animations/SpringAnimation.js

@@ -1,125 +0,0 @@
-import AnimatedValue from '../nodes/AnimatedValue';
-import Animation from './Animation';
-import SpringConfig from '../SpringConfig';
-import SpringNode from '../nodes/SpringNode';
-import AnimatedOnChange from '../nodes/AnimatedOnChange';
-import AnimatedDetach from '../nodes/AnimatedDetach';
-import AnimatedOp from '../nodes/AnimatedOp';
-
-import { clock } from '../nodes/AnimatedClock';
-
-import invariant from 'fbjs/lib/invariant';
-import { shouldUseNativeDriver } from '../NativeAnimatedHelper';
-
-function withDefault(value, defaultValue) {
-  if (value === undefined || value === null) {
-    return defaultValue;
-  }
-  return value;
-}
-
-export default class SpringAnimation extends Animation {
-  constructor(config) {
-    super();
-
-    this._overshootClamping = withDefault(config.overshootClamping, false);
-    this._restDisplacementThreshold = withDefault(
-      config.restDisplacementThreshold,
-      0.001
-    );
-    this._restSpeedThreshold = withDefault(config.restSpeedThreshold, 0.001);
-    this._initialVelocity = withDefault(config.velocity, 0);
-    this._lastVelocity = withDefault(config.velocity, 0);
-    this._toValue = config.toValue;
-    this._delay = withDefault(config.delay, 0);
-    this._useNativeDriver = shouldUseNativeDriver(config);
-    this.__isInteraction =
-      config.isInteraction !== undefined ? config.isInteraction : true;
-    this.__iterations = config.iterations !== undefined ? config.iterations : 1;
-
-    if (
-      config.stiffness !== undefined ||
-      config.damping !== undefined ||
-      config.mass !== undefined
-    ) {
-      invariant(
-        config.bounciness === undefined &&
-          config.speed === undefined &&
-          config.tension === undefined &&
-          config.friction === undefined,
-        'You can define one of bounciness/speed, tension/friction, or stiffness/damping/mass, but not more than one'
-      );
-      this._stiffness = withDefault(config.stiffness, 100);
-      this._damping = withDefault(config.damping, 10);
-      this._mass = withDefault(config.mass, 1);
-    } else if (config.bounciness !== undefined || config.speed !== undefined) {
-      // Convert the origami bounciness/speed values to stiffness/damping
-      // We assume mass is 1.
-      invariant(
-        config.tension === undefined &&
-          config.friction === undefined &&
-          config.stiffness === undefined &&
-          config.damping === undefined &&
-          config.mass === undefined,
-        'You can define one of bounciness/speed, tension/friction, or stiffness/damping/mass, but not more than one'
-      );
-      const springConfig = SpringConfig.fromBouncinessAndSpeed(
-        withDefault(config.bounciness, 8),
-        withDefault(config.speed, 12)
-      );
-      this._stiffness = springConfig.stiffness;
-      this._damping = springConfig.damping;
-      this._mass = 1;
-    } else {
-      // Convert the origami tension/friction values to stiffness/damping
-      // We assume mass is 1.
-      const springConfig = SpringConfig.fromOrigamiTensionAndFriction(
-        withDefault(config.tension, 40),
-        withDefault(config.friction, 7)
-      );
-      this._stiffness = springConfig.stiffness;
-      this._damping = springConfig.damping;
-      this._mass = 1;
-    }
-
-    invariant(this._stiffness > 0, 'Stiffness value must be greater than 0');
-    invariant(this._damping > 0, 'Damping value must be greater than 0');
-    invariant(this._mass > 0, 'Mass value must be greater than 0');
-  }
-
-  start(value) {
-    this._finished = new AnimatedValue(0);
-    const state = {
-      finished: this._finished,
-      velocity: this._initialVelocity,
-      position: value,
-      time: 0,
-    };
-
-    const config = {
-      damping: this._damping,
-      mass: this._mass,
-      stiffness: this._stiffness,
-      toValue: this._toValue,
-      overshootClamping: this._overshootClamping,
-      restSpeedThreshold: this._restSpeedThreshold,
-      restDisplacementThreshold: this._restDisplacementThreshold,
-    };
-
-    const step = new SpringNode(clock, state, config);
-    const detach = new AnimatedDetach(step);
-    const clb = finished => {
-      console.log('FINISHED', finished);
-    };
-    const call = new AnimatedOp([this._finished], ([finished]) =>
-      clb(finished)
-    );
-    const block = new AnimatedOp([detach, call], () => {});
-    new AnimatedOnChange(this._finished, block).__attach();
-    step.__attach();
-  }
-
-  stop() {
-    this._finished && this._finished.setValue(1);
-  }
-}

package/animations/TimingAnimation.js

@@ -1,70 +0,0 @@
-import AnimatedValue from '../nodes/AnimatedValue';
-import TimingStep from '../nodes/TimingStep';
-import Animation from './Animation';
-
-import { clock } from '../nodes/AnimatedClock';
-import AnimatedOnChange from '../nodes/AnimatedOnChange';
-import AnimatedDetach from '../nodes/AnimatedDetach';
-
-import { proxyAnimatedObject } from '../utils';
-import { shouldUseNativeDriver } from '../NativeAnimatedHelper';
-
-let _easeInOut;
-function easeInOut() {
-  if (!_easeInOut) {
-    const Easing = require('Easing');
-    _easeInOut = Easing.inOut(Easing.ease);
-  }
-  return _easeInOut;
-}
-
-export default class TimingAnimation extends Animation {
-  _startTime;
-  _fromValue;
-  _toValue;
-  _duration;
-  _delay;
-  _easing;
-  _onUpdate;
-  _animationFrame;
-  _timeout;
-  _useNativeDriver;
-
-  _finished;
-
-  constructor(config) {
-    super();
-    this._config = { ...config };
-    this._toValue = config.toValue;
-    this._easing = config.easing !== undefined ? config.easing : easeInOut();
-    this._duration = config.duration !== undefined ? config.duration : 500;
-    this._delay = config.delay !== undefined ? config.delay : 0;
-    this.__iterations = config.iterations !== undefined ? config.iterations : 1;
-    this.__isInteraction =
-      config.isInteraction !== undefined ? config.isInteraction : true;
-    this._useNativeDriver = shouldUseNativeDriver(config);
-  }
-
-  start(value) {
-    this._finished = new AnimatedValue(0);
-    const state = proxyAnimatedObject({
-      finished: this._finished,
-      position: value,
-      time: 0,
-      frameTime: 0,
-    });
-
-    const config = proxyAnimatedObject({
-      duration: this._duration,
-      toValue: this._toValue,
-    });
-
-    const step = new TimingStep(clock, state, config, this._easing);
-    new AnimatedOnChange(this._finished, new AnimatedDetach(step)).__attach();
-    step.__attach();
-  }
-
-  stop() {
-    this._finished && this._finished.setValue(1);
-  }
-}

package/bezier.js

@@ -1,128 +0,0 @@
-// These values are established by empiricism with tests (tradeoff: performance VS precision)
-var NEWTON_ITERATIONS = 4;
-var NEWTON_MIN_SLOPE = 0.001;
-var SUBDIVISION_PRECISION = 0.0000001;
-var SUBDIVISION_MAX_ITERATIONS = 10;
-
-var kSplineTableSize = 11;
-var kSampleStepSize = 1.0 / (kSplineTableSize - 1.0);
-
-var float32ArraySupported = typeof Float32Array === 'function';
-
-function A(aA1, aA2) {
-  return 1.0 - 3.0 * aA2 + 3.0 * aA1;
-}
-function B(aA1, aA2) {
-  return 3.0 * aA2 - 6.0 * aA1;
-}
-function C(aA1) {
-  return 3.0 * aA1;
-}
-
-// Returns x(t) given t, x1, and x2, or y(t) given t, y1, and y2.
-function calcBezier(aT, aA1, aA2) {
-  return ((A(aA1, aA2) * aT + B(aA1, aA2)) * aT + C(aA1)) * aT;
-}
-
-// Returns dx/dt given t, x1, and x2, or dy/dt given t, y1, and y2.
-function getSlope(aT, aA1, aA2) {
-  return 3.0 * A(aA1, aA2) * aT * aT + 2.0 * B(aA1, aA2) * aT + C(aA1);
-}
-
-function binarySubdivide(aX, aA, aB, mX1, mX2) {
-  var currentX,
-    currentT,
-    i = 0;
-  do {
-    currentT = aA + (aB - aA) / 2.0;
-    currentX = calcBezier(currentT, mX1, mX2) - aX;
-    if (currentX > 0.0) {
-      aB = currentT;
-    } else {
-      aA = currentT;
-    }
-  } while (
-    Math.abs(currentX) > SUBDIVISION_PRECISION &&
-    ++i < SUBDIVISION_MAX_ITERATIONS
-  );
-  return currentT;
-}
-
-function newtonRaphsonIterate(aX, aGuessT, mX1, mX2) {
-  for (var i = 0; i < NEWTON_ITERATIONS; ++i) {
-    var currentSlope = getSlope(aGuessT, mX1, mX2);
-    if (currentSlope === 0.0) {
-      return aGuessT;
-    }
-    var currentX = calcBezier(aGuessT, mX1, mX2) - aX;
-    aGuessT -= currentX / currentSlope;
-  }
-  return aGuessT;
-}
-
-export default function bezier(mX1, mY1, mX2, mY2) {
-  if (!(0 <= mX1 && mX1 <= 1 && 0 <= mX2 && mX2 <= 1)) {
-    // eslint-disable-line yoda
-    throw new Error('bezier x values must be in [0, 1] range');
-  }
-
-  // Precompute samples table
-  var sampleValues = float32ArraySupported
-    ? new Float32Array(kSplineTableSize)
-    : new Array(kSplineTableSize);
-  if (mX1 !== mY1 || mX2 !== mY2) {
-    for (var i = 0; i < kSplineTableSize; ++i) {
-      sampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2);
-    }
-  }
-
-  function getTForX(aX) {
-    var intervalStart = 0.0;
-    var currentSample = 1;
-    var lastSample = kSplineTableSize - 1;
-
-    for (
-      ;
-      currentSample !== lastSample && sampleValues[currentSample] <= aX;
-      ++currentSample
-    ) {
-      intervalStart += kSampleStepSize;
-    }
-    --currentSample;
-
-    // Interpolate to provide an initial guess for t
-    var dist =
-      (aX - sampleValues[currentSample]) /
-      (sampleValues[currentSample + 1] - sampleValues[currentSample]);
-    var guessForT = intervalStart + dist * kSampleStepSize;
-
-    var initialSlope = getSlope(guessForT, mX1, mX2);
-    if (initialSlope >= NEWTON_MIN_SLOPE) {
-      return newtonRaphsonIterate(aX, guessForT, mX1, mX2);
-    } else if (initialSlope === 0.0) {
-      return guessForT;
-    } else {
-      return binarySubdivide(
-        aX,
-        intervalStart,
-        intervalStart + kSampleStepSize,
-        mX1,
-        mX2
-      );
-    }
-  }
-
-  return function BezierEasing(x) {
-    if (mX1 === mY1 && mX2 === mY2) {
-      return x; // linear
-    }
-    // Because JavaScript number are imprecise, we should guarantee the extremes are right.
-    if (x === 0) {
-      return 0;
-    }
-    if (x === 1) {
-      return 1;
-    }
-    return calcBezier(getTForX(x), mY1, mY2);
-  };
-}

package/createAnimatedComponent.js

@@ -1,188 +0,0 @@
-import { AnimatedEvent } from './AnimatedEvent';
-import AnimatedProps from './nodes/AnimatedProps';
-import React from 'React';
-import ViewStylePropTypes from 'ViewStylePropTypes';
-
-import invariant from 'fbjs/lib/invariant';
-
-export default function createAnimatedComponent(Component) {
-  invariant(
-    typeof Component === 'stringy' ||
-      (Component.prototype && Component.prototype.isReactComponent),
-    '`createAnimatedComponent` does not support stateless functional components; ' +
-      'use a class component instead.'
-  );
-
-  class AnimatedComponent extends React.Component {
-    _invokeAnimatedPropsCallbackOnMount = false;
-
-    _eventDetachers = [];
-
-    static __skipSetNativeProps_FOR_TESTS_ONLY = false;
-
-    constructor(props) {
-      super(props);
-      this._setComponentRef = this._setComponentRef.bind(this);
-    }
-
-    componentWillUnmount() {
-      this._propsAnimated && this._propsAnimated.__detach();
-      this._detachNativeEvents();
-    }
-
-    setNativeProps(props) {
-      this._component.setNativeProps(props);
-    }
-
-    componentWillMount() {
-      this._attachProps(this.props);
-    }
-
-    componentDidMount() {
-      if (this._invokeAnimatedPropsCallbackOnMount) {
-        this._invokeAnimatedPropsCallbackOnMount = false;
-        this._animatedPropsCallback();
-      }
-
-      this._propsAnimated.setNativeView(this._component);
-      this._attachNativeEvents();
-    }
-
-    _attachNativeEvents() {
-      // Make sure to get the scrollable node for components that implement
-      // `ScrollResponder.Mixin`.
-      const scrollableNode = this._component.getScrollableNode
-        ? this._component.getScrollableNode()
-        : this._component;
-
-      for (const key in this.props) {
-        const prop = this.props[key];
-        if (prop instanceof AnimatedEvent && prop.__isNative) {
-          prop.__attach(scrollableNode, key);
-          this._eventDetachers.push(() => prop.__detach(scrollableNode, key));
-        }
-      }
-    }
-
-    _detachNativeEvents() {
-      this._eventDetachers.forEach(remove => remove());
-      this._eventDetachers = [];
-    }
-
-    // The system is best designed when setNativeProps is implemented. It is
-    // able to avoid re-rendering and directly set the attributes that changed.
-    // However, setNativeProps can only be implemented on leaf native
-    // components. If you want to animate a composite component, you need to
-    // re-render it. In this case, we have a fallback that uses forceUpdate.
-    _animatedPropsCallback = () => {
-      if (this._component == null) {
-        // AnimatedProps is created in will-mount because it's used in render.
-        // But this callback may be invoked before mount in async mode,
-        // In which case we should defer the setNativeProps() call.
-        // React may throw away uncommitted work in async mode,
-        // So a deferred call won't always be invoked.
-        this._invokeAnimatedPropsCallbackOnMount = true;
-      } else if (
-        AnimatedComponent.__skipSetNativeProps_FOR_TESTS_ONLY ||
-        typeof this._component.setNativeProps !== 'function'
-      ) {
-        this.forceUpdate();
-      } else if (!this._propsAnimated.__isNative) {
-        this._component.setNativeProps(this._propsAnimated.__getValue());
-      } else {
-        throw new Error(
-          'Attempting to run JS driven animation on animated ' +
-            'node that has been moved to "native" earlier by starting an ' +
-            'animation with `useNativeDriver: true`'
-        );
-      }
-    };
-
-    _attachProps(nextProps) {
-      const oldPropsAnimated = this._propsAnimated;
-
-      this._propsAnimated = new AnimatedProps(
-        nextProps,
-        this._animatedPropsCallback
-      );
-
-      // When you call detach, it removes the element from the parent list
-      // of children. If it goes to 0, then the parent also detaches itself
-      // and so on.
-      // An optimization is to attach the new elements and THEN detach the old
-      // ones instead of detaching and THEN attaching.
-      // This way the intermediate state isn't to go to 0 and trigger
-      // this expensive recursive detaching to then re-attach everything on
-      // the very next operation.
-      oldPropsAnimated && oldPropsAnimated.__detach();
-    }
-
-    componentWillReceiveProps(newProps) {
-      this._attachProps(newProps);
-    }
-
-    componentDidUpdate(prevProps) {
-      if (this._component !== this._prevComponent) {
-        this._propsAnimated.setNativeView(this._component);
-      }
-      if (this._component !== this._prevComponent || prevProps !== this.props) {
-        this._detachNativeEvents();
-        this._attachNativeEvents();
-      }
-    }
-
-    render() {
-      const props = this._propsAnimated.__getProps();
-      return (
-        <Component
-          {...props}
-          ref={this._setComponentRef}
-          // The native driver updates views directly through the UI thread so we
-          // have to make sure the view doesn't get optimized away because it cannot
-          // go through the NativeViewHierarchyManager since it operates on the shadow
-          // thread.
-          collapsable={
-            this._propsAnimated.__isNative ? false : props.collapsable
-          }
-        />
-      );
-    }
-
-    _setComponentRef(c) {
-      this._prevComponent = this._component;
-      this._component = c;
-    }
-
-    // A third party library can use getNode()
-    // to get the node reference of the decorated component
-    getNode() {
-      return this._component;
-    }
-  }
-
-  const propTypes = Component.propTypes;
-
-  AnimatedComponent.propTypes = {
-    style: function(props, propName, componentName) {
-      if (!propTypes) {
-        return;
-      }
-
-      for (const key in ViewStylePropTypes) {
-        if (!propTypes[key] && props[key] !== undefined) {
-          console.warn(
-            'You are setting the style `{ ' +
-              key +
-              ': ... }` as a prop. You ' +
-              'should nest it in a style object. ' +
-              'E.g. `{ style: { ' +
-              key +
-              ': ... } }`'
-          );
-        }
-      }
-    },
-  };
-
-  return AnimatedComponent;
-}

package/nodes/AnimatedBlock.js

@@ -1,19 +0,0 @@
-import AnimatedWithInput from './AnimatedWithInput';
-import { val } from '../utils';
-
-export default class AnimatedBlock extends AnimatedWithInput {
-  _array;
-
-  constructor(array) {
-    super(array);
-    this._array = array;
-  }
-
-  __onEvaluate() {
-    let result;
-    this._array.forEach(node => {
-      result = val(node);
-    });
-    return result;
-  }
-}

package/nodes/AnimatedClock.js

@@ -1,76 +0,0 @@
-import AnimatedValue from './AnimatedValue';
-import { val } from '../utils';
-
-class AnimatedMainClock extends AnimatedValue {
-  _frameCallback;
-
-  constructor() {
-    super(0);
-  }
-
-  _runFrame = () => {
-    this._updateValue(+new Date());
-    if (this.__children.length > 0) {
-      this._frameCallback = requestAnimationFrame(this._runFrame);
-    }
-  };
-
-  __attach() {
-    super.__attach();
-    if (!this._frameCallback) {
-      this._frameCallback = requestAnimationFrame(this._runFrame);
-    }
-  }
-
-  __detach() {
-    if (this._frameCallback) {
-      cancelAnimationFrame(this._frameCallback);
-      this._frameCallback = null;
-    }
-    super.__detach();
-  }
-}
-
-const mainClock = new AnimatedMainClock();
-
-export default class AnimatedClock extends AnimatedValue {
-  _started;
-  _attached;
-
-  __onEvaluate() {
-    return val(mainClock);
-  }
-
-  __attach() {
-    super.__attach();
-    if (this._started && !this._attached) {
-      mainClock.__addChild(this);
-    }
-    this._attached = true;
-  }
-
-  __detach() {
-    if (this._started && this._attached) {
-      mainClock.__removeChild(this);
-    }
-    this._attached = false;
-    super.__detach();
-  }
-
-  start() {
-    if (!this._started && this._attached) {
-      mainClock.__addChild(this);
-    }
-    this._started = true;
-  }
-
-  stop() {
-    if (this._started && this._attached) {
-      mainClock.__removeChild(this);
-    }
-    this._started = false;
-  }
-}
-
-const clock = mainClock;
-export { clock };

package/nodes/AnimatedCond.js

@@ -1,23 +0,0 @@
-import { val } from '../utils';
-import AnimatedWithInput from './AnimatedWithInput';
-
-export default class AnimatedCond extends AnimatedWithInput {
-  _condition;
-  _ifBlock;
-  _elseBlock;
-
-  constructor(condition, ifBlock, elseBlock) {
-    super([condition, ifBlock, elseBlock]);
-    this._condition = condition;
-    this._ifBlock = ifBlock;
-    this._elseBlock = elseBlock;
-  }
-
-  __onEvaluate() {
-    if (val(this._condition)) {
-      return val(this._ifBlock);
-    } else {
-      return this._elseBlock ? val(this._elseBlock) : undefined;
-    }
-  }
-}

package/nodes/AnimatedDetach.js

@@ -1,15 +0,0 @@
-import AnimatedNode from './AnimatedNode';
-
-export default class AnimatedDetach extends AnimatedNode {
-  _nodeToDetach;
-
-  constructor(nodeToDetach) {
-    super();
-    this._nodeToDetach = nodeToDetach;
-  }
-
-  __onEvaluate() {
-    this._nodeToDetach.__detach();
-    return 0;
-  }
-}