diff --git a/ui/src/shared/constants/colorOperations.js b/ui/src/shared/constants/colorOperations.js index 0219ae1d29..3c745c904f 100644 --- a/ui/src/shared/constants/colorOperations.js +++ b/ui/src/shared/constants/colorOperations.js @@ -108,86 +108,3 @@ export const generateThresholdsListHexs = ({ const textColor = baseColor.hex return {bgColor, textColor} } - -// Handy tool for converting Hexcodes to HSL values -export const HexcodeToHSL = hex => { - const result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex) - - const red = parseInt(result[1], 16) / 255 - const green = parseInt(result[2], 16) / 255 - const blue = parseInt(result[3], 16) / 255 - const max = Math.max(red, green, blue) - const min = Math.min(red, green, blue) - - let hue, - saturation, - lightness = (max + min) / 2 - - if (max === min) { - hue = saturation = 0 // achromatic - } else { - const d = max - min - saturation = lightness > 0.5 ? d / (2 - max - min) : d / (max + min) - switch (max) { - case red: - hue = (green - blue) / d + (green < blue ? 6 : 0) - break - case green: - hue = (blue - red) / d + 2 - break - case blue: - hue = (red - green) / d + 4 - break - } - hue /= 6 - } - - hue = Math.round(360 * hue) - saturation = Math.round(saturation * 100) - lightness = Math.round(lightness * 100) - - return {hue, saturation, lightness} -} - -// Handy tool for converting HSL values to Hexcode -export const HSLToHexcode = (hue, saturation, lightness) => { - hue /= 360 - saturation /= 100 - lightness /= 100 - let red, green, blue - if (saturation === 0) { - red = green = blue = lightness // achromatic - } else { - const hue2rgb = (p, q, t) => { - if (t < 0) { - t += 1 - } - if (t > 1) { - t -= 1 - } - if (t < 1 / 6) { - return p + (q - p) * 6 * t - } - if (t < 1 / 2) { - return q - } - if (t < 2 / 3) { - return p + (q - p) * (2 / 3 - t) * 6 - } - return p - } - const q = - lightness < 0.5 - ? lightness * (1 + saturation) - : lightness + saturation - lightness * saturation - const p = 2 * lightness - q - red = hue2rgb(p, q, hue + 1 / 3) - green = hue2rgb(p, q, hue) - blue = hue2rgb(p, q, hue - 1 / 3) - } - const toHex = x => { - const hex = Math.round(x * 255).toString(16) - return hex.length === 1 ? `0${hex}` : hex - } - return `#${toHex(red)}${toHex(green)}${toHex(blue)}` -}