diff --git a/public/components/btn.mjs b/public/components/btn.mjs index 04f6c9b..52c13a3 100644 --- a/public/components/btn.mjs +++ b/public/components/btn.mjs @@ -13,8 +13,10 @@ function shadeColor(hex, amount) { } function hex2Int(hex) { - let r = 0, g = 0, b = 0; - if (hex.length === 4) { + let r = 0, + g = 0, + b = 0; + if(hex.length === 4) { r = parseInt(hex[1] + hex[1], 16); g = parseInt(hex[2] + hex[2], 16); b = parseInt(hex[3] + hex[3], 16); @@ -23,15 +25,19 @@ function shadeColor(hex, amount) { g = parseInt(hex.slice(3, 5), 16); b = parseInt(hex.slice(5, 7), 16); } - return { r, g, b }; + return { + r, + g, + b + }; } function 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; + 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; } @@ -39,21 +45,38 @@ function shadeColor(hex, amount) { return '#' + dec2Hex(r) + dec2Hex(g) + dec2Hex(b); } - let { r, g, b } = hex2Int(hex); - r /= 255; g /= 255; b /= 255; - const max = Math.max(r, g, b), min = Math.min(r, g, b); - let h, s, l = (max + min) / 2; + let { + r, + g, + b + } = hex2Int(hex); + r /= 255; + g /= 255; + b /= 255; + const max = Math.max(r, g, b), + min = Math.min(r, g, b); + let h, + s, + l = (max + min) / 2; - if (max === min) { + if(max === min) { h = s = 0; } else { const d = max - min; s = l > 0.5 ? d / (2 - max - min) : d / (max + min); - switch (max) { - case r: h = (g - b) / d + (g < b ? 6 : 0); break; - case g: h = (b - r) / d + 2; break; - case b: h = (r - g) / d + 4; break; - default: h = 0; break; + switch(max) { + case r: + h = (g - b) / d + (g < b ? 6 : 0); + break; + case g: + h = (b - r) / d + 2; + break; + case b: + h = (r - g) / d + 4; + break; + default: + h = 0; + break; } h /= 6; } @@ -67,7 +90,7 @@ function shadeColor(hex, amount) { class BtnComponent extends HTMLElement { constructor() { super(); - this.attachShadow({ mode: 'open' }); + this.attachShadow({mode: 'open'}); this.shadowRoot.innerHTML = `