Serraniel/AniwatchPlus
Serraniel/AniwatchPlus
1
0
Fork 0
Code Issues 9 Pull requests 8 Packages Projects Releases 10 Wiki Activity

#48 Added types for font color enhancements

Browse source
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
1 changed files with 25 additions and 22 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

17
src/javascript/enhancements/fontColor.ts
View file

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