my-animation-lib/src/utils/Easing.js

A powerful animation library combining Three.js, GSAP, custom scroll triggers, and advanced effects with MathUtils integration

export class Easing {
  static linear(t) {
    return t;
  }

  static easeInQuad(t) {
    return t * t;
  }

  static easeOutQuad(t) {
    return t * (2 - t);
  }

  static easeInOutQuad(t) {
    return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t;
  }

  static easeInCubic(t) {
    return t * t * t;
  }

  static easeOutCubic(t) {
    return (--t) * t * t + 1;
  }

  static easeInOutCubic(t) {
    return t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1;
  }

  static easeInQuart(t) {
    return t * t * t * t;
  }

  static easeOutQuart(t) {
    return 1 - (--t) * t * t * t;
  }

  static easeInOutQuart(t) {
    return t < 0.5 ? 8 * t * t * t * t : 1 - 8 * (--t) * t * t * t;
  }

  static easeInSine(t) {
    return 1 - Math.cos(t * Math.PI / 2);
  }

  static easeOutSine(t) {
    return Math.sin(t * Math.PI / 2);
  }

  static easeInOutSine(t) {
    return -(Math.cos(Math.PI * t) - 1) / 2;
  }

  static easeInExpo(t) {
    return t === 0 ? 0 : Math.pow(2, 10 * t - 10);
  }

  static easeOutExpo(t) {
    return t === 1 ? 1 : 1 - Math.pow(2, -10 * t);
  }

  static easeInOutExpo(t) {
    if (t === 0) return 0;
    if (t === 1) return 1;
    if (t < 0.5) return Math.pow(2, 20 * t - 10) / 2;
    return (2 - Math.pow(2, -20 * t + 10)) / 2;
  }

  static easeInCirc(t) {
    return 1 - Math.sqrt(1 - t * t);
  }

  static easeOutCirc(t) {
    return Math.sqrt(1 - (t - 1) * (t - 1));
  }

  static easeInOutCirc(t) {
    if (t < 0.5) return (1 - Math.sqrt(1 - (2 * t) * (2 * t))) / 2;
    return (Math.sqrt(1 - Math.pow(-2 * t + 2, 2)) + 1) / 2;
  }

  static easeInBack(t) {
    const c1 = 1.70158;
    const c3 = c1 + 1;
    return c3 * t * t * t - c1 * t * t;
  }

  static easeOutBack(t) {
    const c1 = 1.70158;
    const c3 = c1 + 1;
    return 1 + c3 * Math.pow(t - 1, 3) + c1 * Math.pow(t - 1, 2);
  }

  static easeInOutBack(t) {
    const c1 = 1.70158;
    const c2 = c1 * 1.525;
    if (t < 0.5) return (Math.pow(2 * t, 2) * ((c2 + 1) * 2 * t - c2)) / 2;
    return (Math.pow(2 * t - 2, 2) * ((c2 + 1) * (t * 2 - 2) + c2) + 2) / 2;
  }

  static easeInElastic(t) {
    if (t === 0) return 0;
    if (t === 1) return 1;
    return -Math.pow(2, 10 * t - 10) * Math.sin((t * 10 - 10.75) * ((2 * Math.PI) / 3));
  }

  static easeOutElastic(t) {
    if (t === 0) return 0;
    if (t === 1) return 1;
    return Math.pow(2, -10 * t) * Math.sin((t * 10 - 0.75) * ((2 * Math.PI) / 3)) + 1;
  }

  static easeInOutElastic(t) {
    if (t === 0) return 0;
    if (t === 1) return 1;
    if (t < 0.5) return -(Math.pow(2, 20 * t - 10) * Math.sin((20 * t - 11.125) * ((2 * Math.PI) / 4.5))) / 2;
    return (Math.pow(2, -20 * t + 10) * Math.sin((20 * t - 11.125) * ((2 * Math.PI) / 4.5))) / 2 + 1;
  }

  static easeInBounce(t) {
    return 1 - Easing.easeOutBounce(1 - t);
  }

  static easeOutBounce(t) {
    if (t < 1 / 2.75) {
      return 7.5625 * t * t;
    } else if (t < 2 / 2.75) {
      return 7.5625 * (t -= 1.5 / 2.75) * t + 0.75;
    } else if (t < 2.5 / 2.75) {
      return 7.5625 * (t -= 2.25 / 2.75) * t + 0.9375;
    } else {
      return 7.5625 * (t -= 2.625 / 2.75) * t + 0.984375;
    }
  }

  static easeInOutBounce(t) {
    if (t < 0.5) return Easing.easeInBounce(2 * t) / 2;
    return Easing.easeOutBounce(2 * t - 1) / 2 + 0.5;
  }

  // Custom easing functions
  static custom(points) {
    return (t) => {
      if (t <= 0) return points[0];
      if (t >= 1) return points[points.length - 1];
      
      const index = t * (points.length - 1);
      const lowerIndex = Math.floor(index);
      const upperIndex = Math.ceil(index);
      const weight = index - lowerIndex;
      
      if (lowerIndex === upperIndex) return points[lowerIndex];
      
      return points[lowerIndex] * (1 - weight) + points[upperIndex] * weight;
    };
  }

  // Bezier curve easing
  static bezier(p1x, p1y, p2x, p2y) {
    return (t) => {
      if (t === 0 || t === 1) return t;
      
      const cx = 3 * p1x;
      const bx = 3 * (p2x - p1x) - cx;
      const ax = 1 - cx - bx;
      const cy = 3 * p1y;
      const by = 3 * (p2y - p1y) - cy;
      const ay = 1 - cy - by;
      
      const sampleCurveX = (t) => ((ax * t + bx) * t + cx) * t;
      const sampleCurveY = (t) => ((ay * t + by) * t + cy) * t;
      const sampleCurveDerivativeX = (t) => (3 * ax * t + 2 * bx) * t + cx;
      
      const solveCurveX = (x, epsilon) => {
        let t0, t1, t2, x2, d2, i;
        
        for (t2 = x, i = 0; i < 8; i++) {
          x2 = sampleCurveX(t2) - x;
          if (Math.abs(x2) < epsilon) return t2;
          d2 = sampleCurveDerivativeX(t2);
          if (Math.abs(d2) < 1e-6) break;
          t2 = t2 - x2 / d2;
        }
        
        t0 = 0;
        t1 = 1;
        t2 = x;
        
        if (t2 < t0) return t0;
        if (t2 > t1) return t1;
        
        while (t0 < t1) {
          x2 = sampleCurveX(t2);
          if (Math.abs(x2 - x) < epsilon) return t2;
          if (x > x2) t0 = t2;
          else t1 = t2;
          t2 = (t1 - t0) * 0.5 + t0;
        }
        
        return t2;
      };
      
      return sampleCurveY(solveCurveX(x, 1e-6));
    };
  }
}