Merge branch 'develop' into feature/#147-automatic-time-conversion

# Conflicts:
#	package-lock.json
#	package.json
This commit is contained in:
Serraniel 2020-12-28 18:43:51 +01:00
commit 5edf65b578
Signed by: Serraniel
GPG key ID: 3690B4E7364525D3
9 changed files with 101 additions and 4 deletions

5
package-lock.json generated
View file

@ -3329,7 +3329,6 @@
"version": "3.1.3",
"resolved": "https://registry.npmjs.org/color/-/color-3.1.3.tgz",
"integrity": "sha512-xgXAcTHa2HeFCGLE9Xs/R82hujGtu9Jd9x4NW3T34+OMs7VoPsjwzRczKHvTAHeJwWFwX5j15+MgAppE8ztObQ==",
"dev": true,
"requires": {
"color-convert": "^1.9.1",
"color-string": "^1.5.4"
@ -11577,7 +11576,6 @@
"version": "0.2.2",
"resolved": "https://registry.npmjs.org/simple-swizzle/-/simple-swizzle-0.2.2.tgz",
"integrity": "sha1-pNprY1/8zMoz9w0Xy5JZLeleVXo=",
"dev": true,
"requires": {
"is-arrayish": "^0.3.1"
},
@ -11585,8 +11583,7 @@
"is-arrayish": {
"version": "0.3.2",
"resolved": "https://registry.npmjs.org/is-arrayish/-/is-arrayish-0.3.2.tgz",
"integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ==",
"dev": true
"integrity": "sha512-eVRqCvVlZbuw3GrM63ovNSNAeA1K16kaR/LRY/92w0zxQ5/1YzwblUX652i4Xs9RwAGjW9d9y6X88t8OaAJfWQ=="
}
}
},

View file

@ -33,6 +33,7 @@
},
"homepage": "https://github.com/Serraniel/AniwatchPlus#readme",
"dependencies": {
"color": "^3.1.3",
"moment": "^2.29.1",
"spacetime": "^6.12.2",
"uuid": "^8.3.2"

View file

@ -28,6 +28,9 @@
<input type="checkbox" id="websiteOptimizeListAppearance" data-default-value="true" />
<label for="websiteOptimizeListAppearance">Optimize appearance of lists</label><br />
<input type="checkbox" id="websiteOptimizeFontColors" data-default-value="true" />
<label for="websiteOptimizeFontColors">Optimize font colors</label><br />
<h3>Anime</h3>
<input type="checkbox" id="animeLanguageDisplay" data-default-value="true" />
<label for="animeLanguageDisplay">Optimize presentation of available subs and dubs</label><br />

View file

@ -5,6 +5,7 @@ import { initHelpers } from './utils/helpers';
// enhancements
import { init as anilyr } from './enhancements/anilyr';
import { init as animeRequests } from './enhancements/animeRequests';
import { init as fontColor } from './enhancements/fontColor';
import { init as languageDisplay } from './enhancements/languageDisplay';
import { init as notifications } from './enhancements/notifications';
import { init as quickSearch } from './enhancements/quickSearch';
@ -22,6 +23,7 @@ initHelpers();
// enhancements
anilyr();
animeRequests();
fontColor();
languageDisplay();
notifications();
quickSearch();

View file

@ -7,6 +7,7 @@ export const SETTINGS_websiteAutoTimeConversion = 'websiteAutoTimeConversion';
export const SETTINGS_websiteShowNotificationsCountInTab = 'websiteShowNotificationsCountInTab';
export const SETTINGS_websiteHideUnusedTabs = 'websiteHideUnusedTabs';
export const SETTINGS_websiteOptimizeListAppearance = 'websiteOptimizeListAppearance';
export const SETTINGS_websiteOptimizeFontColors = 'websiteOptimizeFontColors';
// anime
export const SETTINGS_animeLanguageDisplay = 'animeLanguageDisplay';
// requests

View file

@ -0,0 +1,82 @@
import Color from 'color';
import { getGlobalConfiguration, SETTINGS_websiteOptimizeFontColors } from '../configuration/configuration';
import * as core from '../utils/aniwatchCore';
import * as helper from '../utils/helpers';
const BADGE_CLASS = 'label';
const DARKCOLOR_CLASS = 'awp-fontColor-dark';
const __observedBadges = [];
export function init() {
getGlobalConfiguration().getProperty(SETTINGS_websiteOptimizeFontColors, value => {
if (value) {
core.runAfterLoad(() => {
checkRunColorOptimization(document.documentElement);
}, ".*");
core.runAfterLocationChange(() => {
checkRunColorOptimization(document.documentElement);
}, ".*");
core.registerScript(node => {
checkRunColorOptimization(node);
}, ".*");
}
});
}
function checkRunColorOptimization(node) {
// run the scripts
if (helper.isHtmlElement(node)) {
if (node.classList.contains(BADGE_CLASS)) {
tryRegisterObserverForBadge(node);
optimizeFontColorsBadges(node);
}
else {
node.querySelectorAll(`.${BADGE_CLASS}`).forEach(element => {
tryRegisterObserverForBadge(element);
optimizeFontColorsBadges(element);
});
}
}
}
function tryRegisterObserverForBadge(badge) {
// 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
if (__observedBadges.indexOf(badge) >= 0) {
return;
}
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) {
return;
}
else {
optimizeFontColorsBadges(mutation.target);
}
});
});
obsever.observe(badge, {
attributes: true,
attributeFilter: ['class'],
attributeOldValue: true,
});
__observedBadges.push(badge);
}
function optimizeFontColorsBadges(badge) {
let colorStr = window.getComputedStyle(badge, null).getPropertyValue('background-color');
// some elements do not have a computed background color
if (colorStr.length > 0) {
let color = new Color(colorStr)
badge.classList.toggle(DARKCOLOR_CLASS, color.isLight());
}
}

View file

@ -2,6 +2,7 @@
@import "./vars/colors";
// enhancements
@import "./enhancements/fontColor";
@import "./enhancements/lists";
@import "./enhancements/tabs";
@import "./enhancements/watch2gether";

View file

@ -0,0 +1,7 @@
.awp{
&-fontColor{
&-dark{
color: $aniwatchDark !important;
}
}
}

View file

@ -1,2 +1,5 @@
$aniwatchBlue: #348fff;
$aniwatchDark: #282a39;
$gray: rgba(155, 155, 155, 0.2);