// URL de los enlaces AceStream
const aceStreamUrl = 'https://ia600309.us.archive.org/8/items/abcd_20240416/Arena4view.txt';

// URL del archivo JSON con las traducciones
const translationsUrl = 'translations.json';

// Variable para almacenar el diccionario de traducciones
let translations = {};

// Variable para almacenar todos los eventos
let eventos = [];

// Función para cargar el diccionario de traducciones desde el archivo JSON
async function loadTranslations() {
    try {
        const response = await fetch(translationsUrl);
        if (!response.ok) {
            throw new Error('Error al cargar el diccionario de traducciones');
        }
        translations = await response.json();
    } catch (error) {
        console.error('Error:', error);
    }
}

// Función para obtener los enlaces AceStream
async function getAceStreamLinks() {
    try {
        const response = await fetch(aceStreamUrl);
        if (!response.ok) {
            throw new Error('Error al obtener los enlaces AceStream');
        }
        const text = await response.text();
        const lines = text.split('\n');

        // Crear un objeto de mapeo: { "av1": "acestream://...", "av2": "acestream://...", ... }
        const aceStreamMap = {};
        lines.forEach(line => {
            const [key, value] = line.split('#');
            if (key && value) {
                aceStreamMap[key.trim()] = value.trim();
            }
        });

        return aceStreamMap;
    } catch (error) {
        console.error('Error:', error);
        return {};
    }
}

// Función para formatear la fecha (eliminar el año)
function formatDate(dateString) {
    return dateString.split('/').slice(0, 2).join('/'); // Elimina el año
}

// Función para formatear la hora (eliminar "CET")
function formatTime(timeString) {
    return timeString.replace(' CET', ''); // Elimina "CET"
}

// Función para traducir las cabeceras y el contenido de la tabla (excepto el contenido de COMPETITION y EVENT)
function translateTable(table) {
    const rows = table.querySelectorAll('tr');

    // Traducir las cabeceras de todas las columnas
    const headerRow = rows[0];
    if (headerRow) {
        const headerCells = headerRow.querySelectorAll('td');
        headerCells.forEach((cell) => {
            const text = cell.textContent.trim();
            if (text) {
                const translatedText = translations[text] || text;
                cell.textContent = translatedText;
            }
        });
    }

    // Traducir el contenido de las columnas (excepto COMPETITION y EVENT)
    rows.forEach((row, rowIndex) => {
        if (rowIndex === 0) return; // Saltar la fila de cabecera

        const cells = row.querySelectorAll('td');
        cells.forEach((cell, cellIndex) => {
            // Formatear la fecha (columna DÍA)
            if (cellIndex === 0) {
                cell.textContent = formatDate(cell.textContent.trim());
            }

            // Formatear la hora (columna HORA)
            if (cellIndex === 1) {
                cell.textContent = formatTime(cell.textContent.trim());
            }

            // Omitir la traducción en las columnas COMPETITION (índice 3) y EVENT (índice 4)
            if (cellIndex === 3 || cellIndex === 4) return;

            const text = cell.textContent.trim();
            if (text) {
                // Buscar y reemplazar las palabras en inglés con sus traducciones
                const translatedText = Object.keys(translations).reduce((acc, key) => {
                    return acc.replace(new RegExp(key, 'gi'), translations[key]);
                }, text);
                cell.textContent = translatedText;
            }
        });
    });
}

