diff --git a/package-lock.json b/package-lock.json index 1435410..65a7536 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "@kurkle/color", - "version": "0.2.0", + "version": "0.2.1", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "@kurkle/color", - "version": "0.2.0", + "version": "0.2.1", "license": "MIT", "devDependencies": { "assert": "^2.0.0", diff --git a/package.json b/package.json index 97a2168..c77fe98 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,6 @@ { "name": "@kurkle/color", - "version": "0.2.0", + "version": "0.2.1", "description": "css color parsing, manupulation and conversion", "main": "dist/color.js", "module": "dist/color.esm.js", diff --git a/src/color.js b/src/color.js index cb7cedd..7b7aa3c 100644 --- a/src/color.js +++ b/src/color.js @@ -7,7 +7,7 @@ import {b2n, n2b, round} from './byte'; import {hexParse, hexString} from './hex'; import {hsl2rgb, hslString, hueParse, rgb2hsl, rotate} from './hue'; import {nameParse} from './names'; -import {rgbMix, rgbParse, rgbString} from './rgb'; +import {rgbParse, rgbString} from './rgb'; import {interpolate} from './srgb'; /** @@ -156,7 +156,19 @@ export default class Color { */ mix(color, weight) { if (color) { - rgbMix(this._rgb, color._rgb, weight); + const c1 = this.rgb; + const c2 = color.rgb; + let w2; // using instead of undefined in the next line + const p = weight === w2 ? 0.5 : weight; + const w = 2 * p - 1; + const a = c1.a - c2.a; + const w1 = ((w * a === -1 ? w : (w + a) / (1 + w * a)) + 1) / 2.0; + w2 = 1 - w1; + c1.r = 0xFF & w1 * c1.r + w2 * c2.r + 0.5; + c1.g = 0xFF & w1 * c1.g + w2 * c2.g + 0.5; + c1.b = 0xFF & w1 * c1.b + w2 * c2.b + 0.5; + c1.a = p * c1.a + (1 - p) * c2.a; + this.rgb = c1; } return this; } diff --git a/src/rgb.js b/src/rgb.js index 09c86b0..107a31b 100644 --- a/src/rgb.js +++ b/src/rgb.js @@ -60,17 +60,3 @@ export function rgbString(v) { : `rgb(${v.r}, ${v.g}, ${v.b})` ); } - -/** - * Mix rgb2 to rgb1 by percent ratio (in place). - * @param {RGBA} rgb1 - the color (also the return value) - * @param {RGBA} rgb2 - the mixed color - * @param {number} t - 0..1 (default 0.5) - */ -export function rgbMix(rgb1, rgb2, t = 0.5) { - t = 1 - t; - rgb1.r = 0xFF & rgb1.r + t * (rgb2.r - rgb1.r) + 0.5; - rgb1.g = 0xFF & rgb1.g + t * (rgb2.g - rgb1.g) + 0.5; - rgb1.b = 0xFF & rgb1.b + t * (rgb2.b - rgb1.b) + 0.5; - rgb1.a = rgb1.a + t * (rgb2.a - rgb1.a); -}