ts-useful/lib/es2020/colorPercent.js

Functions for animation, color transitions, ecliptic, bezier, decasteljau, curves, three dimensional curves, smooth scrolling, random range, randomItem, mobius index, vectors, physics vectors, and easing.

import { ColorVect } from './abstract/colorVect';
import { calculateStep } from './calculateStep';
import { Clamp } from './clamp';
import { tau } from './constants';
import { Lerp } from './lerp';
export class ColorPercent extends Array {
}
ColorPercent.regexArray = [
    // #a0b1c2
    { regex: /#([a-f0-9]{2})([a-f0-9]{2})([a-f0-9]{2})/i,
        converter: (e) => [parseInt(e[1].toString(), 16), parseInt(e[2].toString(), 16), parseInt(e[3].toString(), 16)] },
    // #fff
    { regex: /#([a-f0-9])([a-f0-9])([a-f0-9])/i,
        converter: (e) => [parseInt(e[1] + e[1], 16), parseInt(e[2] + e[2], 16), parseInt(e[3] + e[3], 16)] },
    // rgb(num,num,num)
    { regex: /rgb\(\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*,\s*([0-9]{1,3})\s*\)/,
        converter: (e) => [parseInt(e[1], 10), parseInt(e[2], 10), parseInt(e[3], 10)] },
    // rgb(num%,num%,num%)
    { regex: /rgb\(\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*,\s*([0-9]+(?:\.[0-9]+)?)\%\s*\)/,
        converter: (e) => [parseFloat(e[1]) * 2.55, parseFloat(e[2]) * 2.55, parseFloat(e[3]) * 2.55] }
];
ColorPercent.getRgb = (color) => {
    const rxc = ColorPercent.regexArray.find((rx) => rx.regex.test(color));
    if (rxc)
        return rxc.converter(rxc.regex.exec(color));
    throw new Error(`getRgb Invalid color: ${color}`);
};
ColorPercent.colorDecToHex = (r, g, b) => `#${(1 << 24 | (r << 16) | (g << 8) | (b << 0)).toString(16).slice(1)}`;
/**
 *
 * @param colorList string[]: ['#ff0000', '#0000FF']
 * @param percent number: .03
 * @returns hex color.
 */
ColorPercent.getColor = (colorList, percent) => {
    const stepInfo = calculateStep(colorList, percent);
    const color = (position) => {
        const [startColor, endColor] = [ColorPercent.getRgb(stepInfo.current), ColorPercent.getRgb(stepInfo.next)];
        return Math.floor(Lerp(startColor[position], endColor[position], stepInfo.percent));
    };
    return ColorPercent.colorDecToHex(color(0), color(1), color(2));
};
/**
 *
 * @param t number (float)
 * @param a vector3
 * @param b vector3
 * @param c vector3
 * @param d vector3
 * @returns Hex string
 */
ColorPercent.makePalette = (t, a, b, c, d) => {
    const calced = ColorVect.multiplyBy(ColorVect.multiply(c, ColorVect.addBy(d, t)), tau).map((v) => {
        return Math.cos(v);
    });
    const rgb = ColorVect.multiply(ColorVect.add(a, b), calced).map((v) => Math.floor(Clamp(Math.abs(v), 0, 1) * 100));
    const colorString = `rgb(${rgb[0]}%, ${rgb[1]}%, ${rgb[2]}%)`;
    const result = ColorPercent.getRgb(colorString);
    return ColorPercent.colorDecToHex(result[0], result[1], result[2]);
};
ColorPercent.lighen = (color, percent) => {
    return ColorPercent.getColor([color, '#FFFFFF'], percent);
};
ColorPercent.darken = (color, percent) => {
    return ColorPercent.getColor([color, '#000000'], percent);
};
//# sourceMappingURL=colorPercent.js.map