<?php
// ✅ Configurar sesión ANTES de session_start() - 3 HORAS EXACTAS
ini_set('session.gc_maxlifetime', 10800);  // 3 horas = 10800 segundos
ini_set('session.cookie_lifetime', 10800);

session_set_cookie_params([
    'lifetime' => 10800,  // 3 horas exactas
    'path' => '/',
    'domain' => '',
    'secure' => false,    // Cambiar a true si usas HTTPS
    'httponly' => true,
    'samesite' => 'Lax'
]);

session_start();

// ✅ Actualizar timestamp de última actividad
$_SESSION['LAST_ACTIVITY'] = time();

if (!isset($_SESSION['usuario']) || !isset($_SESSION['token'])) {
    header("Location: index.html");
    exit;
}

$usuario = $_SESSION['usuario'];
$tokenSesion = $_SESSION['token'];

$host = "localhost";
$user = "ascensof_Admin1";
$password = "3DS0NCH4115H4CK3R+";
$db = "ascensof_BDsimulador";

//$host = "localhost";
//$user = "root";
//$password = "";
//$db = "siapolco_BDsimulador";

$conn = new mysqli($host, $user, $password, $db);
if ($conn->connect_error) {
    die("Error de conexión: " . $conn->connect_error);
}

// Verificar token en base de datos
$stmt = $conn->prepare("SELECT token FROM Usuarios WHERE usuario = ?");
$stmt->bind_param("s", $usuario);
$stmt->execute();
$result = $stmt->get_result();

if ($result->num_rows === 1) {
    $row = $result->fetch_assoc();
    $tokenBD = $row['token'];

    // Si el token no coincide, cerrar sesión
    if ($tokenBD !== $tokenSesion) {
        session_unset();
        session_destroy();
        header("Location: index.html?expirado=1");
        exit;
    }
} else {
    // Usuario no encontrado
    session_unset();
    session_destroy();
    header("Location: index.html?error=1");
    exit;
}

$conn->close();
?>
<!DOCTYPE html>
<html lang="es">
<head>
  <meta charset="UTF-8" />
  <meta name="viewport" content="width=device-width, initial-scale=1.0" />



  <meta name="mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">


  

  <title>Materiales Est.</title>
  <link rel="stylesheet" href="modeloP6.css" />
