block button in profil toggles with block or un blocked

This commit is contained in:
NigeParis 2025-12-17 13:20:01 +01:00
parent c41a32e4b1
commit 8500d7dbe2
3 changed files with 86 additions and 47 deletions

View file

@ -261,8 +261,8 @@ async function openMessagePopup(message: string) {
if (modalmessage) { if (modalmessage) {
const messageElement = document.createElement("div"); const messageElement = document.createElement("div");
messageElement.innerHTML = ` messageElement.innerHTML = `
<div class="profile-info"> <div class="profile-info"
<div id="profile-about">Next Game Message ${incrementCounter()}: ${obj.link}</div> <div id="profile-about">Next Game Message ${incrementCounter()}: ${obj}</div>
</div>`; </div>`;
modalmessage.appendChild(messageElement); modalmessage.appendChild(messageElement);
modalmessage.scrollTop = modalmessage.scrollHeight; modalmessage.scrollTop = modalmessage.scrollHeight;
@ -356,6 +356,7 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
profil.SenderID = getUser()?.id ?? ""; profil.SenderID = getUser()?.id ?? "";
profil.SenderName = getUser()?.name ?? ""; profil.SenderName = getUser()?.name ?? "";
openProfilePopup(profil); openProfilePopup(profil);
socket.emit('isBlockdBtn', profil);
console.log(`DEBUG LOG: userId:${profil.userID}: senderID${profil.SenderID}' senderID:${getUser()?.id}`); console.log(`DEBUG LOG: userId:${profil.userID}: senderID${profil.SenderID}' senderID:${getUser()?.id}`);
console.log(`DEBUG LOG: user:${profil.user}: sender:${profil.SenderName}' senderID:${getUser()?.name}`); console.log(`DEBUG LOG: user:${profil.user}: sender:${profil.SenderName}' senderID:${getUser()?.name}`);
socket.emit('check_Block_button', profil); socket.emit('check_Block_button', profil);
@ -375,9 +376,10 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
socket.on('blockUser', (blocked: ClientProfil) => { socket.on('blockUser', (blocked: ClientProfil) => {
let icon = '⛔'; let icon = '⛔';
const chatWindow = document.getElementById("t-chatbox") as HTMLDivElement; const chatWindow = document.getElementById("t-chatbox") as HTMLDivElement;
const messageElement = document.createElement("div"); const messageElement = document.createElement("div");
if (`${blocked.text}` === 'I have un-blocked you' ) { icon = '💚'}; if (`${blocked.text}` === 'I have un-blocked you' ) {icon = '💚'};
messageElement.innerText =`${icon}${blocked.SenderName}: ${blocked.text}`; messageElement.innerText =`${icon}${blocked.SenderName}: ${blocked.text}`;
chatWindow.appendChild(messageElement); chatWindow.appendChild(messageElement);
chatWindow.scrollTop = chatWindow.scrollHeight; chatWindow.scrollTop = chatWindow.scrollHeight;
@ -418,7 +420,7 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
setTimeout(() => { setTimeout(() => {
connected(socket); connected(socket);
}, 0); }, 16);
if (window.location.pathname === '/app/chat') { 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) {

View file

@ -134,6 +134,7 @@ declare module 'fastify' {
list: (oldUser: string, user: string) => void; list: (oldUser: string, user: string) => void;
updateClientName: (oldUser: string, user: string) => void; updateClientName: (oldUser: string, user: string) => void;
blockBtn: (data: blockedUnBlocked) => void; blockBtn: (data: blockedUnBlocked) => void;
isBlockdBtn: (data: blockedUnBlocked) => void;
check_Block_button: (data: blockedUnBlocked) => void; check_Block_button: (data: blockedUnBlocked) => void;
}>; }>;
} }
@ -189,7 +190,7 @@ async function onReady(fastify: FastifyInstance) {
socket.on('message', (message: string) => { socket.on('message', (message: string) => {
// console.info(color.blue, 'DEBUG LOG: Socket connected!', color.reset, socket.id); // console.info(color.blue, 'DEBUG LOG: Socket connected!', color.reset, socket.id);
// console.log( color.blue, 'DEBUG LOG: Received message from client', color.reset, message); // console.log( color.blue, 'DEBUG LOG: Received message from client', color.reset, message);
const obj: obj = JSON.parse(message) as ClientMessage; const obj: ClientMessage = JSON.parse(message) as ClientMessage;
clientChat.set(socket.id, { user: obj.user, lastSeen: Date.now() }); clientChat.set(socket.id, { user: obj.user, lastSeen: Date.now() });
// console.log(color.green, 'DEBUG LOG: Message from client', color.reset, `Sender: login name: ${obj.user} - windowID ${obj.SenderWindowID} - text message: ${obj.text}`); // console.log(color.green, 'DEBUG LOG: Message from client', color.reset, `Sender: login name: ${obj.user} - windowID ${obj.SenderWindowID} - text message: ${obj.text}`);
socket.emit('welcome', { msg: 'Welcome to the chat! : ' }); socket.emit('welcome', { msg: 'Welcome to the chat! : ' });
@ -203,27 +204,6 @@ async function onReady(fastify: FastifyInstance) {
list_SocketListener(fastify, socket); list_SocketListener(fastify, socket);
// socket.on('list', (object) => {
// const userFromFrontend = object || null;
// const client = clientChat.get(socket.id) || null;
// //console.log(color.red, 'DEBUG LOG: list activated', userFromFrontend, color.reset, socket.id);
// if (userFromFrontend.oldUser !== userFromFrontend.user) {
// //console.log(color.red, 'DEBUG LOG: list activated', userFromFrontend.oldUser, color.reset);
// // if (client?.user === null) {
// // console.log('ERROR: clientName is NULL');
// // return;
// // };
// if (client) {
// client.user = userFromFrontend.user;
// }
// }
// connectedUser(fastify.io, socket.id);
// });
socket.on('updateClientName', (object) => { socket.on('updateClientName', (object) => {
const userFromFrontend = object || null; const userFromFrontend = object || null;
const client = clientChat.get(socket.id) || null; const client = clientChat.get(socket.id) || null;
@ -384,6 +364,42 @@ async function onReady(fastify: FastifyInstance) {
} }
}); });
socket.on('isBlockdBtn', async (data: ClientProfil) => {
const profilBlock: ClientProfil = data || '';
const users: User[] = fastify.db.getAllUsers() ?? [];
const UserToBlock: User | null = getUserByName(users, `${profilBlock.user}`);
const UserAskingToBlock: User | null = getUserByName(users, `${profilBlock.SenderName}`);
console.log(color.yellow, `user to block: ${profilBlock.user}`);
console.log(color.yellow, UserToBlock);
console.log(color.yellow, `user Asking to block: ${profilBlock.SenderName}`);
console.log(color.yellow, UserAskingToBlock);
if (!UserAskingToBlock || !UserToBlock) return;
if(isUser_BlockedBy_me(fastify, UserAskingToBlock!.id, UserToBlock!.id)) {
const message: blockedUnBlocked =
{
userState: "block",
userTarget: UserToBlock.name,
by: UserAskingToBlock.name,
};
socket.emit('blockBtn', message);
} else {
const message: blockedUnBlocked =
{
userState: "un-block",
userTarget: UserToBlock.name,
by: UserAskingToBlock.name,
};
socket.emit('blockBtn', message);
} });
socket.on('blockUser', async (data: string) => { socket.on('blockUser', async (data: string) => {
@ -393,16 +409,37 @@ async function onReady(fastify: FastifyInstance) {
const UserToBlock: User | null = getUserByName(users, `${profilBlock.user}`); const UserToBlock: User | null = getUserByName(users, `${profilBlock.user}`);
const UserAskingToBlock: User | null = getUserByName(users, `${profilBlock.SenderName}`); const UserAskingToBlock: User | null = getUserByName(users, `${profilBlock.SenderName}`);
console.log(color.yellow, `user to block: ${profilBlock.user}`); // console.log(color.yellow, `user to block: ${profilBlock.user}`);
console.log(color.yellow, UserToBlock); // console.log(color.yellow, UserToBlock);
console.log(color.yellow, `user Asking to block: ${profilBlock.SenderName}`); // console.log(color.yellow, `user Asking to block: ${profilBlock.SenderName}`);
console.log(color.yellow, UserAskingToBlock); // console.log(color.yellow, UserAskingToBlock);
console.log(color.red, clientName); // console.log(color.red, clientName);
const usersBlocked: BlockedData[] = fastify.db.getAllBlockedUsers() ?? []; const usersBlocked: BlockedData[] = fastify.db.getAllBlockedUsers() ?? [];
if (!UserAskingToBlock || !UserToBlock || !usersBlocked) return; if (!UserAskingToBlock || !UserToBlock || !usersBlocked) return;
const userAreBlocked: boolean = isBlocked(UserAskingToBlock, UserToBlock, usersBlocked); const userAreBlocked: boolean = isBlocked(UserAskingToBlock, UserToBlock, usersBlocked);
isUser_BlockedBy_me(fastify, UserAskingToBlock!.id, UserToBlock!.id); if(isUser_BlockedBy_me(fastify, UserAskingToBlock!.id, UserToBlock!.id)) {
const message: blockedUnBlocked =
{
userState: "un-block",
userTarget: "",
by: "",
};
socket.emit('blockBtn', message);
} else {
const message: blockedUnBlocked =
{
userState: "block",
userTarget: UserToBlock.name,
by: UserAskingToBlock.name,
};
socket.emit('blockBtn', message);
}
if (userAreBlocked) { if (userAreBlocked) {
@ -436,14 +473,14 @@ async function onReady(fastify: FastifyInstance) {
} }
// profilBlock.Sendertext = `'You have un-blocked '`; // profilBlock.Sendertext = `'You have un-blocked '`;
sendBlocked(fastify, blockedMessage, profilBlock); sendBlocked(fastify, blockedMessage, profilBlock);
const message: blockedUnBlocked = // const message: blockedUnBlocked =
{ // {
userState: "un-block", // userState: "un-block",
userTarget: "", // userTarget: "",
by: "", // by: "",
}; // };
socket.emit('blockBtn', message); // socket.emit('blockBtn', message);
} }
} }
else { else {
@ -475,14 +512,14 @@ async function onReady(fastify: FastifyInstance) {
// clientChat.delete(obj.user); // clientChat.delete(obj.user);
} }
sendBlocked(fastify, blockedMessage, profilBlock); sendBlocked(fastify, blockedMessage, profilBlock);
const message: blockedUnBlocked = // const message: blockedUnBlocked =
{ // {
userState: "block", // userState: "block",
userTarget: UserToBlock.name, // userTarget: UserToBlock.name,
by: UserAskingToBlock.name, // by: UserAskingToBlock.name,
}; // };
socket.emit('blockBtn', message); // socket.emit('blockBtn', message);
} }
} }
}); });