UnitBezier.h rewritten in JavaScript https://chromium.googlesource.com/chromium/blink/+/master/Source/platform/animation/UnitBezier.h

UnitBezier.es6.js

'use strict';

/*
 * Copyright (C) 2008 Apple Inc. All Rights Reserved.
 *
 * Redistribution and use in source and binary forms, with or without
 * modification, are permitted provided that the following conditions
 * are met:
 * 1. Redistributions of source code must retain the above copyright
 *    notice, this list of conditions and the following disclaimer.
 * 2. Redistributions in binary form must reproduce the above copyright
 *    notice, this list of conditions and the following disclaimer in the
 *    documentation and/or other materials provided with the distribution.
 *
 * THIS SOFTWARE IS PROVIDED BY APPLE INC. ``AS IS'' AND ANY
 * EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT LIMITED TO, THE
 * IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR A PARTICULAR
 * PURPOSE ARE DISCLAIMED.  IN NO EVENT SHALL APPLE INC. OR
 * CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL, SPECIAL,
 * EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT LIMITED TO,
 * PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE, DATA, OR
 * PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY THEORY
 * OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
 * (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
 * OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE.
 */

export default class UnitBezier {
  constructor(x1, y1, x2, y2) {
    // Calculate the polynomial coefficients, implicit first and last control points are (0,0) and (1,1).
    this.cx = 3 * x1;
    this.bx = 3 * (x2 - x1) - this.cx;
    this.ax = 1 - this.cx - this.bx;

    this.cy = 3 * y1;
    this.by = 3 * (y2 - y1) - this.cy;
    this.ay = 1 - this.cy - this.by;

    // End-point gradients are used to calculate timing function results
    // outside the range [0, 1].
    //
    // There are three possibilities for the gradient at each end:
    // (1) the closest control point is not horizontally coincident with regard to
    //     (0, 0) or (1, 1). In this case the line between the end point and
    //     the control point is tangent to the bezier at the end point.
    // (2) the closest control point is coincident with the end point. In
    //     this case the line between the end point and the far control
    //     point is tangent to the bezier at the end point.
    // (3) the closest control point is horizontally coincident with the end
    //     point, but vertically distinct. In this case the gradient at the
    //     end point is Infinite. However, this causes issues when
    //     interpolating. As a result, we break down to a simple case of
    //     0 gradient under these conditions.
    if (x1 > 0) {
      this.startGradient = y1 / x1;
    } else if (!y1 && x2 > 0) {
      this.startGradient = y2 / x2;
    } else {
      this.startGradient = 0;
    }

    if (x2 < 1) {
      this.endGradient = (y2 - 1) / (x2 - 1);
    } else if (p2x === 1 && x1 < 1) {
      this.endGradient = (y1 - 1) / (x1 - 1);
    } else {
      this.endGradient = 0;
    }
  }

  sampleCurveX(t) {
    // `ax t^3 + bx t^2 + cx t' expanded using Horner's rule.
    return ((this.ax * t + this.bx) * t + this.cx) * t;
  }

  sampleCurveY(t) {
    return ((this.ay * t + this.by) * t + this.cy) * t;
  }

  sampleCurveDerivativeX(t) {
    return (3 * this.ax * t + 2 * this.bx) * t + this.cx;
  }

  // Given an x value, find a parametric value it came from.
  solveCurveX(x, epsilon) {
    let t0, t1, t2, x2, d2, i;

    // First try a few iterations of Newton's method -- normally very fast.
    for (t2 = x, i = 0; i < 8; i++) {
      x2 = this.sampleCurveX(t2) - x;

      if (Math.abs(x2) < epsilon) {
        return t2;
      }

      d2 = this.sampleCurveDerivativeX(t2);

      if (Math.abs(d2) < 0.000001) {
        break;
      }

      t2 = t2 - x2 / d2;
    }

    // Fall back to the bisection method for reliability.
    t0 = 0;
    t1 = 1;
    t2 = x;

    while (t0 < t1) {
      x2 = this.sampleCurveX(t2);

      if (Math.abs(x2 - x) < epsilon) {
        return t2;
      }

      if (x > x2) {
        t0 = t2;
      } else {
        t1 = t2;
      }

      t2 = (t1 - t0) * 0.5 + t0;
    }

    // Failure.
    return t2;
  }

  // Evaluates y at the given x. The epsilon parameter provides a hint as to the required
  // accuracy and is not guaranteed.
  solve(x, epsilon) {
    if (x <= 0) {
      return this.startGradient * x;
    }

    if (x >= 1) {
      return 1 + this.endGradient * (x - 1);
    }

    return this.sampleCurveY(this.solveCurveX(x, epsilon));
  }
}