Mangadex Darken Read Chapters (1 Row Items)

To darken read chapters on Mangadex's latest releases page and follows page (1 Row Items)

// ==UserScript==
// @name        Mangadex Darken Read Chapters (1 Row Items)
// @namespace   Violentmonkey Scripts
// @match       https://mangadex.org/titles/latest*
// @match       https://mangadex.org/titles/feed*
// @match       https://mangadex.org/title/*
// @require     https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js
// @require     https://greasyfork.org/scripts/383527-wait-for-key-elements/code/Wait_for_key_elements.js?version=701631
// @grant       none
// @license     MIT
// @version     5.3
// @author      Onemanleft
// @description To darken read chapters on Mangadex's latest releases page and follows page (1 Row Items)
// ==/UserScript==

// The various elements that will be used
const s1 = "#__nuxt > div.flex.flex-grow > div.flex-grow > div.md-content > div > div:nth-child(2) > div:nth-child(";
const s9 = ") > div.rounded.flex.flex-col.gap-2";
const s10 = ") > div.grid.grid-cols-12.volume-head.mb-2 > div.text-right.col-span-4 > span";
const s11 = ") > div.chapter-header > div.flex";
const s12 = ") > div.rounded.flex.flex-col.gap-2 > div:nth-child(";
const s13 = ") svg";
const s14 = ") > div:nth-child(2) > div:nth-child(";
const s15 = ") > div.chapter-grid.flex-grow.one-line > a.flex.flex-grow.items-center > svg";
const s17 = ") > div > div > div:nth-child(1) > div:nth-child(";
const s18 = ") > div > a.flex.flex-grow.items-center > svg";
const s20 = "#__nuxt > div.flex.flex-grow > div.flex-grow > div.md-content > div > div:nth-child(9) > div.flex.gap-6.items-start > div.flex-grow > div:nth-child(2) > div:nth-child(";

// For title page volume number
const start1 = "#__nuxt > div.flex.flex-grow > div.flex-grow > div.md-content > div > div:nth-child(9) > div.flex.gap-6.items-start > div.flex-grow > div:nth-child(2) > div:nth-child(";
// For title page chapter count
const start2 = ") > div.rounded.flex.flex-col.gap-2 > div:nth-child(";
// For countvolume
const vc = "#__nuxt > div.flex.flex-grow > div.flex-grow > div.md-content > div > div:nth-child(9) > div.flex.gap-6.items-start > div.flex-grow > div:nth-child(2)";
// For multiple chapters
const mp = "#__nuxt > div.flex.flex-grow > div.flex-grow > div.md-content > div > div:nth-child(9) > div.flex.gap-6.items-start > div.flex-grow > div:nth-child(2) > div.flex.justify-center.flex-wrap.gap-2.mt-6";

// Wait for follows/latest chapters to be loaded.
waitForKeyElements("#__nuxt > div.flex.flex-grow > div.flex-grow > div.md-content > div > div:nth-child(2) > div.relative.flex.justify-between.gap-2.items-center.mb-6", async function() {
    try {
        // Count is how many chapters were loaded.
        let count = document.querySelector("#__nuxt > div.flex.flex-grow > div.flex-grow > div.md-content > div > div:nth-child(2)").childElementCount - 1;
        // Max "count" number of entries per page.
        for (let i = 2; i <= count; i++) {
            // This is to check if there's a "Show All" list so it will take care of those
            if (document.querySelector(s1 + i + ") > div").nextElementSibling != null) {
                // Number of chapters in the first half
                let count2 = document.querySelector(s1 + i + ") > div > div > div:nth-child(1)").childElementCount;
                // Number of iterations for the chapters in the first half of chapters
                for (let j = 1; j <= count2; j++) {
                    // This checks the eye icon. 0.4 means read. 1 = unread
                    if (window.getComputedStyle(document.querySelector(s1 + i + s17 + j + s18)).opacity == 0.4) {
                        // This sets the relevant chapter to be dark since it passes the "eye check"
                        document.querySelector(s1 + i + s17 + j + ")").style.opacity = "0.4";
                    }
                    // This sets the relevant chapter to be light since it passes the "eye check"
                    else {
                        document.querySelector(s1 + i + s17 + j + ")").style.opacity = "1";
                    }
                }
                // Number of chapters in the second half
                let count3 = document.querySelector(s1 + i + ") > div > div > div.animated").childElementCount;
                // Number of iterations for the chapters in the second half of chapters
                for (let k = 1; k <= count3; k++) {
                    // This checks the eye icon. 0.4 means read. 1 = unread
                    if (window.getComputedStyle(document.querySelector(s1 + i + ") > div > div > div.animated > div:nth-child(" + k + s18)).opacity == 0.4) {
                        // This sets the relevant chapter to be dark since it passes the "eye check"
                        document.querySelector(s1 + i + ") > div > div > div.animated > div:nth-child(" + k + ")").style.opacity = "0.4";
                    }
                    // This sets the relevant chapter to be light since it passes the "eye check"
                    else {
                        document.querySelector(s1 + i + ") > div > div > div.animated > div:nth-child(" + k + ")").style.opacity = "1"
                    }
                }
            }
            // These are the chapters that do not have a "Show All" list
            else {
                // Number of chapters
                let count4 = document.querySelector(s1 + i + ") > div > div > div:nth-child(1)").childElementCount;
                // Number of iterations for the count of chapters
                for (let l = 1; l <= count4; l++) {
                    // This checks the eye icon. 0.4 means read. 1 = unread
                    if (window.getComputedStyle(document.querySelector(s1 + i + s17 + l + s18)).opacity == 0.4) {
                        // This sets the relevant chapter to be dark since it passes the "eye check"
                        document.querySelector(s1 + i + s17 + l + ")").style.opacity = "0.4";
                    }
                    // This sets the relevant chapter to be light since it passes the "eye check"
                    else {
                        document.querySelector(s1 + i + s17 + l + ")").style.opacity = "1";
                    }
                }
            }
        }
    } catch (e) {
        // There shouldn't be any errors. You can check by F12 > Console
        console.log(e);
    }
});

