feature: vor und nachteile

This commit is contained in:
Hikyu
2026-05-31 13:54:31 +02:00
parent 552a947a1c
commit e3dad17446
23270 changed files with 3024794 additions and 200 deletions
+1
View File
@@ -0,0 +1 @@
export declare function cubicBezier(mX1: number, mY1: number, mX2: number, mY2: number): import("./types").Easing;
+72
View File
@@ -0,0 +1,72 @@
import { linear } from ".";
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);
export 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);
}
//# sourceMappingURL=cubic-bezier.js.map
+15
View File
@@ -0,0 +1,15 @@
import { Easing } from "./types";
export declare const linear: Easing;
export declare const easeIn: Easing;
export declare const easeOut: Easing;
export declare const easeInOut: Easing;
export declare const circIn: Easing;
export declare const circOut: Easing;
export declare const circInOut: Easing;
export declare const backIn: Easing;
export declare const backOut: Easing;
export declare const backInOut: Easing;
export declare const anticipate: Easing;
export declare const bounceOut: (p: number) => number;
export declare const bounceIn: Easing;
export declare const bounceInOut: (p: number) => number;
+36
View File
@@ -0,0 +1,36 @@
import { createExpoIn, reverseEasing, mirrorEasing, createBackIn, createAnticipate, } from "./utils";
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;
export const linear = p => p;
export const easeIn = createExpoIn(2);
export const easeOut = reverseEasing(easeIn);
export const easeInOut = mirrorEasing(easeIn);
export const circIn = p => 1 - Math.sin(Math.acos(p));
export const circOut = reverseEasing(circIn);
export const circInOut = mirrorEasing(circOut);
export const backIn = createBackIn(DEFAULT_OVERSHOOT_STRENGTH);
export const backOut = reverseEasing(backIn);
export const backInOut = mirrorEasing(backIn);
export const anticipate = createAnticipate(DEFAULT_OVERSHOOT_STRENGTH);
const ca = 4356.0 / 361.0;
const cb = 35442.0 / 1805.0;
const cc = 16061.0 / 1805.0;
export 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;
};
export const bounceIn = reverseEasing(bounceOut);
export 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;
//# sourceMappingURL=index.js.map
+3
View File
@@ -0,0 +1,3 @@
import { Easing } from './types';
export declare type Direction = 'start' | 'end';
export declare const steps: (steps: number, direction?: Direction) => Easing;
+9
View File
@@ -0,0 +1,9 @@
import { clamp } from '../utils/clamp';
export 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);
};
//# sourceMappingURL=steps.js.map
+2
View File
@@ -0,0 +1,2 @@
export declare type Easing = (v: number) => number;
export declare type EasingModifier = (easing: Easing) => Easing;
+2
View File
@@ -0,0 +1,2 @@
export {};
//# sourceMappingURL=types.js.map
+6
View File
@@ -0,0 +1,6 @@
import { Easing, EasingModifier } from "./types";
export declare const reverseEasing: EasingModifier;
export declare const mirrorEasing: EasingModifier;
export declare const createExpoIn: (power: number) => Easing;
export declare const createBackIn: (power: number) => Easing;
export declare const createAnticipate: (power: number) => Easing;
+11
View File
@@ -0,0 +1,11 @@
export const reverseEasing = easing => p => 1 - easing(1 - p);
export const mirrorEasing = easing => p => p <= 0.5 ? easing(2 * p) / 2 : (2 - easing(2 * (1 - p))) / 2;
export const createExpoIn = (power) => p => Math.pow(p, power);
export const createBackIn = (power) => p => p * p * ((power + 1) * p - power);
export 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)));
};
//# sourceMappingURL=utils.js.map