use different colour conversion

master
f0x 6 years ago
parent e2666f1f9b
commit 5db2c75828

@ -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

@ -17,6 +17,7 @@
"blueimp-canvas-to-blob": "^3.14.0",
"browserify": "^16.2.3",
"budo": "^11.5.0",
"color-convert": "^2.0.0",
"create-react-class": "^15.6.3",
"debounce": "^1.2.0",
"default-value": "^1.0.0",

@ -7,6 +7,7 @@ dependencies:
blueimp-canvas-to-blob: 3.14.0
browserify: 16.2.3
budo: 11.5.0
color-convert: 2.0.0
create-react-class: 15.6.3
debounce: 1.2.0
default-value: 1.0.0
@ -2308,10 +2309,22 @@ packages:
dev: false
resolution:
integrity: sha512-QfAUtd+vFdAtFQcC8CCyYt1fYWxSqAiK2cSD6zDB8N3cpsEBAvRxp9zOGg6G/SHHJYAT88/az/IuDGALsNVbGg==
/color-convert/2.0.0:
dependencies:
color-name: 1.1.4
dev: false
engines:
node: '>=7.0.0'
resolution:
integrity: sha512-hzTicsCJIHdxih9+2aLR1tNGZX5qSJGRHDPVwSY26tVrEf55XNajLOBWz2UuWSIergszA09/bqnOiHyqx9fxQg==
/color-name/1.1.3:
dev: false
resolution:
integrity: sha1-p9BVi9icQveV3UIyj3QIMcpTvCU=
/color-name/1.1.4:
dev: false
resolution:
integrity: sha512-dOy+3AuW3a2wNbZHIuMZpTcgjGuLU/uBL/ubcZF9OXbDo8ff4O8yVp5Bf0efS8uEoYo5q4Fx7dY9OgQGXgAsQA==
/color-support/1.1.3:
hasBin: true
resolution:
@ -9633,6 +9646,7 @@ specifiers:
blueimp-canvas-to-blob: ^3.14.0
browserify: ^16.2.3
budo: ^11.5.0
color-convert: ^2.0.0
create-react-class: ^15.6.3
debounce: ^1.2.0
default-value: ^1.0.0

Loading…
Cancel
Save