// First train the neural network
var net = new brain.NeuralNetwork();
net.train([
{input: { r: 0.0, g: 0.0, b: 0.0 }, output: { white: 1 }},
{input: { r: 1.0, g: 1.0, b: 1.0 }, output: { black: 1 }},
{input: { r: 0.03, g: 0.7, b: 0.5 }, output: { black: 1 }},
{input: { r: 0.16, g: 0.09, b: 0.2 }, output: { white: 1 }},
{input: { r: 0.5, g: 0.5, b: 1.0 }, output: { white: 1 }},
{input: { r: 0.07, g: 0.34, b: 0.0 }, output: { white: 1 }},
{input: { r: 1.0, g: 0.50, b: 0.50 }, output: { black: 1 }}
]);
var output;
// Color handling
const input = document.getElementById('color');
// Here happens the everything.
function changeColor(e) {
document.body.style.backgroundColor = e.target.value;
color = hexToRgb(e.target.value);
Object.keys(color).map(function(key, index) {
color[key] = +(color[key]/255).toFixed(2);
});
output = net.run(color);
document.body.style.color = likely(output);
}
function hexToRgb(hex) {
// Expand shorthand form (e.g. "03F") to full form (e.g. "0033FF")
var shorthandRegex = /^#?([a-f\d])([a-f\d])([a-f\d])$/i;
hex = hex.replace(shorthandRegex, function(m, r, g, b) {
return r + r + g + g + b + b;
});
var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
return result ? {
r: parseInt(result[1], 16),
g: parseInt(result[2], 16),
b: parseInt(result[3], 16)
} : null;
}
function likely(result) {
return result.white > result.black ? "white" : "black";
}
input.addEventListener('input', changeColor);
View Compiled