// ==UserScript==
// @name         /bag/ filter
// @namespace    http://tampermonkey.net/
// @version      1.5
// @description  Blur images in posts
// @author       Anonymous
// @match        https://boards.4chan.org/vg*
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

    // Check for a thread.
    if (!/^bag\/|\/bag\/|Blue Archive|BIue Archive/.test(document?.querySelector('.postInfo.desktop .subject')?.textContent?.trim() ?? '')) return;

    const ADD_TO_WHITELIST_TIMEOUT_MS = 15 * 60 * 1000;
    const MD5_WHITELIST_KEY = 'bagFilter';
    const IS_DISABLED_KEY = 'bagFilterDisabled';
    const FILTERED_CSS_CLASS = 'bag-filter-filtered';
    const FILTER_STYLES = `
.fileThumb img:not(.full-image).${FILTERED_CSS_CLASS} {
  width: 50px !important;
  height: 50px !important;
  opacity: 0;
}`;

    const styleSheet = document.createElement('style');
    document.head.appendChild(styleSheet);

    const opLinks = document.querySelector('.opContainer .fileText');
    const toggleLink = document.createElement('a');
    toggleLink.href = '#';
    opLinks.appendChild(document.createTextNode(' '));
    opLinks.appendChild(toggleLink);
    toggleLink.onclick = () => {
        window.localStorage.setItem(IS_DISABLED_KEY, String(!isDisabled()));
        updateToggle();
    }

    function isDisabled() {
        return window.localStorage.getItem(IS_DISABLED_KEY) === 'true';
    }

    function updateToggle() {
        if (isDisabled()) {
            toggleLink.textContent = 'enable bag filter';
            styleSheet.textContent = '';
        } else {
            toggleLink.textContent = 'disable bag filter';
            styleSheet.textContent = FILTER_STYLES;
        }
    }

    const md5Whitelist = new Set(JSON.parse(window.localStorage.getItem(MD5_WHITELIST_KEY) || '[]'));
    function update() {
        if (isDisabled()) {
            return;
        }
        const addToWhitelistPostTime = Date.now() - ADD_TO_WHITELIST_TIMEOUT_MS;
        const posts = document.querySelectorAll('.replyContainer:has(.fileThumb)');
        for (const post of posts) {
            const postTime = new Number(post.querySelector('.dateTime').dataset.utc) * 1000;
            const thumbnail = post.querySelector('img:not(.full-image');
            const md5 = thumbnail.dataset.md5;
            if (postTime < addToWhitelistPostTime && !post.classList.contains('deleted-post')) {
                md5Whitelist.add(md5);
            }
            if (!md5Whitelist.has(md5)) {
                thumbnail.classList.add(FILTERED_CSS_CLASS);
            } else {
                thumbnail.classList.remove(FILTERED_CSS_CLASS);
            }
        }
        window.localStorage.setItem(MD5_WHITELIST_KEY, JSON.stringify([...md5Whitelist]));
    }

    function fileNameMatch(post) {
        const fileName = post.querySelector('.file-info a')?.textContent;
        if (fileName) {
            return !!fileName.match(/^[0-9]{16}\.(jpg|png)$/) || !!fileName.match(/^G[A-Za-z0-9]{14,15}\.(jpg|png)$/);
        }
        return false;
    }

    // Observe for dynamic content loading (e.g., infinite scrolling)
    const observer = new MutationObserver(() => {
        update();
    });

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

    // Initial run
    updateToggle();
    update();
})();