// ==UserScript==
// @name         Crunchyroll Watchlist Hider
// @version      2.1
// @description  Hides watched animes so it is easier to spot new episodes
// @match        https://www.crunchyroll.com/*
// @icon         https://www.google.com/s2/favicons?domain=crunchyroll.com
// @grant        none
// @namespace    https://greasyfork.org/users/206408
// @downloadURL none
// ==/UserScript==

(function() {
    'use strict';

    // Your code here...
    function l(...args){
        console.log('[Watchlist]', ...args)
    }

    function filter(){
        let container = document.querySelector(".ReactVirtualized__Grid__innerScrollContainer")
        l(container)
        for(let row of container.children){
            row = row.children[0]
            for(let item of row.children){
                let card = item.querySelector('.watchlist-card--YfKgo')
                l(card)
                if(card){ //not a loading placeholder
                    let subtitle = card.querySelector('.watchlist-card-subtitle--IROsU').textContent
                    if(subtitle.includes('Watch Again')){
                        //Do something with animes watched
                        card.style.filter = 'brightness(0.1)'
                    }
                }
            }
        }
    }

    //Observe changes to the DOM
    const observer = new MutationObserver((mutationsList, observer) => {
        if(window.location.href === 'https://www.crunchyroll.com/watchlist'){
            for(const mutation of mutationsList){
                //Items added to the watchlist grid
                if(['ReactVirtualized__Grid__innerScrollContainer', 'ReactVirtualized__Grid ReactVirtualized__List'].includes(mutation.target.className)){
                    filter()
                }
            }
        }
    })

    observer.observe(document, {subtree:true, childList:true, attributes:true})
})();