andante.js

andante.js

(($0) => {
    const pages = Array.from($0.querySelectorAll(':scope > div[style^="width"]')).slice(1); // drop first page
    const urls = new Set();

    const scanNextPage = () => {
        const oldUrlsSize = urls.size;
        $0.querySelectorAll('img[src*=".svg"]').forEach(img => urls.add(img.src));

        if (oldUrlsSize !== urls.size) {
            if(pages.length > 0) {
                pages.shift().scrollIntoView({ behavior: 'smooth', block: 'center', inline: 'center' });
            } else if (pages.length === 0) {
                document.body.innerHTML = [...urls].sort().map(i => '<img src="'+i+'">').join('') + 
                '<style>img { max-width: 100%; max-height: 100%; page-break-after: always;</style>';
            }
        }
    };

    const observer = new MutationObserver(scanNextPage);
    observer.observe($0, { subtree: true, childList: true, attributes: true });

    scanNextPage();
})(document.querySelector('[id*="-scroller-"]'));