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

socket io with fastify

Browse source
This commit is contained in:
Maieul BOYER 2025-11-18 15:10:32 +01:00 • committed by Maix0
parent 34e9f8e3ca
commit 0a504a75ce
6 changed files with 101 additions and 47 deletions
Download patch file Download diff file Expand all files Collapse all files

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

@ -3,24 +3,25 @@ import { showError } from "@app/toast";
import authHtml from './chat.html?raw';
import client from '@app/api'
import { updateUser } from "@app/auth";
import io from "socket.io-client"
import io from "socket.io-client";
// const socket = io("wss://localhost:8888");
const socket = io("wss://localhost:8888", {
path: "/app/chat/socket.io/",
secure: false,
transports: ["websocket"],
const socket = io("wss://local.maix.me:8888", {
path: "/api/chat/socket.io/",
secure: true,
transports: ["websocket"],
});
// Listen for the 'connect' event
socket.on("connect", () => {
socket.on("connect", async () => {
console.log("Connected to the server: ", socket.id);
// Send a message to the server
socket.send("Hello from the client: " + `${socket.id}`);
// Emit a custom event 'coucou' with some data
socket.emit("coucou", { message: "Hello Nigel from coucou!" });
console.log('sent coucou');
// Send a message to the server
socket.send("Hello from the client: " + `${socket.id}`);
});
@ -33,33 +34,31 @@ type Providers = {
};
function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn {
setTitle('Chat Page');
// Listen for the 'connect' event
return {
html: authHtml, postInsert: async (app) => {
html: authHtml, postInsert: async (app) => {
const sendButton = document.getElementById('b-send') as HTMLButtonElement;
const chatWindow = document.getElementById('t-chatbox') as HTMLDivElement;
const sendtextbox= document.getElementById('t-chat-window') as HTMLButtonElement;
const sendtextbox = document.getElementById('t-chat-window') as HTMLButtonElement;
const blogout = document.getElementById('b-logout') as HTMLButtonElement;
const bwhoami = document.getElementById('b-whoami') as HTMLButtonElement;
const username = document.getElementById('username') as HTMLDivElement;
const value = await client.chatTest();
if (value.kind === "success")
{
if (value.kind === "success") {
console.log(value.payload);
}
else if (value.kind === "notLoggedIn")
{
else if (value.kind === "notLoggedIn") {
} else {
console.log('unknown response: ', value);
}
// Add a new message to the chat display
const addMessage = (text: any) => {
const messageElement = document.createElement('div');
@ -67,16 +66,16 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
chatWindow.appendChild(messageElement);
chatWindow.scrollTop = chatWindow.scrollHeight; //puts scroll to the bottom
};
sendButton!.addEventListener('click', async () => {
let msgtext: string = sendtextbox.value;
if (msgtext) {
addMessage(msgtext);
sendButton!.addEventListener('click', async () => {
let msgtext: string = sendtextbox.value;
if (msgtext) {
addMessage(msgtext);
sendtextbox.value = "";
}
}
});
chatWindow.textContent = "helloWorld";
// Whoami button to display user name
@ -103,10 +102,10 @@ function handleChat(_url: string, _args: RouteHandlerParams): RouteHandlerReturn
}
}
};
addRoute('/chat', handleChat, { bypass_auth: true });
addRoute('/chat', handleChat, { bypass_auth: true });