From 285761e07586e734b53b695690e4bb83381ff507 Mon Sep 17 00:00:00 2001 From: Marklogo Date: Mon, 1 Apr 2024 13:55:51 +0200 Subject: [PATCH] refactorizacion --- public/js/cardgames.js | 17 ++++++++ public/js/listapartidas.js | 14 +++++++ public/js/listausuarios.js | 33 ++++++++++++++++ public/js/salaespera.js | 62 ++++++------------------------ public/salageneral.html | 2 +- src/sala-chat/sala-chat.gateway.ts | 29 ++++++++------ src/sala-chat/sala-chat.service.ts | 5 +++ 7 files changed, 100 insertions(+), 62 deletions(-) create mode 100644 public/js/cardgames.js create mode 100644 public/js/listapartidas.js create mode 100644 public/js/listausuarios.js diff --git a/public/js/cardgames.js b/public/js/cardgames.js new file mode 100644 index 0000000..f647a7e --- /dev/null +++ b/public/js/cardgames.js @@ -0,0 +1,17 @@ +export const cardGame = (nickname, game_id) => { + var cardGameDiv = document.createElement('div'); + cardGameDiv.classList.add('cardGame'); + cardGameDiv.innerHTML = `${nickname} + Esperando rival... + + `; +}; + +export const cardGame = (nickname, game_id) => { + var cardGameDiv = document.createElement('div'); + cardGameDiv.classList.add('cardGame'); + cardGameDiv.innerHTML = `${nickname} + VS + + `; +}; diff --git a/public/js/listapartidas.js b/public/js/listapartidas.js new file mode 100644 index 0000000..b5fb9b0 --- /dev/null +++ b/public/js/listapartidas.js @@ -0,0 +1,14 @@ +export class ListaPartidas { + _partidas = []; + constructor(partidas) { + this._partidas = partidas; + } + agregarPartida(partida) { + this._partidas.push(partida); + } + + get partidasAbiertas() { + return this._partidas.filter((partida) => partida.abierta); + } + } + \ No newline at end of file diff --git a/public/js/listausuarios.js b/public/js/listausuarios.js new file mode 100644 index 0000000..b12f512 --- /dev/null +++ b/public/js/listausuarios.js @@ -0,0 +1,33 @@ +export class ListaUsuarios { + _usuario = {}; + _usuarios = []; + + constructor(uuidUsuario, usuarios) { + this._usuario = usuarios.find((usuario) => usuario.uuid === uuidUsuario); + this._usuarios = usuarios.filter((usuario) => usuario.uuid !== uuidUsuario); + } + get usuario() { + return this._usuario; + } + get usuariosConectados() { + return this._usuarios + .filter((usuario) => usuario.conectado) + .sort((a, b) => a.nickname.localeCompare(b.nickname)); + } + get usuariosDesconectados() { + return this._usuarios + .filter((usuario) => !usuario.conectado) + .sort((a, b) => a.nickname.localeCompare(b.nickname)); + } + actualizaUsuario(usuario) { + const user = this.obtenerUsuarioPorUuid(usuario.uuid); + if (user) { + user.conectado = usuario.conectado; + } else { + this._usuarios.push(usuario); + } + } + obtenerUsuarioPorUuid(uuid) { + return this._usuarios.find((usuario) => usuario.uuid === uuid); + } + } \ No newline at end of file diff --git a/public/js/salaespera.js b/public/js/salaespera.js index 6f3ca14..2dbc448 100644 --- a/public/js/salaespera.js +++ b/public/js/salaespera.js @@ -1,48 +1,5 @@ -class ListaUsuarios { - _usuario = {}; - _usuarios = []; - - constructor(uuidUsuario, usuarios) { - this._usuario = usuarios.find((usuario) => usuario.uuid === uuidUsuario); - this._usuarios = usuarios.filter((usuario) => usuario.uuid !== uuidUsuario); - } - get usuario() { - return this._usuario; - } - get usuariosConectados() { - return this._usuarios - .filter((usuario) => usuario.conectado) - .sort((a, b) => a.nickname.localeCompare(b.nickname)); - } - get usuariosDesconectados() { - return this._usuarios - .filter((usuario) => !usuario.conectado) - .sort((a, b) => a.nickname.localeCompare(b.nickname)); - } - actualizaUsuario(usuario) { - const user = this.obtenerUsuarioPorUuid(usuario.uuid); - if (user) { - user.conectado = usuario.conectado; - } else { - this._usuarios.push(usuario); - } - } - obtenerUsuarioPorUuid(uuid) { - return this._usuarios.find((usuario) => usuario.uuid === uuid); - } -} - -class ListaPartidas { - _partidas = []; - - agregarPartida(partida) { - this._partidas.push(partida); - } - - get partidasAbiertas() { - return this._partidas.filter((partida) => partida.abierta); - } -} +import { ListaUsuarios } from "./listausuarios.js"; +import { ListaPartidas } from "./listapartidas.js"; const usersConnectUlEl = document.querySelector('#users_connect'); const usersDisconnectUlEl = document.querySelector('#users_disconnect'); @@ -54,7 +11,7 @@ const userId = localStorage.getItem('userId'); const socket = io('/salachat', { closeOnBeforeunload: true, auth: { userId } }); let listaUsuarios; -let listaPartidas = new ListaPartidas(); +let listaPartidas; function unirse(data) { console.log(data); @@ -117,27 +74,32 @@ function agregaMsgBroadcast(msg) { chat.appendChild(linea); logchat.scrollTop = logchat.scrollHeight; } + const cardGameHTML = (nickname, game_id) => { var cardGameDiv = document.createElement('div'); cardGameDiv.classList.add('cardGame'); cardGameDiv.innerHTML = nickname === listaUsuarios.usuario.nickname ? `${nickname} - VS - Esperando rival + Esperando rival... + ` : `${nickname} VS - + `; partidasAbiertasEl.appendChild(cardGameDiv); }; + + // Logica de negocio de la aplicacion //Entra a la sala -const entraSala = (usuarios) => { +const entraSala = ({ usuarios, partidas }) => { listaUsuarios = new ListaUsuarios(userId, usuarios); listarUsuarios(); + listaPartidas = new ListaPartidas(partidas); + listarPartidasAbiertas(); }; // Actualiza info Usuarios const actualizaUsuarios = (usuario) => { diff --git a/public/salageneral.html b/public/salageneral.html index a9a4ddf..0033ca2 100644 --- a/public/salageneral.html +++ b/public/salageneral.html @@ -56,7 +56,7 @@ - + \ No newline at end of file diff --git a/src/sala-chat/sala-chat.gateway.ts b/src/sala-chat/sala-chat.gateway.ts index d512141..a65a179 100644 --- a/src/sala-chat/sala-chat.gateway.ts +++ b/src/sala-chat/sala-chat.gateway.ts @@ -19,11 +19,16 @@ export class SalaChatGateway handleConnection(client: Socket) { const userId = client.handshake.auth.userId; const userConectado = this.salaChatService.conectaUsuarioUUID(userId); - if (userConectado){ + if (userConectado) { client.join('chat_general'); - client.emit('onConnectRoom',this.salaChatService.listaUsuariosSinPartidas); - client.broadcast.to('chat_general').emit('onUserConnectRoom',userConectado); - }else{ + client.emit('onConnectRoom', { + usuarios: this.salaChatService.listaUsuariosSinPartidas, + partidas: this.salaChatService.partidasAbiertas, + }); + client.broadcast + .to('chat_general') + .emit('onUserConnectRoom', userConectado); + } else { client.disconnect(); } } @@ -31,8 +36,10 @@ export class SalaChatGateway handleDisconnect(client: Socket) { const userId = client.handshake.auth.userId; const userDesconectado = this.salaChatService.desconectaUsuarioUUID(userId); - if (userDesconectado){ - client.broadcast.to('chat_general').emit('onUserDisconnectRoom',userDesconectado); + if (userDesconectado) { + client.broadcast + .to('chat_general') + .emit('onUserDisconnectRoom', userDesconectado); } client.leave('chat_general'); } @@ -42,20 +49,20 @@ export class SalaChatGateway const userId = client.handshake.auth.userId; const user = this.salaChatService.getUsuarioUUID(userId); if (user) { - this.server.to('chat_general').emit('chatMsg', { uuid:userId, msg }); + this.server.to('chat_general').emit('chatMsg', { uuid: userId, msg }); } else { client.disconnect(); } } - sendBroadcastMsg(msg:string){ - this.server.to('chat_general').emit('broadcastMsg',msg); + sendBroadcastMsg(msg: string) { + this.server.to('chat_general').emit('broadcastMsg', msg); } @SubscribeMessage('creaPartida') handleCreaPartida(client: Socket) { const userId = client.handshake.auth.userId; - const partida= this.salaChatService.creaPartida(userId); - this.server.to('chat_general').emit('on_create_partida',partida); + const partida = this.salaChatService.creaPartida(userId); + this.server.to('chat_general').emit('on_create_partida', partida); } } diff --git a/src/sala-chat/sala-chat.service.ts b/src/sala-chat/sala-chat.service.ts index 5cd0040..a41bf08 100644 --- a/src/sala-chat/sala-chat.service.ts +++ b/src/sala-chat/sala-chat.service.ts @@ -19,6 +19,11 @@ export class SalaChatService { ); } + get partidasAbiertas(){ + return this.partidasService.partidasAbiertas; + } + + getUsuarioUUID(uuid: string) { return this.usuariosService.getUsuarioByUUID(uuid); }