gistfile1.txt

// ==UserScript==
// @name         EZTVx Modern UI Polling
// @namespace    http://tampermonkey.net/
// @version      2.5
// @description  Adds a clean UI and a search box that goes to /search/slugified-query
// @author       You
// @match        *://eztvx.to/*
// @match        *://*.eztvx.to/*
// @run-at       document-start
// @grant        none
// ==/UserScript==

document.body.style.display = 'none';

(function() {
    'use strict';

    const style = document.createElement('style');
    style.innerHTML = `
        @import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400&display=swap');
        body { font-family: 'Inter', sans-serif; background: #f8f9fa; padding: 20px; color: #444; }
        .container { max-width: 900px; margin: 0 auto; }
        .card { background: white; border-radius: 8px; padding: 20px; box-shadow: 0 1px 3px rgba(0,0,0,0.08); margin-bottom: 24px; border: 1px solid #ececec; }
        h1 { margin-bottom: 10px; }
        h2 { font-weight: 300; font-size: 1.1rem; color: #666; margin-bottom: 10px; }
        table { width: 100%; border-collapse: collapse; background: #d9ebfb }
        th { text-align: left; color: #aaa; font-size: 0.65rem; text-transform: uppercase; padding: 8px; border-bottom: 1px solid #eee; font-weight: 400; }
        td { padding: 10px 8px; border-bottom: 1px solid #f9f9f9; font-weight: 300; font-size: 0.9rem; }
        a { text-decoration: none; color: #444; }
        .title-link { color: #111; }
        .actions { display: flex; gap: 12px; }

        /* Search bar styles */
        .search-bar {
            margin-bottom: 20px;
            background: white;
            border-radius: 8px;
            padding: 15px;
            border: 1px solid #ececec;
        }
        .search-form {
            display: flex;
            gap: 10px;
        }
        .search-form input {
            flex: 1;
            padding: 10px;
            border: 1px solid #ddd;
            border-radius: 4px;
            font-family: 'Inter', sans-serif;
            font-size: 0.9rem;
        }
        .search-form button {
            padding: 10px 20px;
            background: #444;
            color: white;
            border: none;
            border-radius: 4px;
            cursor: pointer;
            font-family: 'Inter', sans-serif;
            font-size: 0.9rem;
        }
        .search-form button:hover {
            background: #555;
        }
    `;
    document.head.appendChild(style);

    function getRowsFromTable(table) {
        return Array.from(table.querySelectorAll('tr[name="hover"]'));
    }

    function buildTableHTML(rows, title) {
        let html = `<div class="card"><h2>${title}</h2><table><thead><tr>
            <th>Title</th>
            <th>Size</th>
            <th>Released</th>
            <th>Seeds</th>
            <th>Actions</th>
          </tr></thead><tbody>`;
        rows.forEach(row => {
            const epInfo = row.querySelector('.epinfo');
            const showAnchor = row.querySelector('a[href*="/shows/"]');
            const magnet = row.querySelector('.magnet');
            const torrent = row.querySelector('.download_1');
            const size = row.cells[3] ? row.cells[3].innerText : '-';
            const released = row.cells[4] ? row.cells[4].innerText : '-';
            const seeds = row.cells[5] ? row.cells[5].innerText : '-';

            if (epInfo) {
                html += `<tr>
                    <td>${showAnchor ? `<a href="${showAnchor.href}" style="opacity:0.4; margin-right:8px;">📁</a>` : ''}<span class="title-link">${epInfo.innerText}</span></td>
                    <td>${size}</td>
                    <td>${released}</td>
                    <td>${seeds}</td>
                    <td class="actions">
                        <a href="${magnet ? magnet.href : '#'}" title="Magnet">🧲</a>
                        <a href="${torrent ? torrent.href : '#'}" title="Torrent">⬇️</a>
                    </td>
                </tr>`;
            }
        });
        return html + `</tbody></table></div>`;
    }

    // Polling interval
    const interval = setInterval(() => {
        const recentTable = document.querySelector('#tooltip + table + table:has(tr[name="hover"]),table + div + table:has(tr[name="hover"])');
        // const recentTableRow = document.querySelector('table + div + table tr[name="hover"]');
        const topTable = document.querySelector('table + br + table:not(:has(~ table))');
        const showTable = document.querySelector('table[width="100%"]:has(td[class="show_info_main_logo"])');

        if (recentTable) {
            console.log("EZTVx: Both tables detected. Building UI...");
            document.body.style.display = '';

            const topRows = topTable ? getRowsFromTable(topTable) : [];
            const recentRows = getRowsFromTable(recentTable);
            if(recentRows.length === 0) return
            clearInterval(interval);


            let html = `<div class="container"><h1><a href="/home">EZTVx</a></h1>`;

            // Add search bar
            html += `
                <div class="search-bar">
                    <form class="search-form" id="search-form" action="#">
                        <input type="text" id="search-query" placeholder="Search shows (e.g., 'game of thrones')" autocomplete="off">
                        <button type="submit">Search</button>
                    </form>
                </div>
            `;

            html += showTable ? showTable.innerHTML : "";
            html += topTable ? buildTableHTML(topRows, "Most Seeded") : "";
            html += buildTableHTML(recentRows, "Latest Releases");
            html += `</div>`;

            document.body.innerHTML = html;

            // Attach search handler
            const searchForm = document.getElementById('search-form');
            if (searchForm) {
                searchForm.addEventListener('submit', (e) => {
                    e.preventDefault();
                    const input = document.getElementById('search-query');
                    const query = input.value.trim();
                    if (query) {
                        // Slugify: lowercase, replace spaces with hyphens, remove non-word characters
                        let slug = query.toLowerCase()
                                     .replace(/\s+/g, '-')           // spaces to hyphens
                                     .replace(/[^\w\-]+/g, '')       // remove non-word chars except hyphen
                                     .replace(/\-\-+/g, '-')         // collapse multiple hyphens
                                     .replace(/^-+|-+$/g, '');       // trim hyphens
                        if (slug) {
                            window.location.href = `/search/${slug}`;
                        }
                    }
                });
            }
        } else {
            console.log("EZTVx: Waiting for tables...");
        }
    }, 500); // Check every 500ms
})();