// =========================
// 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();

  $.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);

      // Limpiamos el input
      $("#nuevoNombre").val("");
    }
  });
}

// =========================
// 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 sin recargar la página
      $("#fotoPerfil").attr(
        "src",
        respuesta.avatar + "?t=" + new Date().getTime(),
      );
    }
  });
});

// =========================
// 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");

        // Si tienes que actualizar la lista de preguntas:
        // cargarPreguntas();
      }
    },

    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");
    },
  });
});