Komga UserScript

userscript.js

// ==UserScript==
// @name         ComicEater Komga
// @namespace    http://tampermonkey.net/
// @version      0.1
// @description  try to take over the world!
// @author       You
// @match        http://localhost:3030/*
// @icon         https://www.google.com/s2/favicons?domain=google.com
// @grant        GM_addStyle
// ==/UserScript==

function setCount() {
    try {
        const pageLeftEl = document.querySelectorAll('.text-caption.text-center.mt-1')[0];
        const pagesLeft = Number(pageLeftEl.textContent.replace(' pages left', ''));
        const pagesTotal = Number(document.querySelector(".col.col-auto").textContent.split(' · ')[1].replace(' pages ', ''));
        const pageIndex = pagesTotal - pagesLeft;
        if (pageIndex) {
            pageLeftEl.textContent = `Resume from page ${pageIndex} ┃ ${pageLeftEl.textContent}`;
        }
    } catch(error){
        console.log(error)
    }
}

function getNumber(s) {
    if (!(s?.match)) return;
    let firstNumber = null;
    const match = s.match(/\d+/);
    if (match) {
        firstNumber = parseInt(match[0], 10);
    }
    return firstNumber;
}


function renumber(){
    if ( !location.href.includes('series')){
        return false;
    }
    const volumes = Array.from(document.querySelectorAll(".v-card__subtitle.pa-2.pb-1.text--primary"))
    volumes.forEach((entry, index) => {
        try {
            const volNum = entry.textContent.match(/年(\d+.*?)号/)?.[1];
            if (!volNum) {
                return;
            }
            const orderNumber = entry.textContent.match(/\d+/)?.[0];
            entry.textContent = entry.textContent.replace(orderNumber, volNum)
        } catch(error){
            console.log(error)
        }
    });
}

function setMissing() {
    if ( !location.href.includes('series/')){
        return false;
    }
    const volumes = Array.from(document.querySelectorAll(".v-card__subtitle.pa-2.pb-1.text--primary"))

    const volsToMark = []
    volumes.forEach((entry, index) => {
        const prevVol = 0;
        if(index > 0){
            let prevVol = volumes[index - 1];
            let currNum = getNumber(entry.textContent)
            let prevNum = getNumber(prevVol.textContent)
            if( currNum - prevNum > 1){
                volsToMark.push(entry);
                entry.style.cssText = 'color:tomato !important';
            }
        }
    });
}

function onPageChange(){
    try {
        setMissing();
    } catch (err) {
        console.log(err);
    }
    try {
        setCount();
    } catch (err) {
        console.log(err);
    }
    try {
        renumber()
    } catch (err) {
        console.log(err);
    }
    console.log('here')
}

function detectPageChange() {
    var previousUrl = '';
    var observer = new MutationObserver(function(mutations) {
        if (location.href !== previousUrl && !location.href.includes("redirect")) {
            previousUrl = location.href;
            console.log(`URL changed to ${location.href}`);
            setTimeout(onPageChange, 500);

        }
    });

    const config = {subtree: true, childList: true};
    observer.observe(document, config);
}

(function() {
    'use strict';

    // Define your custom CSS styles here
    const customStyles = `
        /* Adjust the width of the specified element */
        .v-card.v-card--link.v-sheet.theme--dark.no-link {
            width: 400px !important;
        }

        /* Your additional styles go here */
    `;
    GM_addStyle(customStyles);
    detectPageChange();

})();