general: snapshot

app-html/_oklch.js

@@ -0,0 +1,48 @@
+merge = async (c1, c2) => {
+  function sleep(ms) {
+    return new Promise((resolve) => {
+      setTimeout(resolve, ms);
+    });
+  }
+
+  async function hexToOklch(c) {
+    hex.value = c;
+
+    hex.dispatchEvent(new Event("change"));
+
+    await sleep(1);
+
+    console.log(oklch.value);
+
+    const s = oklch.value.slice(6, -1).split(" ");
+
+    let [lightness, chroma, hue] = s;
+
+    lightness = Number(lightness.slice(0, -1));
+    chroma = Number(chroma);
+    hue = Number(hue);
+
+    return [lightness, chroma, hue];
+  }
+
+  function average(a, b) {
+    return (a + b) / 2;
+  }
+
+  const [lightness1, chroma1, hue1] = await hexToOklch(c1);
+  console.log(lightness1, chroma1, hue1);
+  const [lightness2, chroma2, hue2] = await hexToOklch(c2);
+  console.log(lightness2, chroma2, hue2);
+
+  const lightness = average(lightness1, lightness2);
+  const chroma = average(chroma1, chroma2);
+  const hue = average(hue1, hue2);
+
+  oklch.value = `oklch(${lightness}% ${chroma} ${hue})`;
+  console.log(oklch.value);
+  oklch.dispatchEvent(new Event("change"));
+
+  await sleep(10);
+
+  console.log(hex.value);
+};