</head>
<body>
  <header class="header">
    <h1><span style="color:white;">SIMULADOR</span> <span style="color:#70b3ff;">AscensoFacil</span></h1>
    <h2>Materiales de Estudio</h2>
    <div class="materiasl"></div> 

    <div class="user-session">
      <div class="usuario-label">
        Usuario: <?php echo htmlspecialchars($_SESSION['nombre']); ?>
      </div>
      <button class="btn cerrar" id="btn-cerrar" onclick="logout()">Cerrar Sesión</button>
    </div>
  </header>

  <main class="contenedor">

    <div class="contenedor-general">
      <div class="barra-superior">
        <select id="materias">
          <option value="">Selecciona un tema para iniciar...</option>
        </select>
      </div>
      <div class="progreso-con-etiqueta">
        <span class="etiqueta-progreso">Reproducción</span>
        <div class="barra-progreso">
          <input type="range" id="progreso" min="0" value="0" step="1" disabled />
          <div id="progreso-texto">0 / 0</div>
        </div>
      </div>

      <div id="pregunta-actual" class="pregunta-visible">
        <div class="pregunta-texto">Haz clic en "play" para iniciar la lectura...</div>
        <div id="respuesta-actual" class="respuesta-texto" style="display:none;"></div>
      </div>
      
    </div>

    <div class="cards">
      <div class="card blue">
        <img src="iconos/audio.png" alt="icono">
        <div class="card-text">
          <h3>Balotario - Audio MP3</h3>
          <p>Audio MP3 de la materia seleccionada, pregunta - respuesta.</p>
        </div>
        <div class="audio-btn">
          <button class="btn azul" id="btn-voz">Play</button>
        </div>
      </div>
      
      <div class="card green">
        <img src="iconos/m4.png" alt="icono">
        <div class="card-text">
          <h3>Documentos PDF</h3>
          <p>Se visualizará el documento PDF de la Materia seleccionada.</p>
        </div>
        <button class="read-more" id="btn-ver-pdf">Ver PDF</button>
      </div>

      <div class="card orange">
        <img src="iconos/pdf2.png" alt="icono">
        <div class="card-text">
          <h3>Carpeta Pedagogica</h3>
          <p>Plataforma educativa de recursos digitales.</p>
        </div>
        <a href="https://carpetapedagogica.com/" target="_blank" class="read-more">Visitar</a>
      </div>

      <div class="card purple">
        <img src="iconos/pdf.png" alt="icono">
        <div class="card-text">
          <h3>Garden Tv</h3>
          <p>Trnasmisión de Televisión en vivo gratuita online.</p>
        </div>
        <a href="https://tv.garden/" target="_blank" class="read-more">Visitar</a>
      </div> 

    </div>
    
    <!-- Contenedor donde se cargará el PDF -->
    <div id="visor-pdf" style="margin-top: 20px; display: none;">
      <div style="text-align: right; margin-bottom: 5px;">
        <button id="cerrar-pdf" style="padding: 5px 10px;">✖ Cerrar</button>
      </div>
      <iframe id="pdf-frame" width="100%" height="600px" style="border: none;"></iframe>
    </div>
  </main>

  <script>
    // ✅ KEEP-ALIVE: Mantener sesión activa cada 5 minutos
    let keepAliveInterval = null;

    function iniciarKeepAlive() {
      if (keepAliveInterval) return; // Ya está iniciado
      
      console.log('🔄 Keep-alive iniciado - sesión se mantendrá activa por 3 horas');
      
      // Ejecutar inmediatamente
      mantenerSesionActiva();
      
      // Ejecutar cada 5 minutos (300000 ms)
      keepAliveInterval = setInterval(() => {
        mantenerSesionActiva();
      }, 300000);
    }

    function detenerKeepAlive() {
      if (keepAliveInterval) {
        clearInterval(keepAliveInterval);
        keepAliveInterval = null;
        console.log('⏸️ Keep-alive detenido');
      }
    }

    async function mantenerSesionActiva() {
      try {
        const response = await fetch('keep_session_alive.php', {
          method: 'POST',
          credentials: 'include',
          headers: {
            'Content-Type': 'application/json'
          }
        });
        
        const data = await response.json();
        
        if (response.ok && data.success) {
          console.log('✅ Sesión mantenida activa:', new Date().toLocaleTimeString());
        } else {
          console.warn('⚠️ Sesión no válida, redirigiendo...');
          window.location.href = 'index.html?expirado=1';
        }
      } catch (error) {
        console.error('❌ Error al mantener sesión activa:', error);
      }
    }

    function logout() {
      detenerKeepAlive(); // Detener keep-alive al cerrar sesión
      localStorage.removeItem('usuario');
      window.location.href = 'logout.php';
    }

    document.addEventListener('DOMContentLoaded', () => {
      const isDark = localStorage.getItem('modo') === 'oscuro';
      document.body.classList.toggle('dark-mode', isDark);
      
      // ✅ Iniciar keep-alive automáticamente al cargar la página
      iniciarKeepAlive();
    });

    // ✅ Detener keep-alive al salir de la página
    window.addEventListener('beforeunload', () => {
      detenerKeepAlive();
    });

    function ajustarTextoBoton() {
      const botonCerrar = document.getElementById('btn-cerrar');
      if (window.innerWidth <= 768) {
        botonCerrar.textContent = 'Cerrar';
      } else {
        botonCerrar.textContent = 'Cerrar Sesión';
      }
    }

    // Ejecutar al cargar y al redimensionar
    window.addEventListener('DOMContentLoaded', ajustarTextoBoton);
    window.addEventListener('resize', ajustarTextoBoton);
  </script>

  <!-- PDF.js CORREGIDO: Usando jsDelivr en lugar de CDNJS -->
  <script src="https://cdn.jsdelivr.net/npm/pdfjs-dist@latest/build/pdf.min.js"></script>
  
  <!-- Configuración del worker de PDF.js -->
  <script>
    // Configurar el worker de PDF.js para evitar errores
    pdfjsLib.GlobalWorkerOptions.workerSrc = 'https://cdn.jsdelivr.net/npm/pdfjs-dist@latest/build/pdf.worker.min.js';
  </script>
  
  <!-- Librería SweetAlert -->
  <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
  <script src="voz-background.js"></script>
  <script src="lectura_temario.js"></script>
  <script src="bloquear_inspeccion.js"></script>

  <script>
  document.getElementById('btn-pdf')?.addEventListener('click', function() {
      const materiaId = document.getElementById('materias').value;

      if (!materiaId) {
          Swal.fire({
              icon: 'warning',
              title: 'Seleccione una materia',
              text: 'Debe seleccionar una materia antes de exportar el PDF.',
              width: '400px'
          });
          return;
      }

      window.open(`exportar_pdf.php?materia_id=${materiaId}`, '_blank');
  });
  </script>

</body>
</html>