// Función para mostrar los eventos de baloncesto agrupados por competición
function mostrarEventosBaloncesto(aceStreamMap) {
    const eventosDiv = document.getElementById('eventos');
    eventosDiv.innerHTML = '';  // Limpiar contenido previo

    // Agrupar los eventos por competición
    const groupedEvents = eventos.reduce((acc, evento) => {
        const [dia, hora, deporte, competicion, eventoNombre, live] = evento;

        // Solo agregar eventos de baloncesto del día en curso
        if (deporte.toLowerCase() === 'baloncesto' && dia === obtenerFechaHoy()) {
            if (!acc[competicion]) {
                acc[competicion] = []; // Crear un array para la competición si no existe
            }
            acc[competicion].push(evento);
        }
        return acc;
    }, {});

    // Si no hay eventos después del filtrado (esto se puede borrar si no lo queremos)
    if (Object.keys(groupedEvents).length === 0) {
        const noEventsHTML = `
            <div style="color: white; text-transform: uppercase; font-size: 36px; 
                text-shadow: rgb(75, 0, 130) 0px 0px 20px, rgb(75, 0, 130) 0px 0px 40px, 
                rgb(75, 0, 130) 0px 0px 60px; text-align: center;">
                <div id="texto">
                    NO HAY EVENTOS DISPONIBLES POR EL MOMENTO, PASATE MAS TARDE
                </div>
            </div>
        `;
        eventosDiv.innerHTML = noEventsHTML;
        return;
    }

    // Mostrar los eventos agrupados
    for (const competicion in groupedEvents) {
        const events = groupedEvents[competicion];

        // Crear una tarjeta para la competición
        const titleCard = document.createElement('div');
        titleCard.classList.add('title-card');
        titleCard.textContent = competicion;  // Nombre de la competición

        // Crear el contenedor de tarjetas de eventos
        const cardsContainer = document.createElement('div');
        cardsContainer.classList.add('cards-container');

        // Crear una tarjeta para cada evento
        events.forEach(evento => {
            const [dia, hora, deporte, competicion, eventoNombre, live] = evento;

            const eventCard = document.createElement('div');
            eventCard.classList.add('event-card');
            
            // Agregar hora y nombre del evento en la tarjeta
            const eventTitle = document.createElement('h3');
            eventTitle.textContent = `${hora} ${eventoNombre}`;
            eventCard.appendChild(eventTitle);

            // Descripción (puedes personalizarla)
            const eventDescription = document.createElement('p');
            eventDescription.textContent = "Disfruta del contenido";
            eventCard.appendChild(eventDescription);

            // Crear los botones para los canales
            const canales = live.trim().split(/[-\s,]+/);  // Separar canales
            canales.forEach((canal, index) => {
                const key = `av${canal}`;
                const enlace = aceStreamMap[key];
                if (enlace) {
                    const btn = document.createElement('a');
                    btn.href = enlace;
                    btn.target = "_blank";
                    btn.classList.add('btn');
                    btn.textContent = `OP${index + 1}`;
                    eventCard.appendChild(btn);
                }
            });

            // Añadir la tarjeta de evento al contenedor de eventos
            cardsContainer.appendChild(eventCard);
        });

        // Añadir la tarjeta del título de la competición y los eventos al contenedor principal
        eventosDiv.appendChild(titleCard);
        eventosDiv.appendChild(cardsContainer);
    }
}

// Función para obtener la fecha de hoy en formato DD/MM
function obtenerFechaHoy() {
    const hoy = new Date();
    const dia = String(hoy.getDate()).padStart(2, '0');
    const mes = String(hoy.getMonth() + 1).padStart(2, '0');
    return `${dia}/${mes}`;
}

// URL de la API proxy
const apiUrl = 'https://api.codetabs.com/v1/proxy/?quest=https://www.arena4viewer.co.in/misguia2.php';

// Variable para almacenar el mapa de enlaces AceStream
let aceStreamMap = {};

// Función para obtener y mostrar los eventos de baloncesto del día en curso
async function fetchData() {
    try {
        // Cargar el diccionario de traducciones
        await loadTranslations();

        // Obtener los enlaces AceStream
        aceStreamMap = await getAceStreamLinks();

        // Hacer la solicitud a la API
        const response = await fetch(apiUrl);
        if (!response.ok) {
            throw new Error('Error al obtener los datos');
        }

        // Obtener el HTML de la respuesta
        const html = await response.text();

        // Parsear el HTML para extraer la tabla
        const parser = new DOMParser();
        const doc = parser.parseFromString(html, 'text/html');
        const table = doc.querySelector('table.auto-style2');

        // Mostrar la tabla en la página
        const eventosDiv = document.getElementById('eventos');
        if (table) {
            // Eliminar la última fila de la tabla si está vacía o no tiene contenido útil
            const rows = table.querySelectorAll('tr');
            const lastRow = rows[rows.length - 1];
            const lastRowContent = lastRow.textContent.trim();

            if (
                lastRowContent === "" || // Fila vacía
                lastRowContent === "No disponible" || // Fila con "No disponible"
                lastRowContent.includes("Last update") // Fila con "Last update"
            ) {
                lastRow.remove();
            }

            // Traducir el contenido de la tabla
            translateTable(table);

            // Guardar todos los eventos en la variable global
            eventos = Array.from(rows).slice(1).map(row => {
                const cells = row.querySelectorAll('td');
                return Array.from(cells).map(cell => cell.textContent.trim());
            });

            // Mostrar solo los eventos de baloncesto del día en curso
            mostrarEventosBaloncesto(aceStreamMap);
        } else {
            eventosDiv.innerHTML = '<p>No se encontraron eventos.</p>';
        }
    } catch (error) {
        console.error('Error:', error);
        document.getElementById('eventos').innerHTML = '<p>Error al cargar los eventos.</p>';
    }
}

// Llamar a la función cuando la página cargue
window.onload = fetchData;