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

#3 improved performance of language display update in lists

Browse source 
Only tries to update if the node is a list element and only updates the single node instead of fetching and updating all nodes each time the page changes
This commit is contained in:
Serraniel 2020-09-27 12:01:35 +02:00
parent d3f633f559
commit 378389863a
Signed by: Serraniel
GPG key ID: 3690B4E7364525D3
1 changed files with 149 additions and 145 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
src/javascript/enhancements/languageDisplay.js
View file

@ -10,22 +10,27 @@ export function init() {
}, "^/anime/[0-9]*$");
}
const langPrefix = 'ep.lang.';
const dubSuffix = 'dub';
const subSuffix = 'sub';
const dubIcon = 'volume_up';
const subIcon = 'closed_caption';
const zeroWidthSpace = ''; // ​
function updateLanguageDisplay(node) {
const langPrefix = 'ep.lang.';
const dubSuffix = 'dub';
const subSuffix = 'sub';
const listNodeName = 'MD-LIST-ITEM';
const dubIcon = 'volume_up';
const subIcon = 'closed_caption';
const zeroWidthSpace = ''; // ​
if (node.nodeName === listNodeName) {
updateLanguageDisplayListMode(node);
}
}
let listItems = document.querySelectorAll('md-list-item');
listItems.forEach(item => {
function updateLanguageDisplayListMode(node) {
// last column with flags
let col = item.querySelector('h3.layout-align-end-center');
let col = node.querySelector('h3.layout-align-end-center');
if (col.eaManipulated) {
if (typeof col === 'undefined' || col.eaManipulated) {
return;
}
@ -181,15 +186,14 @@ function updateLanguageDisplay(node) {
col.appendChild(div);
});
item.querySelectorAll('.layout-column:not(:last-child)').forEach(div => {
node.querySelectorAll('.layout-column:not(:last-child)').forEach(div => {
div.style.borderRight = '1px solid rgba(155,155,155, 0.2)';
})
item.querySelectorAll('.layout-column').forEach(div => {
node.querySelectorAll('.layout-column').forEach(div => {
div.style.paddingLeft = '2px';
div.style.paddingRight = '2px';
})
col.eaManipulated = true;
});
}