|
|
|
@ -3,6 +3,7 @@ const React = require('react')
|
|
|
|
|
const ReactDOM = require('react-dom')
|
|
|
|
|
const create = require('create-react-class')
|
|
|
|
|
const Promise = require('bluebird')
|
|
|
|
|
const colorConvert = require('color-convert')
|
|
|
|
|
|
|
|
|
|
let input = create({
|
|
|
|
|
displayName: "Input",
|
|
|
|
@ -126,39 +127,10 @@ function rainbowTransform(text) {
|
|
|
|
|
if (h > 360) {
|
|
|
|
|
h = 0;
|
|
|
|
|
}
|
|
|
|
|
return `<font color="${hslToHex(h, 100, 50)}">${char}</font>`;
|
|
|
|
|
return `<font color="${colorConvert.hsl.hex(h, 100, 50)}">${char}</font>`;
|
|
|
|
|
});
|
|
|
|
|
let rainbow = rainbowArray.join("");
|
|
|
|
|
return rainbow;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
function hslToHex(h, s, l) {
|
|
|
|
|
h /= 360;
|
|
|
|
|
s /= 100;
|
|
|
|
|
l /= 100;
|
|
|
|
|
let r, g, b;
|
|
|
|
|
if (s === 0) {
|
|
|
|
|
r = g = b = l; // 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 = l < 0.5 ? l * (1 + s) : l + s - l * s;
|
|
|
|
|
const p = 2 * l - q;
|
|
|
|
|
r = hue2rgb(p, q, h + 1 / 3);
|
|
|
|
|
g = hue2rgb(p, q, h);
|
|
|
|
|
b = hue2rgb(p, q, h - 1 / 3);
|
|
|
|
|
}
|
|
|
|
|
const toHex = x => {
|
|
|
|
|
const hex = Math.round(x * 255).toString(16);
|
|
|
|
|
return hex.length === 1 ? '0' + hex : hex;
|
|
|
|
|
};
|
|
|
|
|
return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
module.exports = input
|
|
|
|
|