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

@ -6,7 +6,7 @@ export function actionBtnPopUpBlock(block: ClientProfil, senderSocket: Socket) {
setTimeout(() => {
const blockUserBtn = document.querySelector("#popup-b-block");
blockUserBtn?.addEventListener("click", () => {
block.text = '';
block.text = '';
blockUser(block, senderSocket);
});
}, 0)

View file

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

View file

@ -134,6 +134,7 @@ declare module 'fastify' {
list: (oldUser: string, user: string) => void;
updateClientName: (oldUser: string, user: string) => void;
blockBtn: (data: blockedUnBlocked) => void;
isBlockdBtn: (data: blockedUnBlocked) => void;
check_Block_button: (data: blockedUnBlocked) => void;
}>;
}
@ -189,7 +190,7 @@ async function onReady(fastify: FastifyInstance) {
socket.on('message', (message: string) => {
// 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);
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() });
// 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! : ' });
@ -202,27 +203,6 @@ async function onReady(fastify: FastifyInstance) {
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) => {
const userFromFrontend = object || 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) => {
@ -393,16 +409,37 @@ async function onReady(fastify: FastifyInstance) {
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);
console.log(color.red, clientName);
// 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);
// console.log(color.red, clientName);
const usersBlocked: BlockedData[] = fastify.db.getAllBlockedUsers() ?? [];
if (!UserAskingToBlock || !UserToBlock || !usersBlocked) return;
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) {
@ -436,14 +473,14 @@ async function onReady(fastify: FastifyInstance) {
}
// profilBlock.Sendertext = `'You have un-blocked '`;
sendBlocked(fastify, blockedMessage, profilBlock);
const message: blockedUnBlocked =
{
userState: "un-block",
userTarget: "",
by: "",
// const message: blockedUnBlocked =
// {
// userState: "un-block",
// userTarget: "",
// by: "",
};
socket.emit('blockBtn', message);
// };
// socket.emit('blockBtn', message);
}
}
else {
@ -475,14 +512,14 @@ async function onReady(fastify: FastifyInstance) {
// clientChat.delete(obj.user);
}
sendBlocked(fastify, blockedMessage, profilBlock);
const message: blockedUnBlocked =
{
userState: "block",
userTarget: UserToBlock.name,
by: UserAskingToBlock.name,
// const message: blockedUnBlocked =
// {
// userState: "block",
// userTarget: UserToBlock.name,
// by: UserAskingToBlock.name,
};
socket.emit('blockBtn', message);
// };
// socket.emit('blockBtn', message);
}
}
});