document.addEventListener("DOMContentLoaded", () => {
  const atletaId = sessionStorage.getItem("userId");

  if (!atletaId) {
    document.getElementById("rutinas-list").innerHTML =
      "<p>No se encontró tu sesión. Inicia sesión nuevamente.</p>";
    return;
  }

  fetch(`/api/rutinas/atleta/${atletaId}`)
    .then(res => {
      if (!res.ok) {
        throw new Error("Error al obtener rutinas");
      }
      return res.json();
    })
    .then(rutinas => {
      const contenedor = document.getElementById("rutinas-list");
      if (rutinas.length === 0) {
        contenedor.innerHTML = "<p>No tienes rutinas asignadas todavía.</p>";
        return;
      }
      rutinas.forEach(rutina => {
        const card = document.createElement("div");
        card.className = "card my-3";
        card.innerHTML = `
          <div class="card-body">
            <h5 class="card-title">${rutina.title}</h5>
            <p class="card-text">${rutina.nombreCompetencia || "Sin descripción"}</p>
            <button class="btn btn-success" onclick="verRutina('${rutina._id}')">Ver rutina</button>
          </div>
        `;
        contenedor.appendChild(card);
      });
    })
    .catch(err => {
      console.error(err);
      document.getElementById("rutinas-list").innerHTML =
        "<p>Error al cargar tus rutinas.</p>";
    });
});

function verRutina(id) {
  window.location.href = `simulador.html?routineId=${id}`;
}