« get me outta code hell

hsmusic-wiki - HSMusic - static wiki software cataloguing collaborative creation
about summary refs log tree commit diff
path: root/src/util/colors.js
diff options
context:
space:
mode:
Diffstat (limited to 'src/util/colors.js')
-rw-r--r--src/util/colors.js47
1 files changed, 47 insertions, 0 deletions
diff --git a/src/util/colors.js b/src/util/colors.js
new file mode 100644
index 0000000..1df591b
--- /dev/null
+++ b/src/util/colors.js
@@ -0,0 +1,47 @@
+// Color and theming utility functions! Handy.
+
+// Graciously stolen from https://stackoverflow.com/a/54071699! ::::)
+// in: r,g,b in [0,1], out: h in [0,360) and s,l in [0,1]
+export function rgb2hsl(r, g, b) {
+    let a=Math.max(r,g,b), n=a-Math.min(r,g,b), f=(1-Math.abs(a+a-n-1));
+    let h= n && ((a==r) ? (g-b)/n : ((a==g) ? 2+(b-r)/n : 4+(r-g)/n));
+    return [60*(h<0?h+6:h), f ? n/f : 0, (a+a-n)/2];
+}
+
+export function getColors(primary) {
+    const [ r, g, b ] = primary.slice(1)
+        .match(/[0-9a-fA-F]{2,2}/g)
+        .slice(0, 3)
+        .map(val => parseInt(val, 16) / 255);
+    const [ h, s, l ] = rgb2hsl(r, g, b);
+    const dim = `hsl(${Math.round(h)}deg, ${Math.round(s * 50)}%, ${Math.round(l * 80)}%)`;
+
+    return {primary, dim};
+}
+
+export function getLinkThemeString(color) {
+    if (!color) return '';
+
+    const { primary, dim } = getColors(color);
+    return `--primary-color: ${primary}; --dim-color: ${dim}`;
+}
+
+export function getThemeString(color, additionalVariables = []) {
+    if (!color) return '';
+
+    const { primary, dim } = getColors(color);
+
+    const variables = [
+        `--primary-color: ${primary}`,
+        `--dim-color: ${dim}`,
+        ...additionalVariables
+    ].filter(Boolean);
+
+    if (!variables.length) return '';
+
+    return (
+        `:root {\n` +
+        variables.map(line => `    ` + line + ';\n').join('') +
+        `}`
+    );
+}