@thednp/bezier-easing
Version:
🍬 A Typescript based cubic-bezier easing functions factory for KUTE.js based on UnitBezier
1 lines • 5.37 kB
Source Map (JSON)
{"version":3,"file":"bezier-easing.mjs","sources":["../src/index.ts"],"sourcesContent":["import type { BezierEasingFunction } from \"./easing-function\";\n\n/**\n * Creates cubic-bezier easing functions for animation engines.\n *\n * @see http://svn.webkit.org/repository/webkit/trunk/Source/WebCore/platform/graphics/UnitBezier.h\n *\n * @class\n */\nexport default class CubicBezier {\n public cx: number;\n public bx: number;\n public ax: number;\n public cy: number;\n public by: number;\n public ay: number;\n /**\n * @constructor\n * @param x1 - first point horizontal position\n * @param y1 - first point vertical position\n * @param x2 - second point horizontal position\n * @param y2 - second point vertical position\n * @param functionName - an optional function name\n * @returns a new CubicBezier easing function\n */\n constructor(\n x1?: number,\n y1?: number,\n x2?: number,\n y2?: number,\n functionName?: string,\n ) {\n // pre-calculate the polynomial coefficients\n // First and last control points are implied to be (0.0, 0.0) and (1.0, 1.0)\n const p1x = x1 || 0;\n const p1y = y1 || 0;\n const p2x = x2 || 1;\n const p2y = y2 || 1;\n const isNumber = (n: unknown): n is number => typeof n === \"number\";\n const allNumbers = [x1, y1, x2, y2].every(isNumber);\n const name = functionName\n ? functionName\n : allNumbers\n ? `cubic-bezier(${[p1x, p1y, p2x, p2y].join(\",\")})`\n : \"linear\";\n\n this.cx = 3 * p1x;\n this.bx = 3 * (p2x - p1x) - this.cx;\n this.ax = 1 - this.cx - this.bx;\n this.cy = 3 * p1y;\n this.by = 3 * (p2y - p1y) - this.cy;\n this.ay = 1 - this.cy - this.by;\n\n const BezierEasing = (t: number) => this.sampleCurveY(this.solveCurveX(t));\n\n // this function needs a name\n Object.defineProperty(BezierEasing, \"name\", { writable: true });\n BezierEasing.name = name;\n\n return BezierEasing as BezierEasingFunction;\n }\n\n /**\n * @param t - progress [0-1]\n * @return - sampled X value\n */\n sampleCurveX(t: number) {\n return ((this.ax * t + this.bx) * t + this.cx) * t;\n }\n\n /**\n * @param t - progress [0-1]\n * @return - sampled Y value\n */\n sampleCurveY(t: number) {\n return ((this.ay * t + this.by) * t + this.cy) * t;\n }\n\n /**\n * @param t - progress [0-1]\n * @return - sampled curve derivative X value\n */\n sampleCurveDerivativeX(t: number) {\n return (3 * this.ax * t + 2 * this.bx) * t + this.cx;\n }\n\n /**\n * @param x - progress [0-1]\n * @return - solved curve X value\n */\n solveCurveX(x: number) {\n // Set Precision\n const epsilon = 1e-6;\n\n // Skip values out of range\n if (x <= 0) return 0;\n if (x >= 1) return 1;\n\n let t2 = x;\n let x2 = 0;\n let d2 = 0;\n\n // First try a few iterations of Newton's method\n // -- usually very fast.\n for (let i = 0; i < 8; i += 1) {\n x2 = this.sampleCurveX(t2) - x;\n if (Math.abs(x2) < epsilon) return t2;\n d2 = this.sampleCurveDerivativeX(t2);\n /* istanbul ignore next @preserve */\n if (Math.abs(d2) < epsilon) break;\n t2 -= x2 / d2;\n }\n\n // No solution found - use bi-section\n let t0 = 0;\n let t1 = 1;\n t2 = x;\n\n while (t0 < t1) {\n x2 = this.sampleCurveX(t2);\n if (Math.abs(x2 - x) < epsilon) return t2;\n if (x > x2) t0 = t2;\n else t1 = t2;\n\n t2 = (t1 - t0) * 0.5 + t0;\n }\n\n // Give up\n /* istanbul ignore next @preserve */\n return t2;\n }\n}\n"],"names":["CubicBezier","x1","y1","x2","y2","functionName","__publicField","p1x","p1y","p2x","p2y","isNumber","n","allNumbers","name","BezierEasing","t","x","t2","d2","i","t0","t1"],"mappings":";;;AAGA,MAAqBA,EAAY;AAAA,EAQ/B,YACEC,GACAC,GACAC,GACAC,GACAC,GACA;AAbK,IAAAC,EAAA;AACA,IAAAA,EAAA;AACA,IAAAA,EAAA;AACA,IAAAA,EAAA;AACA,IAAAA,EAAA;AACA,IAAAA,EAAA;AAWL,UAAMC,IAAMN,KAAM,GACZO,IAAMN,KAAM,GACZO,IAAMN,KAAM,GACZO,IAAMN,KAAM,GACZO,IAAW,CAACC,MAA4B,OAAOA,KAAM,UACrDC,IAAa,CAACZ,GAAIC,GAAIC,GAAIC,CAAE,EAAE,MAAMO,CAAQ,GAC5CG,IAAOT,MAETQ,IACA,gBAAgB,CAACN,GAAKC,GAAKC,GAAKC,CAAG,EAAE,KAAK,GAAG,CAAC,MAC9C;AAEJ,SAAK,KAAK,IAAIH,GACd,KAAK,KAAK,KAAKE,IAAMF,KAAO,KAAK,IACjC,KAAK,KAAK,IAAI,KAAK,KAAK,KAAK,IAC7B,KAAK,KAAK,IAAIC,GACd,KAAK,KAAK,KAAKE,IAAMF,KAAO,KAAK,IACjC,KAAK,KAAK,IAAI,KAAK,KAAK,KAAK;AAEvB,UAAAO,IAAe,CAACC,MAAc,KAAK,aAAa,KAAK,YAAYA,CAAC,CAAC;AAGzE,kBAAO,eAAeD,GAAc,QAAQ,EAAE,UAAU,IAAM,GAC9DA,EAAa,OAAOD,GAEbC;AAAA,EAAA;AAAA,EAIT,aAAaC,GAAW;AACtB,aAAS,KAAK,KAAKA,IAAI,KAAK,MAAMA,IAAI,KAAK,MAAMA;AAAA,EAAA;AAAA,EAInD,aAAaA,GAAW;AACtB,aAAS,KAAK,KAAKA,IAAI,KAAK,MAAMA,IAAI,KAAK,MAAMA;AAAA,EAAA;AAAA,EAInD,uBAAuBA,GAAW;AACxB,YAAA,IAAI,KAAK,KAAKA,IAAI,IAAI,KAAK,MAAMA,IAAI,KAAK;AAAA,EAAA;AAAA,EAIpD,YAAYC,GAAW;AAKjB,QAAAA,KAAK,EAAU,QAAA;AACf,QAAAA,KAAK,EAAU,QAAA;AAEnB,QAAIC,IAAKD,GACLd,IAAK,GACLgB,IAAK;AAIT,aAASC,IAAI,GAAGA,IAAI,GAAGA,KAAK,GAAG;AAE7B,UADKjB,IAAA,KAAK,aAAae,CAAE,IAAID,GACzB,KAAK,IAAId,CAAE,IAAI,KAAgB,QAAAe;AAGnC,UAFKC,IAAA,KAAK,uBAAuBD,CAAE,GAE/B,KAAK,IAAIC,CAAE,IAAI,KAAS;AAC5B,MAAAD,KAAMf,IAAKgB;AAAA,IAAA;AAIb,QAAIE,IAAK,GACLC,IAAK;AAGT,SAFKJ,IAAAD,GAEEI,IAAKC,KAAI;AAEd,UADKnB,IAAA,KAAK,aAAae,CAAE,GACrB,KAAK,IAAIf,IAAKc,CAAC,IAAI,KAAgB,QAAAC;AACnC,MAAAD,IAAId,IAASkB,IAAAH,IACPI,IAAAJ,GAEJA,KAAAI,IAAKD,KAAM,MAAMA;AAAA,IAAA;AAKlB,WAAAH;AAAA,EAAA;AAEX;"}