Skip to content

Instantly share code, notes, and snippets.

@pushkine
pushkine / cubicBezier.ts
Last active October 20, 2022 11:08
Cubic Bézier Javascript. Matches Apple WebKit/UnitBezier.h
/** MIT License github.com/pushkine/ */
function cubicBezier(x1: number, y1: number, x2: number, y2: number) {
if (!(x1 >= 0 && x1 <= 1 && x2 >= 0 && x2 <= 1))
throw new Error(`CubicBezier x1 & x2 values must be { 0 < x < 1 }, got { x1 : ${x1}, x2: ${x2} }`);
const ax = 1.0 - (x2 = 3.0 * (x2 - x1) - (x1 *= 3.0)) - x1,
ay = 1.0 - (y2 = 3.0 * (y2 - y1) - (y1 *= 3.0)) - y1;
let i = 0, r = 0.0, s = 0.0, d = 0.0, x = 0.0;
return (t: number) => {
for (r = t, i = 0; 32 > i; i++)
if (1e-5 > Math.abs((x = r * (r * (r * ax + x2) + x1) - t))) return r * (r * (r * ay + y2) + y1);
@pushkine
pushkine / spring.ts
Last active August 3, 2024 18:00
Javascript spring solving algorithm. Solves real life damped harmonic oscillator physics equations as used in Apple iOS & many others. Tweak damping and stiffness for spring behavior, scale mass with value delta and set soft to force solution for a critically damped spring ( no bounce eased smooth ) . Play with this function's graph on www.desmo…
/** MIT License github.com/pushkine/ */
interface SpringParams {
mass?: number; // = 1.0
damping?: number; // = 10.0
stiffness?: number; // = 100.0
soft?: boolean; // = false
}
type seconds = number;
@pushkine
pushkine / colors.ts
Last active August 26, 2024 04:35
Javascript color conversion algorithms. Complete HEX, HSL, RGB and named css color parsing & interpolation in the HCL color space. All constants directly sourced from the google/chromium open source project. Play, compare and benchmark against d3 on https://svelte.dev/repl/0a40a8348f8841d0b7007c58e4d9b54c
type RGBA = [number, number, number, number];
const rgb255 = (v: number) => (v < 255 ? (v > 0 ? v : 0) : 255);
const b1 = (v: number) => (v > 0.0031308 ? v ** (1 / 2.4) * 269.025 - 14.025 : v * 3294.6);
const b2 = (v: number) => (v > 0.2068965 ? v ** 3 : (v - 4 / 29) * (108 / 841));
const a1 = (v: number) => (v > 10.314724 ? ((v + 14.025) / 269.025) ** 2.4 : v / 3294.6);
const a2 = (v: number) => (v > 0.0088564 ? v ** (1 / 3) : v / (108 / 841) + 4 / 29);
function fromHCL(h: number, c: number, l: number): RGB {
const y = b2((l = (l + 16) / 116));
const x = b2(l + (c / 500) * Math.cos((h *= Math.PI / 180)));
@pushkine
pushkine / types.ts
Last active January 17, 2021 23:25
Collection of useful Typescript types
declare global {
interface ObjectConstructor {
keys<O extends object>(o: O): (keyof O & string)[];
}
}
/**
* Returns tuple types that include every string in union
* TupleUnion<keyof { bar: string; leet: number }>;
* ["bar", "leet"] | ["leet", "bar"];
@pushkine
pushkine / svelte.ts
Last active February 9, 2021 09:37
Accurate typings for Svelte's compiler output, includes comments for ambiguous properties and type functions for advanced use cases
interface LifecycleFunction {
(): void;
}
interface EventCallback<T = unknown> {
(event: CustomEvent<T>): void;
}
export namespace Svelte {
export interface Fragment {
key?: string | null;
first?: Comment | null;
@pushkine
pushkine / colors.cli.ts
Last active January 15, 2022 20:07
Styles and colors for CLIs in TypeScript. Try it on https://replit.com/@pushkine/ColdTautSpools#index.ts
/** MIT License github.com/pushkine */
export const color = (function <C extends readonly any[], M extends {}>(colors: C, mods: M) {
const fn = (c1: number, c2: number, str: string) => `\x1b[${c1}m${str}\x1b[${c2}m`;
const fnc = (c1: number, str: string) => fn(c1, 39, str.replace(/\x1b\[39m/g, `\x1b[${c1}m`));
const obj = { unstyle: (str: string) => str.replace(/\x1b\[[0-9]{1,2}m/g, ""), grey: fnc.bind(null, 90) };
for (let i = 0; i < colors.length; i++) obj[colors[i]] = fnc.bind(null, 30 + i);
for (const key in mods) obj["" + key] = fn.bind(null, mods[key][0], mods[key][1]);
return obj as { [K in C[any] | keyof M | keyof typeof obj]: (str: string) => string };
})(
["black", "red", "green", "yellow", "blue", "magenta", "cyan", "white"] as const,
@pushkine
pushkine / beep.ts
Created January 13, 2022 12:19
Beep javascript
function beep() {
const ctx = new AudioContext();
const oscillator = ctx.createOscillator();
const gainNode = ctx.createGain();
oscillator.connect(gainNode);
gainNode.connect(ctx.destination);
gainNode.gain.value = 0.25;
oscillator.frequency.value = 350;