// =========================
// MOSTRAR ESTADISTICAS
// =========================

$.ajax({
  method: "POST",
  url: "controladores/controladorUsuario.php",
  data: {
    orden: "mostrarEstadisticas",
  },
}).done(function (respuesta) {
  console.log(respuesta);
  respuesta = JSON.parse(respuesta);
  if (respuesta.error) {
    console.log(respuesta.error);
  } else {
    $("#victorias").text(respuesta.victorias);
    $("#derrotas").text(respuesta.derrotas);
    $("#aciertos").text(respuesta.aciertos);
  }
});

// =========================
// CAMBIAR NOMBRE
// =========================
function cambiarNombre() {
  let nuevoNombre = $("#nuevoNombre").val().trim();

  if (nuevoNombre === "") {
    return;
  }

  $.ajax({
    method: "POST",
    url: "controladores/controladorUsuario.php",
    data: {
      nombreUsuario: nuevoNombre,
      orden: "cambiarNombre",
    },
  }).done(function (respuesta) {
    console.log(respuesta);
    respuesta = JSON.parse(respuesta);
    if (respuesta.error) {
      console.log(respuesta.error);
    } else {
      // Actualizamos el nombre mostrado en la página
      $("#nombre").text(respuesta.nombreUsuario);

      
      $("#nuevoNombre").val("");

    
      if (typeof comprobarEstadoSesion === "function") {
        comprobarEstadoSesion();
      }
    }
  });
}

// =========================
// BORRAR NOMBRE
// =========================

function borrarNombre() {
  document.getElementById("nuevoNombre").value = "";
}

// =========================
// CAMBIAR FOTO
// =========================

function seleccionarFoto() {
  $("#inputFoto").click();
}

$("#inputFoto").change(function () {
  let archivo = this.files[0];

  if (!archivo) {
    return;
  }

  // Comprobamos que sea una imagen
  if (!archivo.type.startsWith("image/")) {
    alert("El archivo seleccionado no es una imagen.");
    $("#inputFoto").val("");
    return;
  }

  let datos = new FormData();
  datos.append("avatar", archivo);
  datos.append("orden", "cambiarAvatar");

  $.ajax({
    method: "POST",
    url: "controladores/controladorUsuario.php",
    data: datos,
    processData: false,
    contentType: false,
  }).done(function (respuesta) {
    console.log(respuesta);
    respuesta = JSON.parse(respuesta);
    if (respuesta.error) {
      alert(respuesta.error);
    } else {
      // Actualizamos la imagen en la página de perfil sin recargar
      $("#fotoPerfil").attr(
        "src",
        respuesta.avatar + "?t=" + new Date().getTime()
      );

      // Actualizamos también el avatar superior en la cabecera 
      if (typeof comprobarEstadoSesion === "function") {
        comprobarEstadoSesion();
      }
    }
  });
});

// =========================
// RECOGER CATEGORIAS
// =========================

$("#modalCrearPregunta").on("show.bs.modal", function () {
  const selectCategoria = $("#idCategoria");

  // Limpiamos las categorías anteriores
  selectCategoria.empty();

  // Opción inicial
  selectCategoria.append('<option value="">Selecciona una categoría</option>');

  $.ajax({
    url: "controladores/controladorCategoria.php",
    type: "POST",
    dataType: "json",

    data: {
      orden: "listarCategorias",
    },

    success: function (respuesta) {
      console.log("Categorías:", respuesta);

      if (respuesta.error) {
        alert(respuesta.error);
        return;
      }

      $.each(respuesta, function (index, categoria) {
        selectCategoria.append(
          $("<option>", {
            value: categoria.idCategoria,
            text: categoria.nombreCategoria,
          })
        );
      });
    },

    error: function (xhr, status, error) {
      console.error("Error al cargar las categorías:", error);
      console.error("Respuesta del servidor:", xhr.responseText);
      alert("No se han podido cargar las categorías.");
    },
  });
});

// =========================
// CREAR PREGUNTA
// =========================

$("#formCrearPregunta").on("submit", function (e) {
  e.preventDefault();

  const boton = $("#btnCrearPregunta");

  const pregunta = $("#pregunta").val().trim();
  const respuestaCorrecta = $("#respuestaCorrecta").val().trim();
  const respuestaIncorrecta1 = $("#respuestaIncorrecta1").val().trim();
  const respuestaIncorrecta2 = $("#respuestaIncorrecta2").val().trim();
  const respuestaIncorrecta3 = $("#respuestaIncorrecta3").val().trim();

  // Comprobamos que no haya campos vacíos
  if (
    pregunta === "" ||
    respuestaCorrecta === "" ||
    respuestaIncorrecta1 === "" ||
    respuestaIncorrecta2 === "" ||
    respuestaIncorrecta3 === ""
  ) {
    alert("Todos los campos son obligatorios.");
    return;
  }

  boton.prop("disabled", true);
  boton.text("Creando pregunta...");

  $.ajax({
    url: "controladores/controladorPregunta.php",
    type: "POST",
    dataType: "json",
    data: {
      orden: "crearPregunta",
      idCategoria: $("#idCategoria").val(),
      nombrePregunta: pregunta,
      respuestaCorrecta: respuestaCorrecta,
      respuestaIncorrecta1: respuestaIncorrecta1,
      respuestaIncorrecta2: respuestaIncorrecta2,
      respuestaIncorrecta3: respuestaIncorrecta3,
    },

    success: function (respuesta) {
      console.log("Respuesta del servidor:", respuesta);

      if (respuesta.error) {
        alert(respuesta.error);
        boton.prop("disabled", false);
        boton.text("Crear pregunta");
        return;
      }

      if (respuesta.exito) {
        console.log("Pregunta creada:", respuesta.idPregunta);

        // Cerramos el modal
        $("#modalCrearPregunta").modal("hide");

        // Limpiamos el formulario
        $("#formCrearPregunta")[0].reset();

        // Volvemos a activar el botón
        boton.prop("disabled", false);
        boton.text("Crear pregunta");
        // Toast exito 
        mostrarToast()
      }
    },

    error: function (xhr, status, error) {
      console.error("Error al crear la pregunta:", error);
      console.error("Respuesta del servidor:", xhr.responseText);
      alert("No se ha podido crear la pregunta.");

      boton.prop("disabled", false);
      boton.text("Crear pregunta");
    },
  });
});
function mostrarToast() {
  const toastMensaje = document.getElementById("ToastCrearPregunta");

  if (toastMensaje) {
    const toastBootstrap = bootstrap.Toast.getOrCreateInstance(toastMensaje);
    toastBootstrap.show();
  }
}