diff --git a/js/cabecera.js b/js/cabecera.js index ca94479..d7f8d10 100644 --- a/js/cabecera.js +++ b/js/cabecera.js @@ -1,19 +1,19 @@ let idUsuarioSesion = null; $(document).ready(function () { - comprobarSesion(); - // Carga la cabecera html - $("#cabecera-container").load("cabecera.html", function () { - // Después de cargar cabecera comprobamos sesión - comprobarSesion(); - }); - }); + // Cargar la cabecera HTML e iniciar comprobación de sesión SOLO al terminar de cargar + $("#cabecera-container").load("cabecera.html", function (response, status, xhr) { + if (status === "error") { + console.error("Error al cargar cabecera.html:", xhr.status, xhr.statusText); + } else { + comprobarSesion(); + } + }); +}); // Función auxiliar para escapar texto HTML function escapeHTML(str) { - return $("
") - .text(str ?? "") - .html(); + return $("
").text(str ?? "").html(); } // Comprobar estado de sesión al cargar la página @@ -21,83 +21,75 @@ function comprobarSesion() { $.ajax({ method: "POST", url: "controladores/controladorUsuario.php", + dataType: "json", data: { orden: "comprobarSesion" }, - }).done(function (respuesta) { - try { - if (typeof respuesta === "string") { - respuesta = JSON.parse(respuesta); - } + }) + .done(function (respuesta) { + const contenedor = $("#contenedorUsuarioCabecera"); + if (!contenedor.length) return; // Si aún no existe el contenedor en HTML, cancelamos - const contenedor = $("#contenedorUsuarioCabecera"); - contenedor.empty(); + contenedor.empty(); - if (respuesta.activa && respuesta.usuario) { - // Recogemos el idUsuario de la sesion en una variable para usarlo (no me lo volváis a borrar por favor os lo pido) - idUsuarioSesion = respuesta.usuario.idUsuario; - // Obtenemos la ruta del avatar o la de por defecto - const avatarUrl = - respuesta.usuario.avatar || "img/avatars/defaultProfile.jpeg"; + if (respuesta && respuesta.activa && respuesta.usuario) { + // Guardar idUsuario globalmente + idUsuarioSesion = respuesta.usuario.idUsuario; + const avatarUrl = respuesta.usuario.avatar || "img/avatars/defaultProfile.jpeg"; - // Usuario autenticado: Mostrar Menú Dropdown con el avatar - const htmlUsuario = ` - - `; - contenedor.html(htmlUsuario); - - // Si estamos en la página principal, mostramos el botón JUGAR - if ($("#colBotonJugar").length) { - $("#colBotonJugar").removeClass("d-none"); - $("#colRanking") - .removeClass("col-lg-8") - .addClass("col-lg-7 col-xl-8"); - } - } else { - // No hay sesión: Mostrar botones de Login y Registro - const htmlInvitado = ` - - - `; - contenedor.html(htmlInvitado); + +
+ `; + contenedor.html(htmlUsuario); - // Si estamos en la página principal, ocultamos el botón JUGAR - if ($("#colBotonJugar").length) { - $("#colBotonJugar").addClass("d-none"); - $("#colRanking") - .removeClass("col-lg-7 col-xl-8") - .addClass("col-lg-8"); - } + // Si estamos en la página principal, mostramos el botón JUGAR + if ($("#colBotonJugar").length) { + $("#colBotonJugar").removeClass("d-none"); + $("#colRanking").removeClass("col-lg-8").addClass("col-lg-7 col-xl-8"); + } + } else { + // No hay sesión: Botones de Login y Registro + const htmlInvitado = ` + + + `; + contenedor.html(htmlInvitado); + + if ($("#colBotonJugar").length) { + $("#colBotonJugar").addClass("d-none"); + $("#colRanking").removeClass("col-lg-7 col-xl-8").addClass("col-lg-8"); } - } catch (e) { - console.error("Error al procesar la respuesta de la sesión:", e); } + }) + .fail(function (xhr, status, error) { + console.error("Error en comprobarSesion AJAX:", error, xhr.responseText); }); } -// Registro -$("#formRegistro").on("submit", function (event) { +// Registro de usuario +$(document).on("click", "#botonAceptarRegistro", function (event) { event.preventDefault(); let nombreUsuario = $("#regNombre").val().trim(); @@ -105,61 +97,64 @@ $("#formRegistro").on("submit", function (event) { let contrasena = $("#regPassword").val(); let contrasenaConfirmacion = $("#regPasswordConfirm").val(); - $("#regNombre").removeClass("is-invalid"); - $("#regEmail").removeClass("is-invalid"); - $("#regPassword").removeClass("is-invalid"); - $("#regPasswordConfirm").removeClass("is-invalid"); - $("#errorRegistro").text(""); + // Resetear estados visuales + $("#regNombre, #regEmail, #regPassword, #regPasswordConfirm").removeClass("is-invalid"); + $("#errorRegistro").removeClass("text-danger text-success").text("").show(); if (contrasena !== contrasenaConfirmacion) { - $("#regPassword").addClass("is-invalid"); - $("#regPasswordConfirm").addClass("is-invalid"); - $("#errorRegistro").text("Las contraseñas no coinciden."); + $("#regPassword, #regPasswordConfirm").addClass("is-invalid"); + $("#errorRegistro").addClass("text-danger").text("Las contraseñas no coinciden."); return; } $.ajax({ method: "POST", url: "controladores/controladorUsuario.php", + dataType: "json", data: { nombreUsuario: nombreUsuario, email: email, contrasena: contrasena, orden: "registrarUsuario", }, - }).done(function (respuesta) { - if (typeof respuesta === "string") respuesta = JSON.parse(respuesta); - + }) + .done(function (respuesta) { if (respuesta.error) { - $("#errorRegistro").text(respuesta.error); - $("#regNombre").addClass("is-invalid"); - $("#regEmail").addClass("is-invalid"); + $("#errorRegistro").addClass("text-danger").text(respuesta.error); + $("#regNombre, #regEmail").addClass("is-invalid"); } else { + // Mostrar mensaje de confirmación $("#errorRegistro") .removeClass("text-danger") - .addClass("text-success") - .text(respuesta.exito); + .addClass("text-success fw-bold") + .text(respuesta.exito || "¡Registro completado con éxito!"); - $("#formRegistro")[0].reset(); + if ($("#formRegistro").length) { + $("#formRegistro")[0].reset(); + } + // Recargar para iniciar sesión tras 1.5 segundos setTimeout(function () { location.reload(); - }, 1000); + }, 1500); } + }) + .fail(function (xhr, status, error) { + console.error("Error en el registro:", error, xhr.responseText); + $("#errorRegistro").addClass("text-danger").text("Error de conexión con el servidor."); }); }); -// Login -$("#botonAceptarLogin").click(function (event) { +// Login de usuario +$(document).on("click", "#botonAceptarLogin", function (event) { event.preventDefault(); let email = $("#loginEmail").val().trim(); let contrasena = $("#loginPassword").val(); let recuerdame = $("#recordar").is(":checked"); - $("#loginEmail").removeClass("is-invalid"); - $("#loginPassword").removeClass("is-invalid"); - $("#errorLogin").text(""); + $("#loginEmail, #loginPassword").removeClass("is-invalid"); + $("#errorLogin").removeClass("text-success").addClass("text-danger").text("").show(); if (email === "" || contrasena === "") { $("#errorLogin").text("Todos los campos son obligatorios."); @@ -171,41 +166,43 @@ $("#botonAceptarLogin").click(function (event) { $.ajax({ method: "POST", url: "controladores/controladorUsuario.php", + dataType: "json", data: { email: email, contrasena: contrasena, recuerdame: recuerdame, orden: "comprobarUsuario", }, - }).done(function (respuesta) { - if (typeof respuesta === "string") respuesta = JSON.parse(respuesta); - + }) + .done(function (respuesta) { if (respuesta.error) { - $("#loginEmail").addClass("is-invalid"); - $("#loginPassword").addClass("is-invalid"); + $("#loginEmail, #loginPassword").addClass("is-invalid"); $("#errorLogin").text(respuesta.error); } else { + // Login correcto: Recargar la vista location.reload(); } + }) + .fail(function (xhr, status, error) { + console.error("Error en el login:", error, xhr.responseText); + $("#errorLogin").text("Error de conexión o respuesta no válida del servidor."); }); }); -// Cerrar sesión +// Cerrar sesión $(document).on("click", "#botonCerrarSesion", function (event) { event.preventDefault(); $.ajax({ method: "POST", url: "controladores/controladorUsuario.php", + dataType: "json", data: { orden: "cerrarSesion" }, - }).done(function (respuesta) { - if (typeof respuesta === "string") respuesta = JSON.parse(respuesta); - - if (respuesta.error) { - console.log(respuesta.error); - } else { - window.location.href = "index.php"; - } + }) + .done(function (respuesta) { + window.location.href = "index.php"; + }) + .fail(function () { + window.location.href = "index.php"; }); }); -