Add support for light colors

This commit is contained in:
Tom Hubrecht 2022-03-12 16:59:45 +01:00
parent 25d0e704b1
commit 2bef697b7b
2 changed files with 21 additions and 1 deletions

View file

@ -18,7 +18,7 @@
<Modal isOpen={open} {toggle} centered scrollable>
<ModalHeader {toggle}>
<span class="pe-3">
<Badge color="custom" style="background-color:{event.backgroundColor}">
<Badge color="custom" style="background-color:{event.backgroundColor}; color:{event.textColor}">
{event.extendedProps.calendar}
</Badge>
</span>

View file

@ -1,3 +1,22 @@
// https://stackoverflow.com/a/35970186
function invertColor(hex) {
if (hex.indexOf('#') === 0) {
hex = hex.slice(1)
}
// convert 3-digit hex to 6-digits.
if (hex.length === 3) {
hex = hex[0] + hex[0] + hex[1] + hex[1] + hex[2] + hex[2]
}
if (hex.length !== 6) {
throw new Error('Invalid HEX color.')
}
var r = parseInt(hex.slice(0, 2), 16),
g = parseInt(hex.slice(2, 4), 16),
b = parseInt(hex.slice(4, 6), 16)
// https://stackoverflow.com/a/3943023/112731
return r * 0.299 + g * 0.587 + b * 0.114 > 186 ? '#000000' : '#FFFFFF'
}
const clouds = {
KLUB_RESEAU: 'klub-reseau',
ELEVES_ENS: 'eleves-ens',
@ -140,6 +159,7 @@ function fcEventFromjCalEvent(cal) {
start: evt.dtstart,
end: evt.dtend,
color: cal.color,
textColor: invertColor(cal.color),
duration: end - start // in ms
}