diff --git a/enhanced-aniwatch.code-workspace b/enhanced-aniwatch.code-workspace new file mode 100644 index 0000000..876a149 --- /dev/null +++ b/enhanced-aniwatch.code-workspace @@ -0,0 +1,8 @@ +{ + "folders": [ + { + "path": "." + } + ], + "settings": {} +} \ No newline at end of file diff --git a/enhancements/animeRequests.js b/enhancements/animeRequests.js index f8cb9c3..d51f342 100644 --- a/enhancements/animeRequests.js +++ b/enhancements/animeRequests.js @@ -1,41 +1,42 @@ -const starIcon = "star"; -const scripts = [ - changeFollowedStarColor, - changeOwnBorderColor, -] - -executeAfterPreload(initScripts); - -function initScripts() { +registerScript(node => { // run the scripts - runScripts(); + if (isHtmlElement(node)) { + changeFollowedStarColor(node); + changeOwnBorderColor(node); + } +}); - // because of late loading in the request list we have to run the codes each time the list changes - document.querySelector("md-list").addEventListener("DOMNodeInserted", event => runScripts(event), false); -} +function changeFollowedStarColor(node) { + const starIcon = "star"; -function runScripts() { - scripts.forEach(script => script()); -} - -function changeFollowedStarColor() { // find stars - let followedItems = Array.from(document.querySelectorAll("i")).filter(i => i.innerText == starIcon); + let followedItems = Array.from(node.querySelectorAll("i")).filter(i => i.innerText.trim() === starIcon); // change color followedItems.forEach(item => item.style.color = aniBlue); } -function changeOwnBorderColor() { - // find items -> all - let requestItems = document.querySelectorAll("md-list-item"); +function changeOwnBorderColor(node) { + const targetTagName = "MD-LIST-ITEM"; // tagName is upper case - // change border color if profile link is not "false" - requestItems.forEach(item => { + let updateFunc = item => { let profileLink = item.querySelectorAll("a[href*='/profile/']:not([href='/profile/false'])"); if (profileLink.length > 0) { item.style.borderColor = aniBlue } - }); + } + + // are we target tag? + if (node.tagName === targetTagName) { + updateFunc(node); + } else { + // find items -> all + let requestItems = node.querySelectorAll("md-list-item"); + + // change border color if profile link is not "false" + requestItems.forEach(item => { + updateFunc(item); + }); + } } \ No newline at end of file diff --git a/manifest.json b/manifest.json index d4623e9..7a8508d 100644 --- a/manifest.json +++ b/manifest.json @@ -1,29 +1,29 @@ { - "name": "Enhanced Aniwatch", - "version": "0.1.0.0", - "description": "Contains several enhancments for https://aniwatch.me", - "manifest_version": 2, - "author": "Serraniel", - "homepage_url": "https://github.com/Serraniel/EnhancedAniwatch", - "content_scripts": [ - { - "matches": [ - "*://aniwatch.me/*" - ], - "js": [ - "utils/colors.js", - "utils/aniwatchCore.js" - ], - "run_at": "document_start" - }, - { - "matches": [ - "*://aniwatch.me/requests" - ], - "js": [ - "enhancements/animeRequests.js" - ], - "run_at": "document_end" - } - ] + "name": "Enhanced Aniwatch", + "version": "0.1.0.0", + "description": "Contains several enhancments for https://aniwatch.me", + "manifest_version": 2, + "author": "Serraniel", + "homepage_url": "https://github.com/Serraniel/EnhancedAniwatch", + "content_scripts": [{ + "matches": [ + "*://aniwatch.me/*" + ], + "js": [ + "utils/colors.js", + "utils/helpers.js", + "utils/aniwatchCore.js" + ], + "run_at": "document_start" + }, + { + "matches": [ + "*://aniwatch.me/*" + ], + "js": [ + "enhancements/animeRequests.js" + ], + "run_at": "document_end" + } + ] } \ No newline at end of file diff --git a/utils/aniwatchCore.js b/utils/aniwatchCore.js index 263247a..e274d01 100644 --- a/utils/aniwatchCore.js +++ b/utils/aniwatchCore.js @@ -1,10 +1,23 @@ -function executeAfterPreload(func){ - let preLoader = document.getElementById('preloader'); - - let loop = setInterval(() => { - if(preLoader.style.display==="none"){ - clearInterval(loop); - func(); +let __scripts = []; + +function registerScript(func) { + __scripts.push(func); +} + +function runScripts(node) { + __scripts.forEach(script => script(node)); +} + +let observer = new MutationObserver(mutations => { + mutations.forEach(mutation => { + for (let i = 0; i < mutation.addedNodes.length; i++) { + runScripts(mutation.addedNodes[i]); } - }, 100); -} \ No newline at end of file + }); +}); + +observer.observe(document.documentElement || document.body, { + childList: true, + subtree: true, + attributes: true +}); \ No newline at end of file diff --git a/utils/helpers.js b/utils/helpers.js new file mode 100644 index 0000000..cb18055 --- /dev/null +++ b/utils/helpers.js @@ -0,0 +1,3 @@ +function isHtmlElement(object) { + return object instanceof HTMLElement; +} \ No newline at end of file