Refactor color picker floating menu (#809)

* Move FloatingMenu template component

* Rewrite the ColorPicker component so it's not horrifically bad code

* Move FloatingMenu into the ColorPicker component

* Little Imaginate fixes

* Add todo
This commit is contained in:
Keavon Chambers
2022-10-23 17:29:04 -07:00
parent 1219e26d17
commit 7f9c59dd99
14 changed files with 177 additions and 290 deletions
-58
View File
@@ -1,58 +0,0 @@
import { type HSVA, type RGBA } from "@/wasm-communication/messages";
export function hsvaToRgba(hsva: HSVA): RGBA {
const { h, s, v, a } = hsva;
const hue = h * 6;
const hueIntegerPart = Math.floor(hue);
const hueFractionalPart = hue - hueIntegerPart;
const hueIntegerMod6 = hueIntegerPart % 6;
const p = v * (1 - s);
const q = v * (1 - hueFractionalPart * s);
const t = v * (1 - (1 - hueFractionalPart) * s);
const r = Math.round([v, q, p, p, t, v][hueIntegerMod6]);
const g = Math.round([t, v, v, q, p, p][hueIntegerMod6]);
const b = Math.round([p, p, t, v, v, q][hueIntegerMod6]);
return { r, g, b, a };
}
export function rgbaToHsva(rgba: RGBA): HSVA {
const { r, g, b, a } = rgba;
const max = Math.max(r, g, b);
const min = Math.min(r, g, b);
const d = max - min;
const s = max === 0 ? 0 : d / max;
const v = max;
let h = 0;
if (max !== min) {
switch (max) {
case r:
h = (g - b) / d + (g < b ? 6 : 0);
break;
case g:
h = (b - r) / d + 2;
break;
case b:
h = (r - g) / d + 4;
break;
default:
}
h /= 6;
}
return { h, s, v, a };
}
export function rgbaToDecimalRgba(rgba: RGBA): RGBA {
const r = rgba.r / 255;
const g = rgba.g / 255;
const b = rgba.b / 255;
return { r, g, b, a: rgba.a };
}