eightball/PluralKit
1
0
Fork 0
mirror of https://github.com/PluralKit/PluralKit.git synced 2026-02-04 04:56:49 +00:00
Code Issues Projects Releases Packages Wiki Activity Actions 1

tweak(dashboard): sort colors by hue instead of absolute number

Browse source
This commit is contained in:
Jake Fulmine 2023-08-20 20:02:39 +02:00
parent e3dde36d0e
commit f473b6389c
1 changed files with 63 additions and 10 deletions
Download patch file Download diff file Expand all files Collapse all files

73
dashboard/src/components/list/functions.ts
View file

@ -133,26 +133,79 @@ function sort<T extends Member|Group>(list: T[], options: ListOptions): T[] {
});
} else if (options.sort === 'color') {
newList = [...list].sort((a, b) => {
let aa = Number("0x" + a.color);
let bb = Number("0x" + b.color);
if (a.color === b.color) return a.name.localeCompare(b.name);
if (a.color === null) return 1;
if (b.color === null) return -1;
if (aa === bb) return a.name.localeCompare(b.name);
let aa = getColor(a.color);
let bb = getColor(b.color)
if (Number.isNaN(aa)) return 1;
if (Number.isNaN(bb)) return -1;
if (a.color === b.color) return a.name.localeCompare(b.name);
if (aa > bb) return 1;
if (aa < bb) return -1;
if (aa.hex === "ffffff") return -1;
if (bb.hex === "ffffff") return 1;
if (aa.hue === bb.hue) {
if (aa.luma > bb.luma) return 1;
if (aa.luma < bb.luma) return -1;
return a.name.localeCompare(b.name);
}
if (aa.hue > bb.hue) return 1;
if (aa.hue < bb.hue) return -1;
})
}
return newList;
}
function getColor(hex: string) {
hex = hex.replace("#", "")
// get the RGB values
let r = parseInt(hex.substring(0, 2), 16) / 255
let g = parseInt(hex.substring(2, 4), 16) / 255
let b = parseInt(hex.substring(4, 6), 16) / 255
// Getting the Max and Min values for Chroma
let max = Math.max.apply(Math, [r, g, b]);
let min = Math.min.apply(Math, [r, g, b]);
// Variables for HSV value of hex color
let chr = max - min;
let hue = 0;
let val = max;
let sat = 0;
if (val > 0) {
// Calculate Saturation only if Value isn't 0.
sat = chr / val;
if (sat > 0) {
if (r == max) {
hue = 60 * (((g - min) - (b - min)) / chr);
if (hue < 0) {
hue += 360;
}
} else if (g == max) {
hue = 120 + 60 * (((b - min) - (r - min)) / chr);
} else if (b == max) {
hue = 240 + 60 * (((r - min) - (g - min)) / chr);
}
}
}
let color: Record<string, number|string> = {}
color.hex = hex;
color.chroma = chr;
color.hue = hue;
color.sat = sat;
color.val = val;
color.luma = 0.3 * r + 0.59 * g + 0.11 * b;
color.red = parseInt(hex.substring(0, 2), 16);
color.green = parseInt(hex.substring(2, 4), 16);
color.blue = parseInt(hex.substring(4, 6), 16);
return color;
}
function group(list: Member[]|Group[], groups: Group[], options: ListOptions, type?: string): Group[]|Member[] {
let groupFilterList = [...list]