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

(function () {
    'use strict';

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

    let filterActive = true;
    let timerElement = null;
    let timerInterval = null;
    let timerEndTime = null;

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

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

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

    function createTimerDisplay() {
        timerElement = document.createElement('div');
        timerElement.style.position = 'fixed';
        timerElement.style.top = '10px';
        timerElement.style.right = '10px';
        timerElement.style.backgroundColor = 'rgba(0, 0, 0, 0.7)';
        timerElement.style.color = 'white';
        timerElement.style.padding = '5px 10px';
        timerElement.style.borderRadius = '5px';
        timerElement.style.zIndex = '9999';
        timerElement.style.fontFamily = 'monospace';
        timerElement.style.fontSize = '14px';
        timerElement.style.cursor = 'pointer';
        timerElement.title = 'Click to restart filter timer';

        timerElement.addEventListener('click', startFilterTimer);

        document.body.appendChild(timerElement);
    }

    function startFilterTimer() {
        if (timerInterval) {
            clearInterval(timerInterval);
        }

        filterActive = true;

        applyPartialImageFiltering();

        timerEndTime = Date.now() + (15 * 60 * 1000);

        updateTimerDisplay();

        timerInterval = setInterval(updateTimerDisplay, 1000);
    }

    function updateTimerDisplay() {
        if (!timerElement) return;

        const currentTime = Date.now();
        const timeRemaining = timerEndTime - currentTime;

        if (timeRemaining <= 0) {
            timerElement.textContent = "Filter Off";
            timerElement.style.backgroundColor = 'rgba(255, 0, 0, 0.7)';
            clearInterval(timerInterval);

            filterActive = false;

            removeAllFilters();
        } else {
            const minutes = Math.floor(timeRemaining / 60000);
            const seconds = Math.floor((timeRemaining % 60000) / 1000);

            timerElement.textContent = `Filter: ${minutes.toString().padStart(2, '0')}:${seconds.toString().padStart(2, '0')}`;
            timerElement.style.backgroundColor = 'rgba(0, 0, 0, 0.7)';
        }
    }

    function removeAllFilters() {
        const filteredImages = document.querySelectorAll('.filtered-image');
        filteredImages.forEach(img => {
            img.classList.remove('filtered-image');
        });
    }

    function applyPartialImageFiltering() {
        if (!filterActive) return;

        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 });

    createTimerDisplay();

    startFilterTimer();
    patchExtensionCompatibility();
})();