const sonido = new Audio("/static/media/0457.wav");
const estadoAnterior = {};

let ultimoFooter = "";

function cargarTabla(endpoint, tablaId, esQuiro) {
    fetch(endpoint)
        .then(res => res.json())
        .then(filas => {
            const tbody = document.getElementById(tablaId);
            tbody.innerHTML = "";

            let sizeClass = "";
            if (filas.length < 7) {
                sizeClass = "text-8xl";
            } else {
                sizeClass = "text-7xl"
            }

            filas.forEach(fila => {
                const id = fila[0];

                const tr = document.createElement("tr");

                const td1 = document.createElement("td");
                td1.textContent = fila[0];
                td1.className = `border align-middle ${sizeClass} m`;
                if (esQuiro === "1") {
                    td1.style.backgroundColor = "#008968";
                } else {
                    td1.style.backgroundColor = window.themeColors.bg1;
                }
                tr.appendChild(td1);

                const td2 = document.createElement("td");

                const estadoConsulta = fila[1];
                const estadoTurno = fila[3];

                if (estadoConsulta == 0) {
                    td2.textContent = "-";
                    td2.className = `border bg-[#a9a9a9] align-middle ${sizeClass}`;
                } else if (estadoConsulta == 1) {
                    td2.textContent = fila[2];
                    if (esQuiro === "1") {
                        td2.style.backgroundColor = "#00aa7a";
                    } else {
                        td2.style.backgroundColor = window.themeColors.bg2;
                    }
                    const originalText = fila[2];
                    const blinkText = `<span class="text-[2.25rem]">PASE A<br>CONSULTA</span>`;
                    let blink = false;

                    if (estadoTurno == 1) {
                        td2.className = `border align-middle ${sizeClass}`;
                        td2.innerHTML = originalText;
                        td2.style.backgroundColor = '#ffff00';
                        td2.style.color = "#000000";

                        if (td2.blinkInterval) {
                            clearInterval(td2.blinkInterval);
                        }

                        if (esQuiro === "1") {
                            td2.blinkInterval = setInterval(() => {
                                blink = !blink;
                                if (blink) {
                                    td2.style.backgroundColor = "#00aa7a";
                                    td2.style.color = "#FFFFFF";
                                } else {
                                    td2.style.backgroundColor = '#ffff00';
                                    td2.style.color = "#000000";
                                }
                            }, 1500);
                        } else {
                            td2.blinkInterval = setInterval(() => {
                                blink = !blink;
                                if (blink) {
                                    td2.innerHTML = blinkText;
                                    td2.style.fontWeight = "bold";
                                } else {
                                    td2.textContent = originalText;
                                    td2.style.fontWeight = "";
                                }
                            }, 1500);
                        }

                    } else {
                        td2.className = `border align-middle ${sizeClass}`;
                        if (esQuiro === "1") {
                            td2.style.backgroundColor = "#00aa7a";
                        } else {
                            td2.style.backgroundColor = window.themeColors.bg2;
                        }
                        td2.textContent = originalText;

                        if (td2.blinkInterval) {
                            clearInterval(td2.blinkInterval);
                            td2.blinkInterval = null;
                        }
                    }
                } else {
                    td2.textContent = fila[2];
                    td2.className = `border bg-[#a9a9a9] align-middle ${sizeClass}`;
                }

                if (estadoAnterior[id] === 2 && estadoTurno === 1) {
                    sonido.play();
                }

                estadoAnterior[id] = estadoTurno;

                tr.appendChild(td2);
                tbody.appendChild(tr);
            });
        });
}

function cargarFooter() {
    fetch("/api/footer")
        .then(res => res.text())
        .then(data => {
            if (data !== ultimoFooter) {
                const footerText = document.getElementById("footer-text");
                const footerTextDuplicate = document.getElementById("footer-text-duplicate");

                footerText.innerHTML = data;
                footerTextDuplicate.innerHTML = data;

                ultimoFooter = data;
            }
        });
}

function actualizarTablas() {
    cargarTabla("/api/datos1", "turnos1", quiro1);
    cargarTabla("/api/datos2", "turnos2", quiro2);
    //if (document.getElementById("turnos2")) {
    //    cargarTabla("/api/datos2", "turnos2");
    //}
}

//cargarFooter();
actualizarTablas();
setInterval(actualizarTablas, 20000);
//setInterval(cargarFooter, 45000);