rparodi/ft_transcendence
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Trying to fix BUG with / when guest changes name without closing the window

Browse source
This commit is contained in:
NigeParis 2025-12-02 12:43:57 +01:00 • committed by apetitco
parent 05a9c58de5
commit 26c9bd6421
2 changed files with 37 additions and 32 deletions
Download patch file Download diff file Expand all files Collapse all files

49
frontend/src/pages/chat/chat.ts
View file

@ -49,11 +49,12 @@ async function isLoggedIn() {
async function windowStateHidden() { async function windowStateHidden() {
const socketId = __socket || undefined; const socketId = __socket || undefined;
let oldName = localStorage.getItem("oldName") || undefined; // let oldName = localStorage.getItem("oldName") ?? undefined;
if (socketId == undefined) return; let oldName: string;
if (socketId === undefined) return;
let userName = await updateUser(); let userName = await updateUser();
oldName = userName?.name || undefined; oldName = userName?.name ?? "";
if (oldName === undefined) return; if (oldName === "") return;
localStorage.setItem('oldName', oldName); localStorage.setItem('oldName', oldName);
socketId.emit('client_left', { socketId.emit('client_left', {
user: userName?.name, user: userName?.name,
@ -66,11 +67,12 @@ async function windowStateHidden() {
async function windowStateVisable() { async function windowStateVisable() {
const socketId = __socket || undefined; const socketId = __socket || undefined;
let oldName = localStorage.getItem("oldName") || undefined; let oldName = localStorage.getItem("oldName") || undefined;
console.log("%coldName :'" + oldName + "'", color.green); console.log("%c WINDOW VISIBLE - oldName :'" + oldName + "'", color.green);
if (socketId === undefined || oldName === undefined) {console.log("%SOCKET ID", color.red); return;} if (socketId === undefined || oldName === undefined) {console.log("%SOCKET ID", color.red); return;}
const res = await client.guestLogin(); // const res = await client.guestLogin();
let user = await updateUser(); let user = await updateUser();
if(user === null) return;
console.log("%cUserName :'" + user?.name + "'", color.green); console.log("%cUserName :'" + user?.name + "'", color.green);
socketId.emit('client_entered', { socketId.emit('client_entered', {
userName: oldName, userName: oldName,
@ -184,21 +186,21 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
let toggle = false let toggle = false
window.addEventListener("focus", () => { window.addEventListener("focus", () => {
if (window.location.pathname === "" && !toggle) { const bwhoami = document.getElementById('b-whoami') as HTMLButtonElement;
// bconnected.click(); if (window.location.pathname === '/app/chat') {
console.log("%cWindow is focused on /chat:" + socket.id, color.green); console.log("%cWindow is focused on /chat:" + socket.id, color.green);
if (socket.id) if (socket.id)
windowStateVisable(); windowStateVisable();
toggle = true; bwhoami.click();
toggle = true;
} }
}); });
window.addEventListener("blur", () => { window.addEventListener("blur", () => {
//bconnected.click();
console.log("%cWindow is not focused on /chat", color.red); console.log("%cWindow is not focused on /chat", color.red);
if (socket.id) if (socket.id)
windowStateHidden(); windowStateHidden();
toggle = false; toggle = false;
}); });
setTitle('Chat Page'); setTitle('Chat Page');
@ -303,20 +305,23 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
bconnected?.addEventListener("click", async () => { bconnected?.addEventListener("click", async () => {
const loggedIn = await isLoggedIn(); const loggedIn = await isLoggedIn();
let oldUser = localStorage.getItem("oldName") || undefined; console.log('%cloggedIn:',color.blue, loggedIn?.name);
if (loggedIn?.name === undefined) return ; let oldUser = localStorage.getItem("oldName") ?? "";
console.log('%coldUser:',color.yellow, oldUser);
if (loggedIn?.name === undefined) {console.log('');return ;}
oldUser = loggedIn.name || "undefined"; oldUser = loggedIn.name || "undefined";
const res = await client.guestLogin(); const res = await client.guestLogin();
let user = await updateUser(); let user = await updateUser();
console.log('%User?name:',color.yellow, user?.name);
localStorage.setItem("oldName", oldUser); localStorage.setItem("oldName", oldUser);
buddies.textContent = ""; buddies.textContent = "";
if (chatWindow) { // if (chatWindow) {
// addMessage('@list - lists all connected users in the chat'); // addMessage('@list - lists all connected users in the chat');
socket.emit('list', { socket.emit('list', {
oldUser: oldUser, oldUser: oldUser,
user: user?.name, user: user?.name,
}); });
} // }
}); });
@ -337,18 +342,16 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
bwhoami?.addEventListener('click', async () => { bwhoami?.addEventListener('click', async () => {
try { try {
const loggedIn = await isLoggedIn(); const loggedIn = await isLoggedIn();
let oldUser = localStorage.getItem("oldName") || undefined;
oldUser = loggedIn?.name || "undefined";
localStorage.setItem("oldName", oldUser);
const res = await client.guestLogin(); const res = await client.guestLogin();
switch (res.kind) { switch (res.kind) {
case 'success': { case 'success': {
let user = await updateUser(); let user = await updateUser();
console.log('USER ', user?.name); console.log('%cUSER_NAME ',color.yellow, user?.name);
console.log('%cGET_user ',color.yellow, getUser()?.name || null);
if (chatWindow) { if (chatWindow) {
socket.emit('updateClientName', { socket.emit('updateClientName', {
oldUser: oldUser, oldUser: '',
user: user?.name user: user?.name
}); });
} }

20
src/chat/src/app.ts
View file

@ -237,10 +237,10 @@ function broadcast(data: ClientMessage, sender?: string) {
if (userFromFrontend.oldUser !== userFromFrontend.user) { if (userFromFrontend.oldUser !== userFromFrontend.user) {
console.log(color.red, 'list activated', userFromFrontend.oldUser, color.reset); console.log(color.red, 'list activated', userFromFrontend.oldUser, color.reset);
if (client?.user === null) { // if (client?.user === null) {
console.log('ERROR: clientName is NULL'); // console.log('ERROR: clientName is NULL');
return; // return;
}; // };
if (client) { if (client) {
client.user = userFromFrontend.user; client.user = userFromFrontend.user;
} }
@ -254,12 +254,14 @@ function broadcast(data: ClientMessage, sender?: string) {
console.log(color.red, 'whoAMi activated', userFromFrontend, color.reset, socket.id); console.log(color.red, 'whoAMi activated', userFromFrontend, color.reset, socket.id);
if (userFromFrontend.oldUser !== userFromFrontend.user) { if (userFromFrontend.oldUser !== userFromFrontend.user) {
console.log(color.red, 'whoAMi activated', userFromFrontend.oldUser, color.reset); console.log(color.red, 'whoAMi activated', userFromFrontend.oldUser, color.reset);
if (client === null) { // if (client === null) {
console.log('ERROR: clientName is NULL'); // console.log('ERROR: clientName is NULL');
return; // return;
}; // };
if (client) { if (client) {
client.user = userFromFrontend.user; client.user = userFromFrontend.user;
console.log(color.green, 'client.user is: ', client.user);
} }
} }
}); });
@ -328,7 +330,7 @@ function broadcast(data: ClientMessage, sender?: string) {
timestamp: Date.now(), timestamp: Date.now(),
SenderWindowID: socket.id, SenderWindowID: socket.id,
}; };
console.log(obj.SenderWindowID); console.log(color.blue, 'BROADCASTS OUT :',obj.SenderWindowID);
broadcast(obj, obj.SenderWindowID); broadcast(obj, obj.SenderWindowID);
// clientChat.delete(obj.user); // clientChat.delete(obj.user);
} }