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

minor stuff done like BG color of chat window

Browse source
This commit is contained in:
NigeParis 2025-11-26 20:43:08 +01:00 • committed by apetitco
parent 18956ee953
commit d9d3ada6a0
4 changed files with 16 additions and 11 deletions
Download patch file Download diff file Expand all files Collapse all files

3
frontend/src/chat/chat.css
View file

@ -62,7 +62,8 @@
flex flex
items-center items-center
justify-center justify-center
bg-gray-100; bg-[#43536b];
} }
.mainboxDisplay { .mainboxDisplay {

3
frontend/src/pages/chat/chat.html
View file

@ -5,8 +5,7 @@
Chat Box <span id="t-username"></span> Chat Box <span id="t-username"></span>
</h1><br> </h1><br>
<button id="b-clear" class="btn-style absolute top-6 right-6">Clear Text</button> <button id="b-clear" class="btn-style absolute top-6 right-6">Clear Text</button>
<button id="b-help" class="btn-style absolute top-18 left-6">Connected</button> <button id="b-help" class="btn-style absolute top-16 left-6">Connected</button>
<p>Welcome <span id="username"></span></p></br>
<div id="t-chatbox" class="chatbox-style"></div> <div id="t-chatbox" class="chatbox-style"></div>
</br> </br>
<div class="flex gap-2"> <div class="flex gap-2">

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

@ -43,9 +43,13 @@ document.addEventListener("visibilitychange", async () => {
if (socketId == undefined) return; if (socketId == undefined) return;
if (document.visibilityState === "hidden") { if (document.visibilityState === "hidden") {
let userName = await updateUser(); let userName = await updateUser();
oldName = userName?.name || "undefined"; oldName = userName?.name || undefined;
localStorage.setItem("oldName", oldName); if (oldName === undefined) return;
socketId.emit("client_left"); localStorage.setItem('oldName', oldName);
socketId.emit('client_left', {
user: userName?.name,
why: 'tab window hidden - socket not dead',
});
return; return;
} }
if (document.visibilityState === "visible") { if (document.visibilityState === "visible") {

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

@ -75,6 +75,7 @@ declare module 'fastify' {
message: (msg: string) => void; message: (msg: string) => void;
testend: (sock_id_client: string) => void; testend: (sock_id_client: string) => void;
client_entered: (userName: string, user: string) => void; client_entered: (userName: string, user: string) => void;
client_left: (userName: string, why: string) => void;
list: (oldUser: string, user: string) => void; list: (oldUser: string, user: string) => void;
updateClientName: (oldUser: string, user: string) => void; updateClientName: (oldUser: string, user: string) => void;
}>; }>;
@ -192,7 +193,7 @@ async function onReady(fastify: FastifyInstance) {
`Sender: login name: ${obj.user} - windowID ${obj.SenderWindowID} - text message: ${obj.text}`, `Sender: login name: ${obj.user} - windowID ${obj.SenderWindowID} - text message: ${obj.text}`,
); );
socket.emit('welcome', { socket.emit('welcome', {
msg: 'Welcome to the chat!', msg: 'Welcome to the chat! : ',
}); });
// Send object directly — DO NOT wrap it in a string // Send object directly — DO NOT wrap it in a string
@ -269,14 +270,14 @@ async function onReady(fastify: FastifyInstance) {
} }
}); });
socket.on('client_left', (reason) => { socket.on('client_left', (data) => {
const clientName = clientChat.get(socket.id)?.user || null; const clientName = clientChat.get(socket.id)?.user || null;
const leftChat = data || null;
console.log( console.log(
color.green, color.green,
`Client left the Chat: ${clientName} (${socket.id}) reason:`, `Left the Chat User: ${clientName} id Socket: ${socket.id} reason:`,
reason, leftChat.why,
); );
if (reason === 'transport error') return;
if (clientName !== null) { if (clientName !== null) {
const obj = { const obj = {