cambiar avatar y nombre en perfil.php
This commit is contained in:
+1
-154
@@ -16,11 +16,8 @@ $username = $isLoggedIn ? $_SESSION['nombreUsuario'] : '';
|
|||||||
<link href="https://fonts.googleapis.com/css2?family=Fredoka:wght@400;600;700&display=swap" rel="stylesheet">
|
<link href="https://fonts.googleapis.com/css2?family=Fredoka:wght@400;600;700&display=swap" rel="stylesheet">
|
||||||
<link rel="stylesheet" href="css/index.css">
|
<link rel="stylesheet" href="css/index.css">
|
||||||
<script src="js/jquery-4.0.0.min.js"></script>
|
<script src="js/jquery-4.0.0.min.js"></script>
|
||||||
<style>
|
|
||||||
|
|
||||||
|
|
||||||
</style>
|
|
||||||
|
|
||||||
<nav class="navbar navbar-expand-lg navbar-kahoot py-3 mb-4">
|
<nav class="navbar navbar-expand-lg navbar-kahoot py-3 mb-4">
|
||||||
<div class="container">
|
<div class="container">
|
||||||
<a class="navbar-brand" href="index.php">
|
<a class="navbar-brand" href="index.php">
|
||||||
@@ -152,154 +149,4 @@ $username = $isLoggedIn ? $_SESSION['nombreUsuario'] : '';
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
<script src="js/cabecera.js"></script>
|
||||||
// Registro
|
|
||||||
$('#botonAceptarRegistro').click(function(event) {
|
|
||||||
event.preventDefault();
|
|
||||||
console.log('hola');
|
|
||||||
let nombreUsuario = $('#regNombre').val().trim();
|
|
||||||
let email = $('#regEmail').val().trim();
|
|
||||||
let contrasena = $('#regPassword').val();
|
|
||||||
let contrasenaConfirmacion = $('#regPasswordConfirm').val();
|
|
||||||
|
|
||||||
// Limpiamos errores anteriores
|
|
||||||
$('#regNombre').removeClass('is-invalid');
|
|
||||||
$('#regEmail').removeClass('is-invalid');
|
|
||||||
$('#regPassword').removeClass('is-invalid');
|
|
||||||
$('#regPasswordConfirm').removeClass('is-invalid');
|
|
||||||
$('#errorRegistro').text('');
|
|
||||||
|
|
||||||
// Comprobamos que las contraseñas coincidan
|
|
||||||
if (contrasena !== contrasenaConfirmacion) {
|
|
||||||
|
|
||||||
$('#regPassword').addClass('is-invalid');
|
|
||||||
$('#regPasswordConfirm').addClass('is-invalid');
|
|
||||||
|
|
||||||
$('#errorRegistro').text('Las contraseñas no coinciden.');
|
|
||||||
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
$.ajax({
|
|
||||||
method: "POST",
|
|
||||||
url: "controladores/controladorUsuario.php",
|
|
||||||
data: {
|
|
||||||
'nombreUsuario': nombreUsuario,
|
|
||||||
'email': email,
|
|
||||||
'contrasena': contrasena,
|
|
||||||
'orden': 'registrarUsuario'
|
|
||||||
}
|
|
||||||
}).done(function(respuesta) {
|
|
||||||
//console.log(respuesta);
|
|
||||||
respuesta = JSON.parse(respuesta);
|
|
||||||
if (respuesta.error) {
|
|
||||||
|
|
||||||
$('#errorRegistro').text(respuesta.error);
|
|
||||||
|
|
||||||
// Marcamos los campos si hay error
|
|
||||||
$('#regNombre').addClass('is-invalid');
|
|
||||||
$('#regEmail').addClass('is-invalid');
|
|
||||||
|
|
||||||
} else {
|
|
||||||
|
|
||||||
// Registro correcto
|
|
||||||
$('#errorRegistro')
|
|
||||||
.removeClass('text-danger')
|
|
||||||
.addClass('text-success')
|
|
||||||
.text(respuesta.exito);
|
|
||||||
|
|
||||||
// Limpiamos formulario
|
|
||||||
$('#formRegistro')[0].reset();
|
|
||||||
|
|
||||||
// Cerramos modal después de un segundo
|
|
||||||
setTimeout(function() {
|
|
||||||
location.reload();
|
|
||||||
}, 1000);
|
|
||||||
}
|
|
||||||
|
|
||||||
}); // Fin función ajax
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
// Login
|
|
||||||
$('#botonAceptarLogin').click(function(event) {
|
|
||||||
event.preventDefault();
|
|
||||||
|
|
||||||
let email = $('#loginEmail').val().trim();
|
|
||||||
let contrasena = $('#loginPassword').val();
|
|
||||||
|
|
||||||
// Limpiamos errores anteriores
|
|
||||||
$('#loginEmail').removeClass('is-invalid');
|
|
||||||
$('#loginPassword').removeClass('is-invalid');
|
|
||||||
$('#errorLogin').text('');
|
|
||||||
|
|
||||||
// Comprobación básica
|
|
||||||
if (email === '' || contrasena === '') {
|
|
||||||
|
|
||||||
$('#errorLogin').text('Todos los campos son obligatorios.');
|
|
||||||
|
|
||||||
if (email === '') {
|
|
||||||
$('#loginEmail').addClass('is-invalid');
|
|
||||||
}
|
|
||||||
|
|
||||||
if (contrasena === '') {
|
|
||||||
$('#loginPassword').addClass('is-invalid');
|
|
||||||
}
|
|
||||||
|
|
||||||
return;
|
|
||||||
}
|
|
||||||
|
|
||||||
$.ajax({
|
|
||||||
method: "POST",
|
|
||||||
url: "controladores/controladorUsuario.php",
|
|
||||||
data: {
|
|
||||||
'email': email,
|
|
||||||
'contrasena': contrasena,
|
|
||||||
'orden': 'comprobarUsuario'
|
|
||||||
}
|
|
||||||
}).done(function(respuesta) {
|
|
||||||
//console.log(respuesta);
|
|
||||||
respuesta = JSON.parse(respuesta);
|
|
||||||
if (respuesta.error) {
|
|
||||||
|
|
||||||
$('#loginEmail').addClass('is-invalid');
|
|
||||||
$('#loginPassword').addClass('is-invalid');
|
|
||||||
|
|
||||||
$('#errorLogin').text(respuesta.error);
|
|
||||||
|
|
||||||
} else {
|
|
||||||
|
|
||||||
location.reload();
|
|
||||||
}
|
|
||||||
|
|
||||||
}); // Fin función ajax
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
// Cerrar sesión
|
|
||||||
$('#botonCerrarSesion').click(function(event) {
|
|
||||||
event.preventDefault();
|
|
||||||
|
|
||||||
$.ajax({
|
|
||||||
method: "POST",
|
|
||||||
url: "controladores/controladorUsuario.php",
|
|
||||||
data: {
|
|
||||||
'orden': 'cerrarSesion'
|
|
||||||
}
|
|
||||||
}).done(function(respuesta) {
|
|
||||||
//console.log(respuesta);
|
|
||||||
respuesta = JSON.parse(respuesta);
|
|
||||||
if (respuesta.error) {
|
|
||||||
console.log(respuesta.error);
|
|
||||||
} else {
|
|
||||||
|
|
||||||
// Sesión cerrada correctamente
|
|
||||||
location.reload();
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
}); // Fin función ajax
|
|
||||||
|
|
||||||
}); // Fin función click
|
|
||||||
|
|
||||||
</script>
|
|
||||||
+193
-23
@@ -1,7 +1,8 @@
|
|||||||
<?php
|
<?php
|
||||||
require_once __DIR__ . '/../includes/conexionBD.php';
|
require_once __DIR__ . '/../includes/conexionBD.php';
|
||||||
|
|
||||||
class Usuario {
|
class Usuario
|
||||||
|
{
|
||||||
private ?int $idUsuario;
|
private ?int $idUsuario;
|
||||||
private string $nombreUsuario;
|
private string $nombreUsuario;
|
||||||
private string $contrasena;
|
private string $contrasena;
|
||||||
@@ -34,33 +35,85 @@ class Usuario {
|
|||||||
$this->derrotas = $derrotas;
|
$this->derrotas = $derrotas;
|
||||||
}
|
}
|
||||||
|
|
||||||
public function getIdUsuario(): ?int { return $this->idUsuario; }
|
public function getIdUsuario(): ?int
|
||||||
|
{
|
||||||
|
return $this->idUsuario;
|
||||||
|
}
|
||||||
|
|
||||||
public function getNombreUsuario(): string { return $this->nombreUsuario; }
|
public function getNombreUsuario(): string
|
||||||
public function setNombreUsuario(string $nombreUsuario): void { $this->nombreUsuario = $nombreUsuario; }
|
{
|
||||||
|
return $this->nombreUsuario;
|
||||||
|
}
|
||||||
|
public function setNombreUsuario(string $nombreUsuario): void
|
||||||
|
{
|
||||||
|
$this->nombreUsuario = $nombreUsuario;
|
||||||
|
}
|
||||||
|
|
||||||
public function getContrasena(): string { return $this->contrasena; }
|
public function getContrasena(): string
|
||||||
public function setContrasena(string $contrasena): void { $this->contrasena = $contrasena; }
|
{
|
||||||
|
return $this->contrasena;
|
||||||
|
}
|
||||||
|
public function setContrasena(string $contrasena): void
|
||||||
|
{
|
||||||
|
$this->contrasena = $contrasena;
|
||||||
|
}
|
||||||
|
|
||||||
public function getEmail(): string { return $this->email; }
|
public function getEmail(): string
|
||||||
public function setEmail(string $email): void { $this->email = $email; }
|
{
|
||||||
|
return $this->email;
|
||||||
|
}
|
||||||
|
public function setEmail(string $email): void
|
||||||
|
{
|
||||||
|
$this->email = $email;
|
||||||
|
}
|
||||||
|
|
||||||
public function getAvatar(): ?string { return $this->avatar; }
|
public function getAvatar(): ?string
|
||||||
public function setAvatar(?string $avatar): void { $this->avatar = $avatar; }
|
{
|
||||||
|
return $this->avatar;
|
||||||
|
}
|
||||||
|
public function setAvatar(?string $avatar): void
|
||||||
|
{
|
||||||
|
$this->avatar = $avatar;
|
||||||
|
}
|
||||||
|
|
||||||
public function getCookie(): ?string { return $this->cookie; }
|
public function getCookie(): ?string
|
||||||
public function setCookie(?string $cookie): void { $this->cookie = $cookie; }
|
{
|
||||||
|
return $this->cookie;
|
||||||
|
}
|
||||||
|
public function setCookie(?string $cookie): void
|
||||||
|
{
|
||||||
|
$this->cookie = $cookie;
|
||||||
|
}
|
||||||
|
|
||||||
public function getAciertos(): int { return $this->aciertos; }
|
public function getAciertos(): int
|
||||||
public function setAciertos(int $aciertos): void { $this->aciertos = $aciertos; }
|
{
|
||||||
|
return $this->aciertos;
|
||||||
|
}
|
||||||
|
public function setAciertos(int $aciertos): void
|
||||||
|
{
|
||||||
|
$this->aciertos = $aciertos;
|
||||||
|
}
|
||||||
|
|
||||||
public function getVictorias(): int { return $this->victorias; }
|
public function getVictorias(): int
|
||||||
public function setVictorias(int $victorias): void { $this->victorias = $victorias; }
|
{
|
||||||
|
return $this->victorias;
|
||||||
|
}
|
||||||
|
public function setVictorias(int $victorias): void
|
||||||
|
{
|
||||||
|
$this->victorias = $victorias;
|
||||||
|
}
|
||||||
|
|
||||||
public function getDerrotas(): int { return $this->derrotas; }
|
public function getDerrotas(): int
|
||||||
public function setDerrotas(int $derrotas): void { $this->derrotas = $derrotas; }
|
{
|
||||||
|
return $this->derrotas;
|
||||||
|
}
|
||||||
|
public function setDerrotas(int $derrotas): void
|
||||||
|
{
|
||||||
|
$this->derrotas = $derrotas;
|
||||||
|
}
|
||||||
|
|
||||||
public function registrar() {
|
public function registrar()
|
||||||
|
{
|
||||||
$conexion = conexionBD();
|
$conexion = conexionBD();
|
||||||
|
|
||||||
if (is_array($conexion)) {
|
if (is_array($conexion)) {
|
||||||
@@ -91,7 +144,6 @@ class Usuario {
|
|||||||
'exito' => 'Usuario registrado correctamente',
|
'exito' => 'Usuario registrado correctamente',
|
||||||
'exito_tecnico' => $this->idUsuario
|
'exito_tecnico' => $this->idUsuario
|
||||||
];
|
];
|
||||||
|
|
||||||
} catch (PDOException $error) {
|
} catch (PDOException $error) {
|
||||||
return [
|
return [
|
||||||
'error' => 'Ocurrió un error al registrar el usuario.',
|
'error' => 'Ocurrió un error al registrar el usuario.',
|
||||||
@@ -100,7 +152,8 @@ class Usuario {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
public static function buscarPorId($id) {
|
public static function buscarPorId($id)
|
||||||
|
{
|
||||||
$conexion = conexionBD();
|
$conexion = conexionBD();
|
||||||
|
|
||||||
if (is_array($conexion)) {
|
if (is_array($conexion)) {
|
||||||
@@ -131,7 +184,6 @@ class Usuario {
|
|||||||
return [
|
return [
|
||||||
'error' => 'No se encontró ningún usuario con ese ID.'
|
'error' => 'No se encontró ningún usuario con ese ID.'
|
||||||
];
|
];
|
||||||
|
|
||||||
} catch (PDOException $error) {
|
} catch (PDOException $error) {
|
||||||
return [
|
return [
|
||||||
'error' => 'Ocurrió un error al buscar el usuario.',
|
'error' => 'Ocurrió un error al buscar el usuario.',
|
||||||
@@ -140,7 +192,8 @@ class Usuario {
|
|||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
public static function buscarPorEmail($email) {
|
public static function buscarPorEmail($email)
|
||||||
|
{
|
||||||
$conexion = conexionBD();
|
$conexion = conexionBD();
|
||||||
|
|
||||||
if (is_array($conexion)) {
|
if (is_array($conexion)) {
|
||||||
@@ -189,6 +242,7 @@ class Usuario {
|
|||||||
unset($_SESSION['idUsuario']);
|
unset($_SESSION['idUsuario']);
|
||||||
unset($_SESSION['email']);
|
unset($_SESSION['email']);
|
||||||
unset($_SESSION['nombreUsuario']);
|
unset($_SESSION['nombreUsuario']);
|
||||||
|
unset($_SESSION['avatar']);
|
||||||
|
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
@@ -200,6 +254,7 @@ class Usuario {
|
|||||||
$_SESSION['idUsuario'] = $usuario->getIdUsuario();
|
$_SESSION['idUsuario'] = $usuario->getIdUsuario();
|
||||||
$_SESSION['email'] = $usuario->getEmail();
|
$_SESSION['email'] = $usuario->getEmail();
|
||||||
$_SESSION['nombreUsuario'] = $usuario->getNombreUsuario();
|
$_SESSION['nombreUsuario'] = $usuario->getNombreUsuario();
|
||||||
|
$_SESSION['avatar'] = $usuario->getAvatar();
|
||||||
|
|
||||||
// Devolvemos el usuario como hasta ahora
|
// Devolvemos el usuario como hasta ahora
|
||||||
return $usuario;
|
return $usuario;
|
||||||
@@ -209,8 +264,123 @@ class Usuario {
|
|||||||
unset($_SESSION['idUsuario']);
|
unset($_SESSION['idUsuario']);
|
||||||
unset($_SESSION['email']);
|
unset($_SESSION['email']);
|
||||||
unset($_SESSION['nombreUsuario']);
|
unset($_SESSION['nombreUsuario']);
|
||||||
|
unset($_SESSION['avatar']);
|
||||||
|
|
||||||
return null;
|
return null;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
public function cambiarNombre($nuevoNombre)
|
||||||
|
{
|
||||||
|
$conexion = conexionBD();
|
||||||
|
|
||||||
|
if (is_array($conexion)) {
|
||||||
|
return $conexion;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
|
||||||
|
$sql = "UPDATE usuario
|
||||||
|
SET nombreUsuario = :nombre
|
||||||
|
WHERE idUsuario = :id";
|
||||||
|
|
||||||
|
$stmt = $conexion->prepare($sql);
|
||||||
|
|
||||||
|
$stmt->execute([
|
||||||
|
':nombre' => $nuevoNombre,
|
||||||
|
':id' => $this->idUsuario
|
||||||
|
]);
|
||||||
|
|
||||||
|
// Actualizamos también el objeto actual
|
||||||
|
$this->nombreUsuario = $nuevoNombre;
|
||||||
|
|
||||||
|
return [
|
||||||
|
'exito' => 'Nombre actualizado correctamente.'
|
||||||
|
];
|
||||||
|
} catch (PDOException $error) {
|
||||||
|
|
||||||
|
return [
|
||||||
|
'error' => 'Ocurrió un error al actualizar el nombre.',
|
||||||
|
'error_tecnico' => $error->getMessage()
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
public function cambiarAvatar($archivo)
|
||||||
|
{
|
||||||
|
$carpeta = __DIR__ . '/../img/avatars/';
|
||||||
|
|
||||||
|
// Creamos la carpeta si no existe
|
||||||
|
if (!is_dir($carpeta)) {
|
||||||
|
mkdir($carpeta, 0755, true);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Obtenemos la extensión según el tipo MIME
|
||||||
|
$tipo = mime_content_type($archivo['tmp_name']);
|
||||||
|
|
||||||
|
$extensiones = [
|
||||||
|
'image/jpeg' => 'jpg',
|
||||||
|
'image/png' => 'png',
|
||||||
|
'image/gif' => 'gif',
|
||||||
|
'image/webp' => 'webp'
|
||||||
|
];
|
||||||
|
|
||||||
|
if (!isset($extensiones[$tipo])) {
|
||||||
|
|
||||||
|
return [
|
||||||
|
'error' => 'Formato de imagen no permitido.'
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
$extension = $extensiones[$tipo];
|
||||||
|
|
||||||
|
// Nombre único para evitar conflictos
|
||||||
|
$nombreArchivo = 'avatar_' . $this->idUsuario . '.' . $extension;
|
||||||
|
|
||||||
|
$rutaCompleta = $carpeta . $nombreArchivo;
|
||||||
|
|
||||||
|
// Guardamos la imagen
|
||||||
|
if (!move_uploaded_file($archivo['tmp_name'], $rutaCompleta)) {
|
||||||
|
|
||||||
|
return [
|
||||||
|
'error' => 'No se pudo guardar la imagen.'
|
||||||
|
];
|
||||||
|
}
|
||||||
|
|
||||||
|
// Ruta que utilizará el HTML
|
||||||
|
$rutaAvatar = 'img/avatars/' . $nombreArchivo;
|
||||||
|
|
||||||
|
$conexion = conexionBD();
|
||||||
|
|
||||||
|
if (is_array($conexion)) {
|
||||||
|
return $conexion;
|
||||||
|
}
|
||||||
|
|
||||||
|
try {
|
||||||
|
|
||||||
|
$sql = "UPDATE usuario
|
||||||
|
SET avatar = :avatar
|
||||||
|
WHERE idUsuario = :id";
|
||||||
|
|
||||||
|
$stmt = $conexion->prepare($sql);
|
||||||
|
|
||||||
|
$stmt->execute([
|
||||||
|
':avatar' => $rutaAvatar,
|
||||||
|
':id' => $this->idUsuario
|
||||||
|
]);
|
||||||
|
|
||||||
|
// Actualizamos también el objeto actual
|
||||||
|
$this->avatar = $rutaAvatar;
|
||||||
|
|
||||||
|
return [
|
||||||
|
'exito' => 'Avatar actualizado correctamente.',
|
||||||
|
'avatar' => $rutaAvatar
|
||||||
|
];
|
||||||
|
} catch (PDOException $error) {
|
||||||
|
|
||||||
|
return [
|
||||||
|
'error' => 'Ocurrió un error al actualizar el avatar.',
|
||||||
|
'error_tecnico' => $error->getMessage()
|
||||||
|
];
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -35,7 +35,8 @@ switch ($_POST['orden']) {
|
|||||||
$usuario = new Usuario(
|
$usuario = new Usuario(
|
||||||
$nombreUsuario,
|
$nombreUsuario,
|
||||||
$contrasena,
|
$contrasena,
|
||||||
$email
|
$email,
|
||||||
|
'img/avatars/defaultProfile.jpeg'
|
||||||
);
|
);
|
||||||
|
|
||||||
$resultado = $usuario->registrar();
|
$resultado = $usuario->registrar();
|
||||||
@@ -97,7 +98,6 @@ switch ($_POST['orden']) {
|
|||||||
'derrotas' => $usuario->getDerrotas(),
|
'derrotas' => $usuario->getDerrotas(),
|
||||||
'aciertos' => $usuario->getAciertos()
|
'aciertos' => $usuario->getAciertos()
|
||||||
]);
|
]);
|
||||||
|
|
||||||
} else {
|
} else {
|
||||||
|
|
||||||
echo json_encode($usuario);
|
echo json_encode($usuario);
|
||||||
@@ -105,6 +105,120 @@ switch ($_POST['orden']) {
|
|||||||
|
|
||||||
break;
|
break;
|
||||||
|
|
||||||
|
case 'cambiarNombre':
|
||||||
|
|
||||||
|
if (!isset($_SESSION['idUsuario'])) {
|
||||||
|
|
||||||
|
echo json_encode([
|
||||||
|
'error' => 'No hay ningún usuario conectado.'
|
||||||
|
]);
|
||||||
|
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
$nuevoNombre = trim($_POST['nombreUsuario'] ?? '');
|
||||||
|
|
||||||
|
if ($nuevoNombre === '') {
|
||||||
|
|
||||||
|
echo json_encode([
|
||||||
|
'error' => 'El nombre no puede estar vacío.'
|
||||||
|
]);
|
||||||
|
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
$usuario = Usuario::buscarPorId($_SESSION['idUsuario']);
|
||||||
|
|
||||||
|
if (!($usuario instanceof Usuario)) {
|
||||||
|
|
||||||
|
echo json_encode([
|
||||||
|
'error' => 'No se encontró el usuario.'
|
||||||
|
]);
|
||||||
|
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
$resultado = $usuario->cambiarNombre($nuevoNombre);
|
||||||
|
|
||||||
|
if (isset($resultado['error'])) {
|
||||||
|
|
||||||
|
echo json_encode($resultado);
|
||||||
|
} else {
|
||||||
|
|
||||||
|
// Actualizamos también la sesión
|
||||||
|
$_SESSION['nombreUsuario'] = $nuevoNombre;
|
||||||
|
|
||||||
|
echo json_encode([
|
||||||
|
'exito' => 'Nombre actualizado correctamente.',
|
||||||
|
'nombreUsuario' => $nuevoNombre
|
||||||
|
]);
|
||||||
|
}
|
||||||
|
|
||||||
|
break;
|
||||||
|
|
||||||
|
case 'cambiarAvatar':
|
||||||
|
|
||||||
|
if (!isset($_SESSION['idUsuario'])) {
|
||||||
|
|
||||||
|
echo json_encode([
|
||||||
|
'error' => 'No hay ningún usuario conectado.'
|
||||||
|
]);
|
||||||
|
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
if (!isset($_FILES['avatar']) || $_FILES['avatar']['error'] !== UPLOAD_ERR_OK) {
|
||||||
|
|
||||||
|
echo json_encode([
|
||||||
|
'error' => 'No se ha recibido ninguna imagen.'
|
||||||
|
]);
|
||||||
|
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
$archivo = $_FILES['avatar'];
|
||||||
|
|
||||||
|
$tipo = mime_content_type($archivo['tmp_name']);
|
||||||
|
|
||||||
|
$tiposPermitidos = [
|
||||||
|
'image/jpeg',
|
||||||
|
'image/png',
|
||||||
|
'image/gif',
|
||||||
|
'image/webp'
|
||||||
|
];
|
||||||
|
|
||||||
|
if (!in_array($tipo, $tiposPermitidos)) {
|
||||||
|
|
||||||
|
echo json_encode([
|
||||||
|
'error' => 'El formato de imagen no es válido.'
|
||||||
|
]);
|
||||||
|
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
$usuario = Usuario::buscarPorId($_SESSION['idUsuario']);
|
||||||
|
|
||||||
|
if (!($usuario instanceof Usuario)) {
|
||||||
|
|
||||||
|
echo json_encode([
|
||||||
|
'error' => 'No se encontró el usuario.'
|
||||||
|
]);
|
||||||
|
|
||||||
|
break;
|
||||||
|
}
|
||||||
|
|
||||||
|
$resultado = $usuario->cambiarAvatar($archivo);
|
||||||
|
|
||||||
|
if (isset($resultado['error'])) {
|
||||||
|
|
||||||
|
echo json_encode($resultado);
|
||||||
|
} else {
|
||||||
|
|
||||||
|
// Actualizamos también la sesión
|
||||||
|
$_SESSION['avatar'] = $resultado['avatar'];
|
||||||
|
|
||||||
|
echo json_encode($resultado);
|
||||||
|
}
|
||||||
|
|
||||||
|
break;
|
||||||
}
|
}
|
||||||
|
|||||||
Binary file not shown.
|
After Width: | Height: | Size: 6.9 KiB |
+133
@@ -0,0 +1,133 @@
|
|||||||
|
// Registro
|
||||||
|
$("#botonAceptarRegistro").click(function (event) {
|
||||||
|
event.preventDefault();
|
||||||
|
console.log("hola");
|
||||||
|
let nombreUsuario = $("#regNombre").val().trim();
|
||||||
|
let email = $("#regEmail").val().trim();
|
||||||
|
let contrasena = $("#regPassword").val();
|
||||||
|
let contrasenaConfirmacion = $("#regPasswordConfirm").val();
|
||||||
|
|
||||||
|
// Limpiamos errores anteriores
|
||||||
|
$("#regNombre").removeClass("is-invalid");
|
||||||
|
$("#regEmail").removeClass("is-invalid");
|
||||||
|
$("#regPassword").removeClass("is-invalid");
|
||||||
|
$("#regPasswordConfirm").removeClass("is-invalid");
|
||||||
|
$("#errorRegistro").text("");
|
||||||
|
|
||||||
|
// Comprobamos que las contraseñas coincidan
|
||||||
|
if (contrasena !== contrasenaConfirmacion) {
|
||||||
|
$("#regPassword").addClass("is-invalid");
|
||||||
|
$("#regPasswordConfirm").addClass("is-invalid");
|
||||||
|
|
||||||
|
$("#errorRegistro").text("Las contraseñas no coinciden.");
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
$.ajax({
|
||||||
|
method: "POST",
|
||||||
|
url: "controladores/controladorUsuario.php",
|
||||||
|
data: {
|
||||||
|
nombreUsuario: nombreUsuario,
|
||||||
|
email: email,
|
||||||
|
contrasena: contrasena,
|
||||||
|
orden: "registrarUsuario",
|
||||||
|
},
|
||||||
|
}).done(function (respuesta) {
|
||||||
|
//console.log(respuesta);
|
||||||
|
respuesta = JSON.parse(respuesta);
|
||||||
|
if (respuesta.error) {
|
||||||
|
$("#errorRegistro").text(respuesta.error);
|
||||||
|
|
||||||
|
// Marcamos los campos si hay error
|
||||||
|
$("#regNombre").addClass("is-invalid");
|
||||||
|
$("#regEmail").addClass("is-invalid");
|
||||||
|
} else {
|
||||||
|
// Registro correcto
|
||||||
|
$("#errorRegistro")
|
||||||
|
.removeClass("text-danger")
|
||||||
|
.addClass("text-success")
|
||||||
|
.text(respuesta.exito);
|
||||||
|
|
||||||
|
// Limpiamos formulario
|
||||||
|
$("#formRegistro")[0].reset();
|
||||||
|
|
||||||
|
// Cerramos modal después de un segundo
|
||||||
|
setTimeout(function () {
|
||||||
|
location.reload();
|
||||||
|
}, 1000);
|
||||||
|
}
|
||||||
|
}); // Fin función ajax
|
||||||
|
});
|
||||||
|
|
||||||
|
// Login
|
||||||
|
$("#botonAceptarLogin").click(function (event) {
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
let email = $("#loginEmail").val().trim();
|
||||||
|
let contrasena = $("#loginPassword").val();
|
||||||
|
|
||||||
|
// Limpiamos errores anteriores
|
||||||
|
$("#loginEmail").removeClass("is-invalid");
|
||||||
|
$("#loginPassword").removeClass("is-invalid");
|
||||||
|
$("#errorLogin").text("");
|
||||||
|
|
||||||
|
// Comprobación básica
|
||||||
|
if (email === "" || contrasena === "") {
|
||||||
|
$("#errorLogin").text("Todos los campos son obligatorios.");
|
||||||
|
|
||||||
|
if (email === "") {
|
||||||
|
$("#loginEmail").addClass("is-invalid");
|
||||||
|
}
|
||||||
|
|
||||||
|
if (contrasena === "") {
|
||||||
|
$("#loginPassword").addClass("is-invalid");
|
||||||
|
}
|
||||||
|
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
|
$.ajax({
|
||||||
|
method: "POST",
|
||||||
|
url: "controladores/controladorUsuario.php",
|
||||||
|
data: {
|
||||||
|
email: email,
|
||||||
|
contrasena: contrasena,
|
||||||
|
orden: "comprobarUsuario",
|
||||||
|
},
|
||||||
|
}).done(function (respuesta) {
|
||||||
|
//console.log(respuesta);
|
||||||
|
respuesta = JSON.parse(respuesta);
|
||||||
|
if (respuesta.error) {
|
||||||
|
$("#loginEmail").addClass("is-invalid");
|
||||||
|
$("#loginPassword").addClass("is-invalid");
|
||||||
|
|
||||||
|
$("#errorLogin").text(respuesta.error);
|
||||||
|
} else {
|
||||||
|
location.reload();
|
||||||
|
}
|
||||||
|
}); // Fin función ajax
|
||||||
|
});
|
||||||
|
|
||||||
|
// Cerrar sesión
|
||||||
|
$("#botonCerrarSesion").click(function (event) {
|
||||||
|
event.preventDefault();
|
||||||
|
|
||||||
|
$.ajax({
|
||||||
|
method: "POST",
|
||||||
|
url: "controladores/controladorUsuario.php",
|
||||||
|
data: {
|
||||||
|
orden: "cerrarSesion",
|
||||||
|
},
|
||||||
|
}).done(function (respuesta) {
|
||||||
|
//console.log(respuesta);
|
||||||
|
respuesta = JSON.parse(respuesta);
|
||||||
|
if (respuesta.error) {
|
||||||
|
console.log(respuesta.error);
|
||||||
|
} else {
|
||||||
|
// Sesión cerrada correctamente
|
||||||
|
window.location.href = 'index.php';
|
||||||
|
|
||||||
|
}
|
||||||
|
}); // Fin función ajax
|
||||||
|
}); // Fin función click
|
||||||
+78
-44
@@ -1,42 +1,59 @@
|
|||||||
|
// =========================
|
||||||
|
// 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
|
// CAMBIAR NOMBRE
|
||||||
// =========================
|
// =========================
|
||||||
|
|
||||||
function cambiarNombre() {
|
function cambiarNombre() {
|
||||||
|
let nuevoNombre = $("#nuevoNombre").val().trim();
|
||||||
|
|
||||||
const input = document.getElementById("nuevoNombre");
|
$.ajax({
|
||||||
const nombre = document.getElementById("nombre");
|
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);
|
||||||
|
|
||||||
const nuevoNombre = input.value.trim();
|
// Limpiamos el input
|
||||||
|
$("#nuevoNombre").val("");
|
||||||
if (nuevoNombre !== "") {
|
|
||||||
|
|
||||||
nombre.textContent = nuevoNombre;
|
|
||||||
|
|
||||||
input.value = "";
|
|
||||||
}
|
}
|
||||||
|
});
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
// =========================
|
// =========================
|
||||||
// BORRAR NOMBRE
|
// BORRAR NOMBRE
|
||||||
// =========================
|
// =========================
|
||||||
|
|
||||||
function borrarNombre() {
|
function borrarNombre() {
|
||||||
|
document.getElementById("nuevoNombre").value = "";
|
||||||
document.getElementById("nuevoNombre").value = "";
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
|
||||||
// =========================
|
|
||||||
// ABRIR SELECTOR DE IMAGEN
|
|
||||||
// =========================
|
|
||||||
|
|
||||||
function seleccionarFoto() {
|
|
||||||
|
|
||||||
document.getElementById("inputFoto").click();
|
|
||||||
|
|
||||||
}
|
}
|
||||||
|
|
||||||
|
|
||||||
@@ -44,31 +61,48 @@ function seleccionarFoto() {
|
|||||||
// CAMBIAR FOTO
|
// CAMBIAR FOTO
|
||||||
// =========================
|
// =========================
|
||||||
|
|
||||||
document.getElementById("inputFoto").addEventListener(
|
function seleccionarFoto() {
|
||||||
"change",
|
$("#inputFoto").click();
|
||||||
function(event) {
|
}
|
||||||
|
|
||||||
const archivo = event.target.files[0];
|
$("#inputFoto").change(function () {
|
||||||
|
let archivo = this.files[0];
|
||||||
|
|
||||||
if (archivo) {
|
if (!archivo) {
|
||||||
|
return;
|
||||||
|
}
|
||||||
|
|
||||||
// Comprobamos que sea una imagen
|
// Comprobamos que sea una imagen
|
||||||
if (!archivo.type.startsWith("image/")) {
|
if (!archivo.type.startsWith("image/")) {
|
||||||
|
alert("El archivo seleccionado no es una imagen.");
|
||||||
|
|
||||||
alert("Por favor, selecciona una imagen.");
|
$("#inputFoto").val("");
|
||||||
|
|
||||||
return;
|
return;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
let datos = new FormData();
|
||||||
|
|
||||||
// Creamos una URL temporal
|
datos.append("avatar", archivo);
|
||||||
const imagenURL = URL.createObjectURL(archivo);
|
datos.append("orden", "cambiarAvatar");
|
||||||
|
|
||||||
|
|
||||||
// Cambiamos la foto
|
|
||||||
document.getElementById("fotoPerfil").src = imagenURL;
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
|
$.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(),
|
||||||
|
);
|
||||||
}
|
}
|
||||||
);
|
});
|
||||||
|
});
|
||||||
|
|||||||
+1
-28
@@ -80,7 +80,7 @@
|
|||||||
|
|
||||||
<img
|
<img
|
||||||
id="fotoPerfil"
|
id="fotoPerfil"
|
||||||
src="https://i.pravatar.cc/300?img=47"
|
src="<?= htmlspecialchars($_SESSION['avatar'] ?? '') ?>"
|
||||||
alt="Foto de perfil"
|
alt="Foto de perfil"
|
||||||
class="avatar rounded-circle">
|
class="avatar rounded-circle">
|
||||||
|
|
||||||
@@ -418,33 +418,6 @@
|
|||||||
|
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
<script>
|
|
||||||
$(document).ready(function() {
|
|
||||||
|
|
||||||
$.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);
|
|
||||||
|
|
||||||
}
|
|
||||||
|
|
||||||
});
|
|
||||||
|
|
||||||
});
|
|
||||||
</script>
|
|
||||||
|
|
||||||
<!-- Bootstrap JS -->
|
<!-- Bootstrap JS -->
|
||||||
|
|
||||||
<script
|
<script
|
||||||
|
|||||||
Reference in New Issue
Block a user