diff --git a/js/customColors.js b/js/customColors.js index 0499d35..4d129ee 100644 --- a/js/customColors.js +++ b/js/customColors.js @@ -1,25 +1,26 @@ import { app } from "/scripts/app.js"; import { $el } from "/scripts/ui.js"; -// https://stackoverflow.com/a/41491220 -function pickTextColorBasedOnBgColorAdvanced(bgColor, lightColor, darkColor) { - var color = bgColor.charAt(0) === "#" ? bgColor.substring(1, 7) : bgColor; - var r = parseInt(color.substring(0, 2), 16); // hexToR - var g = parseInt(color.substring(2, 4), 16); // hexToG - var b = parseInt(color.substring(4, 6), 16); // hexToB - var uicolors = [r / 255, g / 255, b / 255]; - var c = uicolors.map((col) => { - if (col <= 0.03928) { - return col / 12.92; - } - return Math.pow((col + 0.055) / 1.055, 2.4); - }); - var L = 0.2126 * c[0] + 0.7152 * c[1] + 0.0722 * c[2]; - return L > 0.179 ? darkColor : lightColor; -} +const colorShade = (col, amt) => { + col = col.replace(/^#/, ""); + if (col.length === 3) col = col[0] + col[0] + col[1] + col[1] + col[2] + col[2]; + + let [r, g, b] = col.match(/.{2}/g); + [r, g, b] = [parseInt(r, 16) + amt, parseInt(g, 16) + amt, parseInt(b, 16) + amt]; + + r = Math.max(Math.min(255, r), 0).toString(16); + g = Math.max(Math.min(255, g), 0).toString(16); + b = Math.max(Math.min(255, b), 0).toString(16); + + const rr = (r.length < 2 ? "0" : "") + r; + const gg = (g.length < 2 ? "0" : "") + g; + const bb = (b.length < 2 ? "0" : "") + b; + + return `#${rr}${gg}${bb}`; +}; app.registerExtension({ - name: "pysssss.ShowText", + name: "pysssss.CustomColors", setup() { let picker; let activeNode; @@ -50,7 +51,7 @@ app.registerExtension({ if (activeNode.constructor === LiteGraph.LGraphGroup) { activeNode.color = picker.value; } else { - activeNode.color = pickTextColorBasedOnBgColorAdvanced(picker.value, "white", "black"); + activeNode.color = colorShade(picker.value, 20); activeNode.bgcolor = picker.value; } activeNode.setDirtyCanvas(true, true);