responsive changes
This commit is contained in:
-74
@@ -1,74 +0,0 @@
|
||||
import { linear } from './index.mjs';
|
||||
|
||||
const a = (a1, a2) => 1.0 - 3.0 * a2 + 3.0 * a1;
|
||||
const b = (a1, a2) => 3.0 * a2 - 6.0 * a1;
|
||||
const c = (a1) => 3.0 * a1;
|
||||
const calcBezier = (t, a1, a2) => ((a(a1, a2) * t + b(a1, a2)) * t + c(a1)) * t;
|
||||
const getSlope = (t, a1, a2) => 3.0 * a(a1, a2) * t * t + 2.0 * b(a1, a2) * t + c(a1);
|
||||
const subdivisionPrecision = 0.0000001;
|
||||
const subdivisionMaxIterations = 10;
|
||||
function binarySubdivide(aX, aA, aB, mX1, mX2) {
|
||||
let currentX;
|
||||
let currentT;
|
||||
let 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) > subdivisionPrecision &&
|
||||
++i < subdivisionMaxIterations);
|
||||
return currentT;
|
||||
}
|
||||
const newtonIterations = 8;
|
||||
const newtonMinSlope = 0.001;
|
||||
function newtonRaphsonIterate(aX, aGuessT, mX1, mX2) {
|
||||
for (let i = 0; i < newtonIterations; ++i) {
|
||||
const currentSlope = getSlope(aGuessT, mX1, mX2);
|
||||
if (currentSlope === 0.0) {
|
||||
return aGuessT;
|
||||
}
|
||||
const currentX = calcBezier(aGuessT, mX1, mX2) - aX;
|
||||
aGuessT -= currentX / currentSlope;
|
||||
}
|
||||
return aGuessT;
|
||||
}
|
||||
const kSplineTableSize = 11;
|
||||
const kSampleStepSize = 1.0 / (kSplineTableSize - 1.0);
|
||||
function cubicBezier(mX1, mY1, mX2, mY2) {
|
||||
if (mX1 === mY1 && mX2 === mY2)
|
||||
return linear;
|
||||
const sampleValues = new Float32Array(kSplineTableSize);
|
||||
for (let i = 0; i < kSplineTableSize; ++i) {
|
||||
sampleValues[i] = calcBezier(i * kSampleStepSize, mX1, mX2);
|
||||
}
|
||||
function getTForX(aX) {
|
||||
let intervalStart = 0.0;
|
||||
let currentSample = 1;
|
||||
const lastSample = kSplineTableSize - 1;
|
||||
for (; currentSample !== lastSample && sampleValues[currentSample] <= aX; ++currentSample) {
|
||||
intervalStart += kSampleStepSize;
|
||||
}
|
||||
--currentSample;
|
||||
const dist = (aX - sampleValues[currentSample]) /
|
||||
(sampleValues[currentSample + 1] - sampleValues[currentSample]);
|
||||
const guessForT = intervalStart + dist * kSampleStepSize;
|
||||
const initialSlope = getSlope(guessForT, mX1, mX2);
|
||||
if (initialSlope >= newtonMinSlope) {
|
||||
return newtonRaphsonIterate(aX, guessForT, mX1, mX2);
|
||||
}
|
||||
else if (initialSlope === 0.0) {
|
||||
return guessForT;
|
||||
}
|
||||
else {
|
||||
return binarySubdivide(aX, intervalStart, intervalStart + kSampleStepSize, mX1, mX2);
|
||||
}
|
||||
}
|
||||
return (t) => t === 0 || t === 1 ? t : calcBezier(getTForX(t), mY1, mY2);
|
||||
}
|
||||
|
||||
export { cubicBezier };
|
||||
-38
@@ -1,38 +0,0 @@
|
||||
import { createExpoIn, reverseEasing, mirrorEasing, createBackIn, createAnticipate } from './utils.mjs';
|
||||
|
||||
const DEFAULT_OVERSHOOT_STRENGTH = 1.525;
|
||||
const BOUNCE_FIRST_THRESHOLD = 4.0 / 11.0;
|
||||
const BOUNCE_SECOND_THRESHOLD = 8.0 / 11.0;
|
||||
const BOUNCE_THIRD_THRESHOLD = 9.0 / 10.0;
|
||||
const linear = p => p;
|
||||
const easeIn = createExpoIn(2);
|
||||
const easeOut = reverseEasing(easeIn);
|
||||
const easeInOut = mirrorEasing(easeIn);
|
||||
const circIn = p => 1 - Math.sin(Math.acos(p));
|
||||
const circOut = reverseEasing(circIn);
|
||||
const circInOut = mirrorEasing(circOut);
|
||||
const backIn = createBackIn(DEFAULT_OVERSHOOT_STRENGTH);
|
||||
const backOut = reverseEasing(backIn);
|
||||
const backInOut = mirrorEasing(backIn);
|
||||
const anticipate = createAnticipate(DEFAULT_OVERSHOOT_STRENGTH);
|
||||
const ca = 4356.0 / 361.0;
|
||||
const cb = 35442.0 / 1805.0;
|
||||
const cc = 16061.0 / 1805.0;
|
||||
const bounceOut = (p) => {
|
||||
if (p === 1 || p === 0)
|
||||
return p;
|
||||
const p2 = p * p;
|
||||
return p < BOUNCE_FIRST_THRESHOLD
|
||||
? 7.5625 * p2
|
||||
: p < BOUNCE_SECOND_THRESHOLD
|
||||
? 9.075 * p2 - 9.9 * p + 3.4
|
||||
: p < BOUNCE_THIRD_THRESHOLD
|
||||
? ca * p2 - cb * p + cc
|
||||
: 10.8 * p * p - 20.52 * p + 10.72;
|
||||
};
|
||||
const bounceIn = reverseEasing(bounceOut);
|
||||
const bounceInOut = (p) => p < 0.5
|
||||
? 0.5 * (1.0 - bounceOut(1.0 - p * 2.0))
|
||||
: 0.5 * bounceOut(p * 2.0 - 1.0) + 0.5;
|
||||
|
||||
export { anticipate, backIn, backInOut, backOut, bounceIn, bounceInOut, bounceOut, circIn, circInOut, circOut, easeIn, easeInOut, easeOut, linear };
|
||||
-11
@@ -1,11 +0,0 @@
|
||||
import { clamp } from '../utils/clamp.mjs';
|
||||
|
||||
const steps = (steps, direction = 'end') => (progress) => {
|
||||
progress =
|
||||
direction === 'end' ? Math.min(progress, 0.999) : Math.max(progress, 0.001);
|
||||
const expanded = progress * steps;
|
||||
const rounded = direction === 'end' ? Math.floor(expanded) : Math.ceil(expanded);
|
||||
return clamp(0, 1, rounded / steps);
|
||||
};
|
||||
|
||||
export { steps };
|
||||
-12
@@ -1,12 +0,0 @@
|
||||
const reverseEasing = easing => p => 1 - easing(1 - p);
|
||||
const mirrorEasing = easing => p => p <= 0.5 ? easing(2 * p) / 2 : (2 - easing(2 * (1 - p))) / 2;
|
||||
const createExpoIn = (power) => p => Math.pow(p, power);
|
||||
const createBackIn = (power) => p => p * p * ((power + 1) * p - power);
|
||||
const createAnticipate = (power) => {
|
||||
const backEasing = createBackIn(power);
|
||||
return p => (p *= 2) < 1
|
||||
? 0.5 * backEasing(p)
|
||||
: 0.5 * (2 - Math.pow(2, -10 * (p - 1)));
|
||||
};
|
||||
|
||||
export { createAnticipate, createBackIn, createExpoIn, mirrorEasing, reverseEasing };
|
||||
Reference in New Issue
Block a user