#48 Added types for font color enhancements

This commit is contained in:
Serraniel 2020-12-28 22:55:09 +01:00
parent a8e5cf7e4b
commit b7c647e114
Signed by: Serraniel
GPG key ID: 3690B4E7364525D3

View file

@ -7,7 +7,7 @@ const BADGE_CLASS = 'label';
const DARKCOLOR_CLASS = 'awp-fontColor-dark';
const __observedBadges = [];
export function init() {
export function init(): void {
getGlobalConfiguration().getProperty(SETTINGS_websiteOptimizeFontColors, value => {
if (value) {
core.runAfterLoad(() => {
@ -19,15 +19,16 @@ export function init() {
}, ".*");
core.registerScript(node => {
if (node instanceof Element) {
checkRunColorOptimization(node);
}
}, ".*");
}
});
}
function checkRunColorOptimization(node) {
function checkRunColorOptimization(node: Element): void {
// run the scripts
if (helper.isHtmlElement(node)) {
if (node.classList.contains(BADGE_CLASS)) {
tryRegisterObserverForBadge(node);
optimizeFontColorsBadges(node);
@ -39,9 +40,8 @@ function checkRunColorOptimization(node) {
});
}
}
}
function tryRegisterObserverForBadge(badge) {
function tryRegisterObserverForBadge(badge: Node): void {
// some badges change there color via late loading so we also have to observe the classlist
// example: Navigating from a list to an anime -> "Currently Airing" late loads the color badge
// this only happens when navigating from a list, direct loading works
@ -53,12 +53,15 @@ function tryRegisterObserverForBadge(badge) {
let obsever = new MutationObserver(mutations => {
mutations.forEach(mutation => {
// prevent recursive calls when our class is added / removed
if ((mutation.oldValue?.indexOf(DARKCOLOR_CLASS) ?? -1 ^ mutation.target?.classList?.indexOf(DARKCOLOR_CLASS) ?? -1) === 0) {
if (mutation.target instanceof Element) {
// TODO: Validate if that still works
if ((mutation.oldValue?.indexOf(DARKCOLOR_CLASS) ?? -1 ^ (mutation.target?.classList?.contains(DARKCOLOR_CLASS) ?? false ? 0 : -1)) === 0) {
return;
}
else {
optimizeFontColorsBadges(mutation.target);
}
}
});
});
@ -71,7 +74,7 @@ function tryRegisterObserverForBadge(badge) {
__observedBadges.push(badge);
}
function optimizeFontColorsBadges(badge) {
function optimizeFontColorsBadges(badge: Element): void {
let colorStr = window.getComputedStyle(badge, null).getPropertyValue('background-color');
// some elements do not have a computed background color