arreglado crear sala

This commit is contained in:
2026-09-28 09:01:45 +02:00
parent 9a5575fe25
commit 0370f477da
+103 -220
View File
@@ -1,28 +1,25 @@
let usuarioYaEstaEnEquipo = false; let usuarioYaEstaEnEquipo = false;
$(document).ready(function () { $(document).ready(function () {
comprobarSalaUsuario(); comprobarSalaUsuario();
}); });
function comprobarSalaUsuario() { function comprobarSalaUsuario() {
$("#cargandoSalas").remove();
$("#cargandoSalas").remove(); $.ajax({
$.ajax({
url: "controladores/ControladorEquipoxUsuario.php", url: "controladores/ControladorEquipoxUsuario.php",
type: "POST", type: "POST",
dataType: "json", dataType: "json",
data: { data: {
orden: "obtenerSalaUsuario" orden: "obtenerSalaUsuario",
}, },
success: function (respuesta) { success: function (respuesta) {
console.log("Sala del usuario:", respuesta); console.log("Sala del usuario:", respuesta);
if (respuesta.error) { if (respuesta.error) {
console.error(respuesta.error); console.error(respuesta.error);
usuarioYaEstaEnEquipo = false; usuarioYaEstaEnEquipo = false;
@@ -33,15 +30,12 @@ $.ajax({
} }
if (respuesta.asociado) { if (respuesta.asociado) {
usuarioYaEstaEnEquipo = true; usuarioYaEstaEnEquipo = true;
$("#contenedorCrearSala").hide(); $("#contenedorCrearSala").hide();
cargarSalaUsuario(respuesta.idPartida); cargarSalaUsuario(respuesta.idPartida);
} else { } else {
usuarioYaEstaEnEquipo = false; usuarioYaEstaEnEquipo = false;
cargarSalas(); cargarSalas();
@@ -49,37 +43,28 @@ $.ajax({
}, },
error: function (xhr, status, error) { error: function (xhr, status, error) {
console.error("Error al comprobar la sala del usuario:", error);
console.error(
"Error al comprobar la sala del usuario:",
error
);
usuarioYaEstaEnEquipo = false; usuarioYaEstaEnEquipo = false;
cargarSalas(); cargarSalas();
} },
}); });
} }
function cargarSalaUsuario(idPartida) { function cargarSalaUsuario(idPartida) {
$.ajax({
$.ajax({
url: "controladores/controladorPartida.php", url: "controladores/controladorPartida.php",
type: "POST", type: "POST",
dataType: "json", dataType: "json",
data: { data: {
orden: "buscar", orden: "buscar",
idPartida: idPartida idPartida: idPartida,
}, },
success: function (partida) { success: function (partida) {
if (partida.error) { if (partida.error) {
console.error(partida.error); console.error(partida.error);
return; return;
@@ -91,37 +76,28 @@ $.ajax({
}, },
error: function (xhr, status, error) { error: function (xhr, status, error) {
console.error("Error al obtener la sala del usuario:", error);
console.error( },
"Error al obtener la sala del usuario:", });
error
);
}
});
} }
function cargarSalas() { function cargarSalas() {
$.ajax({
$.ajax({
url: "controladores/controladorPartida.php", url: "controladores/controladorPartida.php",
type: "POST", type: "POST",
dataType: "json", dataType: "json",
data: { data: {
orden: "listar" orden: "listar",
}, },
success: function (partidas) { success: function (partidas) {
const contenedor = $("#contenedorSalas"); const contenedor = $("#contenedorSalas");
contenedor.empty(); contenedor.empty();
contenedor.empty(); contenedor.empty();
if (!Array.isArray(partidas) || partidas.length === 0) { if (!Array.isArray(partidas) || partidas.length === 0) {
contenedor.html(` contenedor.html(`
<div class="col-12 text-center"> <div class="col-12 text-center">
<p class="text-muted"> <p class="text-muted">
@@ -134,38 +110,28 @@ $.ajax({
} }
partidas.forEach(function (partida) { partidas.forEach(function (partida) {
cargarInformacionSala(partida); cargarInformacionSala(partida);
}); });
}, },
error: function (xhr, status, error) { error: function (xhr, status, error) {
console.error("Error al obtener las partidas:", error);
console.error( },
"Error al obtener las partidas:", });
error
);
}
});
} }
function cargarInformacionSala(partida) { function cargarInformacionSala(partida) {
$.ajax({
$.ajax({
url: "controladores/controladorPartida.php", url: "controladores/controladorPartida.php",
type: "POST", type: "POST",
dataType: "json", dataType: "json",
data: { data: {
orden: "getEquipos", orden: "getEquipos",
idPartida: partida.idPartida idPartida: partida.idPartida,
}, },
success: function (equipos) { success: function (equipos) {
$.ajax({ $.ajax({
url: "controladores/controladorPartida.php", url: "controladores/controladorPartida.php",
type: "POST", type: "POST",
@@ -173,60 +139,39 @@ $.ajax({
data: { data: {
orden: "getJugadores", orden: "getJugadores",
idPartida: partida.idPartida idPartida: partida.idPartida,
}, },
success: function (jugadores) { success: function (jugadores) {
mostrarSala(partida, equipos, jugadores);
mostrarSala(
partida,
equipos,
jugadores
);
}, },
error: function (xhr, status, error) { error: function (xhr, status, error) {
console.error("Error al obtener jugadores:", error);
console.error( },
"Error al obtener jugadores:",
error
);
}
}); });
}, },
error: function (xhr, status, error) { error: function (xhr, status, error) {
console.error("Error al obtener equipos:", error);
console.error( },
"Error al obtener equipos:", });
error
);
}
});
} }
function mostrarSala(partida, equipos, jugadores) { function mostrarSala(partida, equipos, jugadores) {
const contenedor = $("#contenedorSalas");
const contenedor = $("#contenedorSalas"); let equiposHTML = "";
let equiposHTML = "";
equipos.forEach(function (equipo) {
equipos.forEach(function (equipo) {
const jugadoresEquipo = jugadores.filter(function (jugador) { const jugadoresEquipo = jugadores.filter(function (jugador) {
return jugador.idEquipo == equipo.idEquipo; return jugador.idEquipo == equipo.idEquipo;
}); });
let jugadoresHTML = ""; let jugadoresHTML = "";
if (jugadoresEquipo.length > 0) { if (jugadoresEquipo.length > 0) {
jugadoresEquipo.forEach(function (jugador) { jugadoresEquipo.forEach(function (jugador) {
jugadoresHTML += ` jugadoresHTML += `
<div class="jugador"> <div class="jugador">
@@ -239,9 +184,7 @@ equipos.forEach(function (equipo) {
</div> </div>
`; `;
}); });
} else { } else {
jugadoresHTML = ` jugadoresHTML = `
<div class="text-muted small"> <div class="text-muted small">
Sin jugadores Sin jugadores
@@ -249,11 +192,9 @@ equipos.forEach(function (equipo) {
`; `;
} }
let botonUnirseHTML = ""; let botonUnirseHTML = "";
if (!usuarioYaEstaEnEquipo) { if (!usuarioYaEstaEnEquipo) {
botonUnirseHTML = ` botonUnirseHTML = `
<button <button
type="button" type="button"
@@ -267,7 +208,6 @@ equipos.forEach(function (equipo) {
`; `;
} }
equiposHTML += ` equiposHTML += `
<div class="equipo"> <div class="equipo">
@@ -285,10 +225,9 @@ equipos.forEach(function (equipo) {
</div> </div>
`; `;
}); });
const salaHTML = `
const salaHTML = `
<div class="col-12 col-md-10 col-lg-8"> <div class="col-12 col-md-10 col-lg-8">
<div class="sala"> <div class="sala">
@@ -314,35 +253,25 @@ const salaHTML = `
</div> </div>
`; `;
contenedor.append(salaHTML);
contenedor.append(salaHTML);
} }
// ====================================================== // ======================================================
// UNIRSE A UN EQUIPO // UNIRSE A UN EQUIPO
// ====================================================== // ======================================================
$(document).on( $(document).on("click", ".btn-unirse-equipo", function () {
"click",
".btn-unirse-equipo",
function () {
const boton = $(this); const boton = $(this);
const idEquipo = boton.data("id-equipo"); const idEquipo = boton.data("id-equipo");
const idPartida = boton.data("id-partida"); const idPartida = boton.data("id-partida");
boton.prop("disabled", true); boton.prop("disabled", true);
boton.text("Uniéndose..."); boton.text("Uniéndose...");
$.ajax({ $.ajax({
url: "controladores/ControladorEquipoxUsuario.php", url: "controladores/ControladorEquipoxUsuario.php",
type: "POST", type: "POST",
@@ -351,20 +280,13 @@ function () {
data: { data: {
orden: "registrarUsuarioEnEquipo", orden: "registrarUsuarioEnEquipo",
idEquipo: idEquipo idEquipo: idEquipo,
}, },
success: function (respuesta) { success: function (respuesta) {
console.log("Respuesta al unirse:", respuesta);
console.log(
"Respuesta al unirse:",
respuesta
);
if (respuesta.error) { if (respuesta.error) {
alert(respuesta.error); alert(respuesta.error);
boton.prop("disabled", false); boton.prop("disabled", false);
@@ -374,233 +296,194 @@ function () {
return; return;
} }
// ========================================== // ==========================================
// UNIÓN CORRECTA // UNIÓN CORRECTA
// ========================================== // ==========================================
usuarioYaEstaEnEquipo = true; usuarioYaEstaEnEquipo = true;
// Ocultamos el botón "Crear sala" // Ocultamos el botón "Crear sala"
$("#contenedorCrearSala").hide(); $("#contenedorCrearSala").hide();
// Eliminamos las salas actuales // Eliminamos las salas actuales
$("#contenedorSalas").empty(); $("#contenedorSalas").empty();
// Cargamos directamente la sala // Cargamos directamente la sala
// donde acaba de entrar el usuario // donde acaba de entrar el usuario
cargarSalaUsuario(idPartida); cargarSalaUsuario(idPartida);
}, },
error: function (xhr, status, error) { error: function (xhr, status, error) {
console.error("Error al unirse al equipo:", error);
console.error( console.error("Respuesta del servidor:", xhr.responseText);
"Error al unirse al equipo:",
error
);
console.error(
"Respuesta del servidor:",
xhr.responseText
);
alert(
"No se ha podido unir al equipo."
);
alert("No se ha podido unir al equipo.");
boton.prop("disabled", false); boton.prop("disabled", false);
boton.text("Unirse"); boton.text("Unirse");
} },
}); });
} });
);
// ====================================================== // ======================================================
// ESCAPAR HTML // ESCAPAR HTML
// ====================================================== // ======================================================
function escapeHTML(texto) { function escapeHTML(texto) {
return $("<div>")
return $("<div>")
.text(texto ?? "") .text(texto ?? "")
.html(); .html();
} }
// ====================================================== // ======================================================
// CREAR SALA // CREAR SALA
// ====================================================== // ======================================================
$("#btnCrearSala").on( $("#btnCrearSala").on("click", function () {
"click", const nombreSala = $("#nombreSala").val().trim();
function () {
const nombreSala = const nombreEquipo1 = $("#nombreEquipo1").val().trim();
$("#nombreSala").val().trim();
const nombreEquipo1 =
$("#nombreEquipo1").val().trim();
const nombreEquipo2 =
$("#nombreEquipo2").val().trim();
const nombreEquipo2 = $("#nombreEquipo2").val().trim();
let valido = true; let valido = true;
let valido = true;
$(".mensaje-error-sala").remove(); $(".mensaje-error-sala").remove();
$(".input-kahoot").removeClass( $(".input-kahoot").removeClass("is-invalid");
"is-invalid"
);
if (nombreSala === "") { if (nombreSala === "") {
mostrarError("#nombreSala", "El nombre de la sala es obligatorio.");
mostrarError(
"#nombreSala",
"El nombre de la sala es obligatorio."
);
valido = false; valido = false;
} else if (nombreSala.length < 3) { } else if (nombreSala.length < 3) {
mostrarError( mostrarError(
"#nombreSala", "#nombreSala",
"El nombre de la sala debe tener al menos 3 caracteres." "El nombre de la sala debe tener al menos 3 caracteres.",
); );
valido = false; valido = false;
} }
if (nombreEquipo1 === "") { if (nombreEquipo1 === "") {
mostrarError("#nombreEquipo1", "El nombre del equipo 1 es obligatorio.");
mostrarError(
"#nombreEquipo1",
"El nombre del equipo 1 es obligatorio."
);
valido = false; valido = false;
} else if (nombreEquipo1.length < 2) { } else if (nombreEquipo1.length < 2) {
mostrarError( mostrarError(
"#nombreEquipo1", "#nombreEquipo1",
"El nombre del equipo debe tener al menos 2 caracteres." "El nombre del equipo debe tener al menos 2 caracteres.",
); );
valido = false; valido = false;
} }
if (nombreEquipo2 === "") { if (nombreEquipo2 === "") {
mostrarError("#nombreEquipo2", "El nombre del equipo 2 es obligatorio.");
mostrarError(
"#nombreEquipo2",
"El nombre del equipo 2 es obligatorio."
);
valido = false; valido = false;
} else if (nombreEquipo2.length < 2) { } else if (nombreEquipo2.length < 2) {
mostrarError( mostrarError(
"#nombreEquipo2", "#nombreEquipo2",
"El nombre del equipo debe tener al menos 2 caracteres." "El nombre del equipo debe tener al menos 2 caracteres.",
); );
valido = false; valido = false;
} }
if ( if (
nombreEquipo1 !== "" && nombreEquipo1 !== "" &&
nombreEquipo2 !== "" && nombreEquipo2 !== "" &&
nombreEquipo1.toLowerCase() === nombreEquipo1.toLowerCase() === nombreEquipo2.toLowerCase()
nombreEquipo2.toLowerCase()
) { ) {
mostrarError( mostrarError(
"#nombreEquipo2", "#nombreEquipo2",
"Los dos equipos deben tener nombres diferentes." "Los dos equipos deben tener nombres diferentes.",
); );
valido = false; valido = false;
} }
if (!valido) { if (!valido) {
return;
}
// Deshabilitamos el botón mientras se crea la sala
const boton = $("#btnCrearSala");
boton.prop("disabled", true);
boton.text("Creando sala...");
$.ajax({
url: "controladores/controladorPartida.php", // <-- cambia esto por la ruta de tu controlador
type: "POST",
dataType: "json",
data: {
orden: "crear",
nombrePartida: nombreSala,
nombreEquipo1: nombreEquipo1,
nombreEquipo2: nombreEquipo2,
},
success: function (respuesta) {
console.log("Respuesta del servidor:", respuesta);
if (respuesta.error) {
alert(respuesta.error);
boton.prop("disabled", false);
boton.text("Crear sala");
return; return;
} }
if (respuesta.exito) {
$("#modalCrearSala").modal("hide");
location.reload();
}
},
console.log("Datos válidos:"); error: function (xhr, status, error) {
console.error("Error al crear la sala:", error);
console.error("Respuesta:", xhr.responseText);
console.log({ alert("No se ha podido crear la sala.");
nombreSala: nombreSala,
nombreEquipo1: nombreEquipo1, boton.prop("disabled", false);
nombreEquipo2: nombreEquipo2 boton.text("Crear sala");
},
}); });
} });
);
// ====================================================== // ======================================================
// MOSTRAR ERROR // MOSTRAR ERROR
// ====================================================== // ======================================================
function mostrarError(selector, mensaje) { function mostrarError(selector, mensaje) {
const input = $(selector);
const input = $(selector); input.addClass("is-invalid");
input.addClass("is-invalid"); input.after(`
input.after(`
<div class="mensaje-error-sala text-danger mt-1 small"> <div class="mensaje-error-sala text-danger mt-1 small">
${mensaje} ${mensaje}
</div> </div>
`); `);
} }
// ====================================================== // ======================================================
// QUITAR ERROR AL ESCRIBIR // QUITAR ERROR AL ESCRIBIR
// ====================================================== // ======================================================
$(".input-kahoot").on( $(".input-kahoot").on("input", function () {
"input", $(this).removeClass("is-invalid");
function () {
$(this).removeClass( $(this).next(".mensaje-error-sala").remove();
"is-invalid" });
);
$(this)
.next(".mensaje-error-sala")
.remove();
}
);