From f9d2ddc4b33cfbacc328b45fffb8a6f459332e96 Mon Sep 17 00:00:00 2001 From: David espinosa <104380606+davespser@users.noreply.github.com> Date: Thu, 5 Dec 2024 16:50:08 +0100 Subject: [PATCH] Update app.js --- js/app.js | 95 +++++++++++++++++++++++++++++++------------------------ 1 file changed, 54 insertions(+), 41 deletions(-) diff --git a/js/app.js b/js/app.js index 06e878e2..09c6dd4e 100644 --- a/js/app.js +++ b/js/app.js @@ -1,14 +1,14 @@ -// Importar Firebase y módulos necesarios import { auth, database } from "./firebase-config.js"; -import { ref, set, onValue, push } from "https://www.gstatic.com/firebasejs/9.21.0/firebase-database.js"; -import { getAuth, createUserWithEmailAndPassword, signInWithEmailAndPassword,onAuthStateChanged } from "https://www.gstatic.com/firebasejs/9.21.0/firebase-auth.js"; +import { + createUserWithEmailAndPassword, + signInWithEmailAndPassword, + onAuthStateChanged, + signOut +} from "https://www.gstatic.com/firebasejs/9.21.0/firebase-auth.js"; +import { ref, get, set } from "https://www.gstatic.com/firebasejs/9.21.0/firebase-database.js"; +import { loadThreeScene, unloadThreeScene } from "./three-scene.js"; // Asegúrate de crear el archivo three-scene.js -// Importar Three.js -import * as THREE from "https://cdnjs.cloudflare.com/ajax/libs/three.js/r128/three.module.min.js"; - - - -// Función para registrar un nuevo usuario +// Función para registrar un usuario nuevo function registerUser(email, password) { createUserWithEmailAndPassword(auth, email, password) .then((userCredential) => { @@ -22,72 +22,85 @@ function registerUser(email, password) { position: { x: 0, y: 0, z: 0 } }; set(ref(database, 'players/' + user.uid), initialData); + alert("Usuario registrado con éxito."); }) .catch((error) => { console.error("Error al registrar usuario:", error.message); + alert("Error al registrar usuario: " + error.message); }); } -// Función para iniciar sesión con un usuario existente +// Función para iniciar sesión function loginUser(email, password) { signInWithEmailAndPassword(auth, email, password) .then((userCredential) => { const user = userCredential.user; - console.log("Usuario logueado:", user.uid); - - // Cargar datos del jugador al iniciar sesión - loadPlayerData(user.uid); + console.log("Inicio de sesión exitoso:", user.uid); + alert("Inicio de sesión exitoso."); }) .catch((error) => { console.error("Error al iniciar sesión:", error.message); + alert("Error al iniciar sesión: " + error.message); + }); +} + +// Función para cerrar sesión +function logoutUser() { + signOut(auth) + .then(() => { + console.log("Usuario desconectado."); + unloadThreeScene(); + alert("Sesión cerrada."); + }) + .catch((error) => { + console.error("Error al cerrar sesión:", error.message); + alert("Error al cerrar sesión: " + error.message); }); } -// Cargar datos del jugador desde la base de datos +// Función para cargar datos del jugador desde la base de datos function loadPlayerData(userId) { get(ref(database, 'players/' + userId)) .then((snapshot) => { if (snapshot.exists()) { const data = snapshot.val(); console.log("Datos del jugador cargados:", data); - // Aquí podrías usar los datos para mover o mostrar el cubo en Three.js + + // Inicializar la escena del cubo con los datos del jugador + loadThreeScene(data.position); } else { console.log("No se encontraron datos para este usuario."); } }) .catch((error) => { - console.error("Error al cargar datos:", error); + console.error("Error al cargar datos:", error.message); }); } -// Manejar el registro -function handleRegister() { + +// Detectar el estado de autenticación +onAuthStateChanged(auth, (user) => { + if (user) { + console.log("Usuario conectado:", user.uid); + loadPlayerData(user.uid); // Cargar datos y escena si el usuario está autenticado + } else { + console.log("Usuario no conectado."); + unloadThreeScene(); // Asegurarse de que la escena se descargue si no hay usuario + } +}); + +// Manejar registro e inicio de sesión desde los botones +window.handleRegister = () => { const email = document.getElementById("register-email").value; const password = document.getElementById("register-password").value; registerUser(email, password); -} +}; -// Manejar el inicio de sesión -function handleLogin() { +window.handleLogin = () => { const email = document.getElementById("login-email").value; const password = document.getElementById("login-password").value; loginUser(email, password); -} -// Escuchar cambios en tiempo real (opcional) -function listenForPlayerUpdates(userId) { - const playerRef = ref(database, 'players/' + userId); - onValue(playerRef, (snapshot) => { - const updatedData = snapshot.val(); - console.log("Datos actualizados:", updatedData); - // Actualiza el cubo en Three.js aquí si es necesario - }); -} +}; -// Verificar si el usuario está logueado (opcional) -onAuthStateChanged(auth, (user) => { - if (user) { - console.log("Usuario conectado:", user.uid); - loadPlayerData(user.uid); - } else { - console.log("Usuario desconectado."); - } -}); +window.handleLogout = () => { + logoutUser(); +};