<?php

class Footer {

    public function render() {
        return '

        <!-- Jquery JS -->

        <script src="libs/jquery/jquery-3.7.1.min.js"></script>

        <!-- Bootstrap JS -->

        <script src="libs/bootstrap/js/bootstrap.bundle.min.js"></script>

        <!-- Datatables JS -->

        <script src="libs/datatables/js/jquery.dataTables.min.js"></script>
        <script src="libs/datatables/js/dataTables.bootstrap5.min.js"></script>

        <!-- Chartjs JS -->

        <script src="libs/chartjs/chart.umd.js"></script>

        <!-- Loader global (animación de carga) -->
        
            <script>

            // Espera a que cargue la vista (HTML)

            document.addEventListener("DOMContentLoaded", function () {

                // Se obtiene el laoder

                const loader = document.getElementById("page-loader");

                // Retorna (corta ejecución) si no lo encuentra

                if (!loader) return;

                // Se guarda el momento en el que empezó y el minimo que debe mostrarse (100ms)

                const MIN_TIME = 100;
                const startTime = Date.now();

                // Función para ocultarlo (acá se define)

                const hideLoader = () => {

                    // Calcula cuanto tiempo pasó y cuanto falta para llegar al minimo

                    const elapsed = Date.now() - startTime;
                    const remaining = MIN_TIME - elapsed;

                    // Se oculta con delay controlado (espera lo que falta para cumplir el minimo)

                    setTimeout(() => {

                        // Animacioón

                        loader.classList.add("fade-out");

                        // Espera a que termine la animación (300ms) y lo saca del flujo

                        setTimeout(() => {
                            loader.style.display = "none";
                        }, 300);
                    }, Math.max(0, remaining)); // Espera a que remaining llegue a 0 (si ya pasó el tiempo no espera)
                };

                hideLoader();
            });

            </script>

        </body>
        </html>';
    }
}