// Wait for title pages to be loaded.
waitForKeyElements("#__nuxt > div.flex.flex-grow > div.flex-grow > div.md-content > div > div:nth-child(9) > div.flex.gap-6.items-start > div.flex-grow", async function() {
    try {
        // Number of volumes
        const countvolume = document.querySelector(vc).childElementCount;
        // If there are multiple pages
        if (document.querySelector(mp) != null) {
            volumecounter = (countvolume - 1);
        }
        // Else there aren't multiple pages
        else {
            volumecounter = countvolume;
        }
        // For every volume
        for (let m = 1; m <= volumecounter; m++) {
            // Number of chapters in current volume
            countchapter = document.querySelector(s20 + m + s9).childElementCount;
            // Checks if the volume has multi chapters
            let validmulti = document.querySelector(s20 + m + s10).innerText;
            // If it has multi chapters in the current volume. Only runs if the volume has multiple chapters ex. two groups releasing the same chapter.
            if (validmulti > countchapter) {
                // For every chapter in the volume
                for (let n = 1; n <= countchapter; n++) {
                    let countmulti = document.querySelector(start1 + m + start2 + n + ")").childElementCount;
                    // If the chapter has multiple chapters. This one is for the "parent" of the multiple chapters
                    if (countmulti > 1) {
                        // This is for the true multiple chapter count. The previous one lets us know if there are any multi chapters at all.
                        let countmulti = document.querySelector(start1 + m + start2 + n + ") > div:nth-child(2)").childElementCount;
                        // This checks the eye icon. 0.4 means read. 1 = unread
                        if (window.getComputedStyle(document.querySelector(s20 + m + s12 + n + s11 + " > svg")).opacity == 0.4) {
                            // This sets the relevant chapter to be dark since it passes the "eye check"
                            document.querySelector(s20 + m + s12 + n + s11).style.opacity = "0.4";
                        }
                        // This sets the relevant chapter to be light since it passes the "eye check"
                        else {
                            document.querySelector(s20 + m + s12 + n + s11).style.opacity = "1";
                        }
                        // This is for the multiple chapters themselves underneath the "parent"
                        for (let o = 1; o <= countmulti; o++) {
                            // This checks the eye icon. 0.4 means read. 1 = unread
                            if (window.getComputedStyle(document.querySelector(s20 + m + s12 + n + s14 + o + s15)).opacity == 0.4) {
                                // This sets the relevant chapter to be dark since it passes the "eye check"
                                document.querySelector(s20 + m + s12 + n + s14 + o + ")").style.opacity = "0.4";
                            }
                            // This sets the relevant chapter to be light since it passes the "eye check"
                            else {
                                document.querySelector(s20 + m + s12 + n + s14 + o + ")").style.opacity = "1";
                            }
                        }

                    }
                    // Else it doesn't have multiple chapters in the current volume.
                    else {
                        // This checks the eye icon. 0.4 means read. 1 = unread
                        if (window.getComputedStyle(document.querySelector(s20 + m + s12 + n + s13)).opacity == 0.4) {
                            // This sets the relevant chapter to be dark since it passes the "eye check"
                            document.querySelector(s20 + m + s12 + n + ")").style.opacity = "0.4";
                        }
                        // This sets the relevant chapter to be light since it passes the "eye check"
                        else {
                            document.querySelector(s20 + m + s12 + n + ")").style.opacity = "1";
                        }
                    }
                }
            }
            // Else the current volume does not have multiple chapters ex. two groups releasing the same chapter.
            else {
                // Darken or undarken the chapter in the volume
                for (let p = 1; p <= countchapter; p++) {
                    // This checks the eye icon. 0.4 means read. 1 = unread
                    if (window.getComputedStyle(document.querySelector(s20 + m + s12 + p + s13)).opacity == 0.4) {
                        // This sets the relevant chapter to be dark since it passes the "eye check"
                        document.querySelector(s20 + m + s12 + p + ")").style.opacity = "0.4";
                    }
                    // This sets the relevant chapter to be light since it passes the "eye check"
                    else {
                        document.querySelector(s20 + m + s12 + p + ")").style.opacity = "1";
                    }
                }
            }
        }
    } catch (e) {
        // There shouldn't be any errors. You can check by F12 > Console
        console.log(e);
    }
});