56 lines
1.8 KiB
HTML
56 lines
1.8 KiB
HTML
<html>
|
|
<head>
|
|
<title>Undither</title>
|
|
<script>
|
|
function toRgbTable(col)
|
|
{
|
|
// return a color in the form [red, green, blue] for a hex #RRGGBB
|
|
return [parseInt(col.slice(1,3), 16), parseInt(col.slice(3,5), 16), parseInt(col.slice(5,7), 16)]
|
|
}
|
|
function toRgbHex(col)
|
|
{
|
|
// return a color in the hex for from a [red, green, blue]
|
|
pf_red = ""
|
|
pf_green = ""
|
|
pf_blue = ""
|
|
if (col[0] < 16) pf_red = "0"
|
|
if (col[1] < 16) pf_green = "0"
|
|
if (col[2] < 16) pf_blue = "0"
|
|
return "#" + pf_red + col[0].toString(16) + pf_green + col[1].toString(16) + pf_blue + col[2].toString(16)
|
|
}
|
|
function updateColor()
|
|
{
|
|
val_1 = document.getElementById("col_1").value
|
|
val_2 = document.getElementById("col_2").value
|
|
val_3 = document.getElementById("col_3").value
|
|
val_4 = document.getElementById("col_4").value
|
|
rgb_1 = toRgbTable(val_1)
|
|
rgb_2 = toRgbTable(val_2)
|
|
rgb_3 = toRgbTable(val_3)
|
|
rgb_4 = toRgbTable(val_4)
|
|
rgb_res = [0, 0, 0]
|
|
rgb_res[0] = Math.floor((rgb_1[0] + rgb_2[0] + rgb_3[0] + rgb_4[0]) / 4)
|
|
rgb_res[1] = Math.floor((rgb_1[1] + rgb_2[1] + rgb_3[1] + rgb_4[1]) / 4)
|
|
rgb_res[2] = Math.floor((rgb_1[2] + rgb_2[2] + rgb_3[2] + rgb_4[2]) / 4)
|
|
res = toRgbHex(rgb_res)
|
|
|
|
col_res = document.getElementById("col_res")
|
|
col_res.innerText = res
|
|
in_res = document.getElementById("in_res")
|
|
in_res.value = res
|
|
}
|
|
</script>
|
|
</head>
|
|
<body onload="updateColor();">
|
|
<div>
|
|
<input id="col_1" type="color" value="#ffffff" onchange="updateColor();" />
|
|
<input id="col_2" type="color" value="#000000" onchange="updateColor();" />
|
|
</div>
|
|
<div>
|
|
<input id="col_3" type="color" value="#000000" onchange="updateColor();" />
|
|
<input id="col_4" type="color" value="#ffffff" onchange="updateColor();" />
|
|
</div>
|
|
<p>Result: <span id="col_res"></span> <input id="in_res" type="color" value="#000000" /></p>
|
|
</body>
|
|
</html>
|