Color Tranformations

function hexToRGB(h) {
  let r = "0", g = "0", b = "0";
  if (hex.length == 4) {
    r = "0x" + hex[1] + hex[1];
    g = "0x" + hex[2] + hex[2];
    b = "0x" + hex[3] + hex[3];
  } else if (hex.length == 7) {
    r = "0x" + hex[1] + hex[2];
    g = "0x" + hex[3] + hex[4];
    b = "0x" + hex[5] + hex[6];
  }
  return "rgb("+ +r + "," + +g + "," + +b + ")";
}

function RGBToHex(r,g,b) {
  r = r.toString(16);
  g = g.toString(16);
  b = b.toString(16);

  if (r.length == 1)
    r = "0" + r;
  if (g.length == 1)
    g = "0" + g;
  if (b.length == 1)
    b = "0" + b;

  return "#" + r + g + b;
}

function RGBToHSL(r,g,b) {
   // Then to HSL
  const rInt = parseInt(r, 16) / 255;
  const gInt = parseInt(g, 16) / 255;
  const bInt = parseInt(b, 16) / 255;
  let cmin = Math.min(rInt,gInt,bInt),
      cmax = Math.max(rInt,gInt,bInt),
      delta = cmax - cmin,
      h = 0,
      s = 0,
      l = 0;

  if (delta == 0)
    h = 0;
  else if (cmax == rInt)
    h = ((gInt - bInt) / delta) % 6;
  else if (cmax == gInt)
    h = (bInt - rInt) / delta + 2;
  else
    h = (rInt - gInt) / delta + 4;

  h = Math.round(h * 60);

  if (h < 0)
    h += 360;

  l = (cmax + cmin) / 2;
  s = delta == 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));
  s = +(s * 100).toFixed(1);
  l = +(l * 100).toFixed(1);

  return "hsl(" + h + "," + s + "%," + l + "%)";
}

function hexAToRGBA(h) {
  let r = 0, g = 0, b = 0, a = 1;

  if (h.length == 5) {
    r = "0x" + h[1] + h[1];
    g = "0x" + h[2] + h[2];
    b = "0x" + h[3] + h[3];
    a = "0x" + h[4] + h[4];

  } else if (h.length == 9) {
    r = "0x" + h[1] + h[2];
    g = "0x" + h[3] + h[4];
    b = "0x" + h[5] + h[6];
    a = "0x" + h[7] + h[8];
  }
  a = +(a / 255).toFixed(3);

  return "rgba(" + +r + "," + +g + "," + +b + "," + a + ")";
}

export const hexToHSL = (hex: string) => {
  // Convert hex to RGB first
  let r = "0", g = "0", b = "0";
  if (hex.length == 4) {
    r = "0x" + hex[1] + hex[1];
    g = "0x" + hex[2] + hex[2];
    b = "0x" + hex[3] + hex[3];
  } else if (hex.length == 7) {
    r = "0x" + hex[1] + hex[2];
    g = "0x" + hex[3] + hex[4];
    b = "0x" + hex[5] + hex[6];
  }
  // Then to HSL
  const rInt = parseInt(r, 16) / 255;
  const gInt = parseInt(g, 16) / 255;
  const bInt = parseInt(b, 16) / 255;
  let cmin = Math.min(rInt,gInt,bInt),
      cmax = Math.max(rInt,gInt,bInt),
      delta = cmax - cmin,
      h = 0,
      s = 0,
      l = 0;

  if (delta == 0)
    h = 0;
  else if (cmax == rInt)
    h = ((gInt - bInt) / delta) % 6;
  else if (cmax == gInt)
    h = (bInt - rInt) / delta + 2;
  else
    h = (rInt - gInt) / delta + 4;

  h = Math.round(h * 60);

  if (h < 0)
    h += 360;

  l = (cmax + cmin) / 2;
  s = delta == 0 ? 0 : delta / (1 - Math.abs(2 * l - 1));
  s = +(s * 100).toFixed(1);
  l = +(l * 100).toFixed(1);

  return "hsl(" + h + "," + s + "%," + l + "%)";
}