// ==UserScript==
// @name         filter v1
// @namespace    http://tampermonkey.net/
// @version      1.4.3
// @description
// @author       Anonymous
// @match        https://boards.4chan.org/vg*
// @grant        none
// ==/UserScript==

(function () {
    'use strict';

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

    const style = document.createElement('style');
    style.textContent = `
        .fileThumb img.filtered-image {
            width: 40px !important;
            height: 40px !important;
            object-fit: cover;
            object-position: center top;
            transition: all 0.2s ease;
        }

        .fileThumb:hover img.filtered-image {
            width: auto !important;
            height: auto !important;
            object-fit: initial;
            z-index: 100;
        }

        .deleted-post {
            display: none;
        }
    `;
    document.head.appendChild(style);

    function applyPartialImageFiltering() {
        const posts = document.querySelectorAll('.postContainer');
        posts.forEach((post) => {
            const fileText = post.querySelector('.fileText-original, .fileText');
            if (!fileText) return;

            const link = fileText.querySelector('a');
            if (!link) return;

            const filename = link.textContent.trim();

            const isPng = /.png$/i.test(filename);
            const isJpg = /.jpg$/i.test(filename);

            if (isPng || isJpg) {

            } else {
                const fileTypeRegex = /.(gif|mp4|webm)$/i;
                if (fileTypeRegex.test(filename)) return;
            }

            const img = post.querySelector('.fileThumb img');
            if (img && !img.classList.contains('filtered-image')) {

                img.classList.add('filtered-image');

                if (!img.dataset.originalWidth) {
                    img.dataset.originalWidth = img.style.width || img.getAttribute('width') || '';
                    img.dataset.originalHeight = img.style.height || img.getAttribute('height') || '';
                }

                img.dataset.filtered = 'true';
            }
        });
    }

    function patchExtensionCompatibility() {

        setTimeout(() => {

            if (window.ImageExpansion) {
                const originalExpand = window.ImageExpansion.expand;
                window.ImageExpansion.expand = function(e) {
                    const img = e.target.nodeName === 'IMG' ? e.target : e.target.querySelector('img');
                    if (img && img.dataset.filtered === 'true') {

                        img.classList.remove('filtered-image');
                    }

                    return originalExpand.apply(this, arguments);
                };
            }
        }, 1000);
    }

    const observer = new MutationObserver(() => {
        applyPartialImageFiltering();
    });
    observer.observe(document.body, { childList: true, subtree: true });

    applyPartialImageFiltering();
    patchExtensionCompatibility();
})();