Kinou/ft_transcendence
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

fix bug pong decconection and win/loss fix history fix mute ? ban

Browse Source
This commit is contained in:
kinou-p 2023-06-21 02:11:11 +02:00
parent b53151ac5f
commit 90c3e3e0b7
14 changed files with 230 additions and 199 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
.env
View File

@ -14,9 +14,9 @@
NGINX_ENVSUBST_TEMPLATE_SUFFIX=".conf"
# BASE_URL=http://localhost
BASE_URL=localhost
REACT_APP_BASE_URL=localhost
REDIRECT_URI=http://localhost/api/auth/login
BASE_URL=92.143.191.152
REACT_APP_BASE_URL=92.143.191.152
REDIRECT_URI=http://92.143.191.152/api/auth/login
#postgres var
# POSTGRES_HOST=127.0.0.1
# DB_TYPE=postgres

24
containers/api/src/app.controller.ts
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/17 01:00:00 by apommier #+# #+# */
/* Updated: 2023/06/19 19:48:52 by apommier ### ########.fr */
/* Updated: 2023/06/21 01:19:01 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -220,7 +220,10 @@ export class AppController {
@UseGuards(JwtAuthGuard)
@Post('/win')
async addWin(@Request() req, @Body() data: any) {
console.log("WIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIIN: ", req.user.username)
const user = await this.userService.findOne(req.user.username);
console.log("User", user)
// const user2 = await this.userService.findOne(data.opName);
user.win++;
const Esp = 1 / (1 + Math.pow(10, (data.opRank - user.rank) / this.scaleFactor))
const newRank = user.rank + this.kFactor * (1 - Esp);
@ -234,14 +237,16 @@ export class AppController {
newMatch.opScore = data.opScore;
newMatch.opponent = data.opName;
newMatch.parent = user;
console.log(`newMatch WIIIN = ${newMatch}`);
await this.userService.saveChild(user, newMatch);
}
@UseGuards(JwtAuthGuard)
@Post('/loss')
async addLoss(@Request() req, @Body() data: any) {
console.log("LOOOOOOOOOOOOOOOSE: ", req.user.username)
const user = await this.userService.findOne(req.user.username);
console.log("User", user)
user.loss++;
const Esp = 1 / (1 + Math.pow(10, (data.opRank - user.rank) / this.scaleFactor))
@ -256,7 +261,7 @@ export class AppController {
newMatch.opScore = data.opScore;
newMatch.opponent = data.opName;
newMatch.parent = user;
console.log(`newMatch Loose= ${newMatch}`);
await this.userService.saveChild(user, newMatch);
}
@ -292,10 +297,10 @@ export class AppController {
@UseGuards(JwtAuthGuard)
@Get('/partyInvite')
async getPartyInvite(@Body() data: any)
async getPartyInvite(@Request() req, @Body() data: any)
{
//find data.username and add invite to list
const user = await this.userService.findOne(data.username);
const user = await this.userService.findOne(req.user.username);
user.partyInvite = user.partyInvite || [];
// this.userService.save(user);
// user.partyInvite.push(data);
@ -308,8 +313,13 @@ export class AppController {
async deleteInvite(@Request() req, @Body() data: any)
{
console.log("delete invite user= ", data.username)
const user = await this.userService.findOne(data.username);
user.partyInvite = user.partyInvite.filter(item => Object.values(item)[1] !== req.user.username);
const user = await this.userService.findOne(req.user.username);
// user.partyInvite = user.partyInvite.filter(item => Object.values(item)[1] !== req.user.username);
console.log("user.partyInvite before", user.partyInvite)
user.partyInvite = user.partyInvite.filter((item) => Object.values(item)[1] !== data.username);
console.log("user.partyInvite after", user.partyInvite)
this.userService.save(user);
}

3
containers/api/src/chat/chat.service.ts
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/17 01:00:25 by apommier #+# #+# */
/* Updated: 2023/06/18 13:14:51 by apommier ### ########.fr */
/* Updated: 2023/06/20 16:47:02 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -85,6 +85,7 @@ async banUser(convId: number, username: string) {
conv.banned = conv.banned || [];
if (conv.banned.find(item => item === username))
return (1);
conv.members = conv.members.filter((item) => item !== username);
conv.banned.push(username);
this.save(conv);
}

3
containers/api/src/users/users.service.ts
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/17 01:00:07 by apommier #+# #+# */
/* Updated: 2023/06/17 01:00:08 by apommier ### ########.fr */
/* Updated: 2023/06/21 01:31:44 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -47,6 +47,7 @@ export class UsersService {
async saveChild(user: User, match: MatchLog): Promise<User> {
// user.match = savedChild;
user.children.push(match)
await this.matchRepository.save(match);
return await this.userRepository.save(user);
}

157
containers/chat/src/chat/chat.gateway.ts
View File

@ -98,85 +98,80 @@ export class ChatGateway implements OnGatewayInit, OnGatewayConnection, OnGatewa
}
}
@SubscribeMessage('socket.io')
socketConnect(client: any, payload: any): void {
console.log("/socket.io")
// @SubscribeMessage('socket.io')
// socketConnect(client: any, payload: any): void {
// console.log("/socket.io")
// }
@SubscribeMessage('ban')
banUser(client: any, payload: any): void {
if (!this.clientsNames.has(payload.username))
{
console.log("No user found.");
return;
}
const bannedClients = this.clientsNames.get(payload.username);
bannedClients.forEach(client => {
console.log("Banning client:", client);
// Perform ban operation on each client, e.g., emit a 'ban' event
console.log("clietn socket=", this.clients[client])
this.clients[client].emit('ban', payload);
});
// console.log("/ban")
// console.log("in ban username=", payload.username)
// if (!this.clientsNames[payload.username])
// {
// console.log("no user ??")
// return ;
// }
// this.clientsNames[payload.username].forEach()
// console.log("client=", this.clientsNames)
// this.clients[payload.username].emit('ban', payload)
}
@SubscribeMessage('mute')
muteUser(client: any, payload: any): void {
if (!this.clientsNames.has(payload.username))
{
console.log("No user found.");
return;
}
const mutedClients = this.clientsNames.get(payload.username);
mutedClients.forEach(client => {
console.log("Banning client:", client);
// Perform ban operation on each client, e.g., emit a 'ban' event
console.log("clietn socket=", this.clients[client])
this.clients[client].emit('mute', payload);
});
console.log("/mute")
}
// @SubscribeMessage('sendMessage')
// handleMessage(user: any, payload: any): void {
// console.log(`message recceveid: ${payload}`)
// console.log(`message recceveid: ${payload.sender}`)
// console.log(`message recceveid: ${payload.convId}`)
// console.log(`message recceveid: ${payload.members}`)
// console.log(`client id: ${user.id}`)
// this.clientsNames.forEach((clientArray, clientName) => {
// console.log(`Clients with name ${clientName}:`);
// // clientArray.forEach((client) => {
// this.clientsNames[clientName]
// // .forEach(client => {
// // // if(client.id != user.id)
// // // {
// // console.log("send to someone")
// // console.log(client); // Perform actions on each client
// // // clients.emit('message', payload)
// // client.emit('message')
// // // }
// // });
// // .forEach((client) => {
// // if(client.id != user.id)
// // {
// // console.log("send to someone")
// // console.log(client); // Perform actions on each client
// // // clients.emit('message', payload)
// // client.emit('message')
// // }
// });
// };
@SubscribeMessage('sendMessage')
handleMessage(client: Socket, payload: any): void {
// console.log(`message received: ${payload}`);
console.log(`message sender: ${payload.sender}`);
console.log(`client id: ${client.id}`);
console.log(`conversation ID: ${payload.convId}`);
console.log(`members: ${payload.members}`);
// console.log(`message sender: ${payload.sender}`);
// console.log(`client id: ${client.id}`);
// console.log(`conversation ID: ${payload.convId}`);
// console.log(`members: ${payload.members}`);
this.clientsNames.forEach((clientArray, clientName) =>
{
console.log(` 5Clients with name ${clientName}:`);
// console.log(` 5Clients with name ${clientName}:`);
if (payload.members.includes(clientName))
{
clientArray.forEach((targetClient, index) =>
{
console.log(`client id: ${client.id}`);
console.log(`target: ${targetClient}`);
console.log(`target id: ${targetClient}`);
// console.log(`client id: ${client.id}`);
// console.log(`target: ${targetClient}`);
// console.log(`target id: ${targetClient}`);
if (targetClient && targetClient !== client.id)
{
console.log("Sending to someone");
console.log(`index= ${index}`);
console.log(`target: ${targetClient}`); // Perform actions on each target client
// targetClient.emit('message')
// this.clientsNames[clientName].emit('message')
// this.clientsNames["apommier"].emit('message')
// console.log("Sending to someone");
// console.log(`index= ${index}`);
// console.log(`target: ${targetClient}`); // Perform actions on each target client
this.clients[targetClient].emit('message', payload)
// console.log(test)
// console.log(test)
// this.clientsNames[clientName][index].emit('message');
// const socket = this.server.sockets.sockets.get(targetClient.id);
// if (socket) {
// socket.emit('message', payload);
// } else {
// console.log(`Socket with ID ${client.id} not found.`);
// }
// targetClient.emit('message', payload);
// targetClient.emit('message', payload);
}
else {
console.log("not sending");
@ -191,41 +186,3 @@ export class ChatGateway implements OnGatewayInit, OnGatewayConnection, OnGatewa
// for (let key in this.clientsNames) {
// if (payload.members.includes(key)) {
// console.log("Key exists in the array");
// // if (key !== payload.sender)
// // {
// for (let key2 in this.clientsNames[key])
// {
// if (client.id !== this.clientsNames[key][key2])
// {
// console.log("send to someone")
// this.clientsNames[key][key2].emit('message', payload)
// }
// }
// // }
// //if member socket different from mine
// //send
// } else {
// console.log("Key does not exist in the array");
// }
//if key is in member
// let socket = this.clients[key];
// console.log("Clé:", key);
// console.log("Socket:", socket);
// }
// payload.convId // conv user instead ?
//find user to send message to
//const res = {
//convId: payload.convId
//sender: payload.sender
// }
//while (user of conv)//how to get conv user
// if (user connected)
//send res to user
// }

81
containers/pong/src/pong/pong.gateway.ts
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/19 15:18:38 by apommier #+# #+# */
/* Updated: 2023/06/19 21:38:55 by apommier ### ########.fr */
/* Updated: 2023/06/21 00:59:39 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -53,26 +53,53 @@ export class PongGateway implements OnGatewayInit, OnGatewayConnection, OnGatewa
// console.log(`Client disconnected: ${client.id}`);
console.log(`Normal disconnected: ${client.id}`);
// this.waitingClients.delete(client);
this.waitingClients.forEach((waitingClient) => {
if (waitingClient.client === client) {
this.waitingClients.delete(waitingClient);
}})
delete this.clients[client.id];
console.log(`Total connected clients: ${Object.keys(this.clients).length}`);
}
// this.waitingClients.forEach((waitingClient) => {
// if (waitingClient.client === client) {
// this.waitingClients.delete(waitingClient);
// }})
// delete this.clients[client.id];
@SubscribeMessage('pong:disconnect')
disconnectClient(client: Socket, payload: any): void {
console.log("disconnect forced client= ", client.id)
for (const key in this.clients) {
if (this.clients.hasOwnProperty(key) && this.clients[key] === client)
delete this.clients[key];
}
// Delete the socket from the 'waitingClients' set
this.waitingClients.forEach((item) => {
this.waitingClients.forEach((item) => {
if (item.client === client)
this.waitingClients.delete(item);
});
// Delete the socket from the 'games' map
this.games.forEach((sockets, gameId) => {
const index = sockets.indexOf(client);
if (index !== -1)
{
if (index === 0)
{
console.log("emit boy1")
sockets[1].emit("pong:win")
// sockets[0].emit("/win")
}
else
{
console.log("emit boy2")
sockets[0].emit("pong:win")
// sockets[1].emit("/win")
}
this.games.delete(gameId);
delete this.clients[client.id];
}
})
console.log(`Total connected clients: ${Object.keys(this.clients).length}`);
}
@SubscribeMessage('pong:disconnect')
disconnectClient(client: Socket, payload: any): void {
console.log("disconnect forced client= ", client.id)
for (const key in this.clients) {
if (this.clients.hasOwnProperty(key) && this.clients[key] === client)
delete this.clients[key];
}
// Delete the socket from the 'waitingClients' set
this.waitingClients.forEach((item) => {
if (item.client === client)
this.waitingClients.delete(item);
});
@ -82,7 +109,6 @@ export class PongGateway implements OnGatewayInit, OnGatewayConnection, OnGatewa
const index = sockets.indexOf(client);
if (index !== -1)
{
if (index === 0)
{
console.log("emit boy1")
@ -95,19 +121,6 @@ export class PongGateway implements OnGatewayInit, OnGatewayConnection, OnGatewa
sockets[0].emit("pong:win")
// sockets[1].emit("/win")
}
// let playersIds =
// const playersIds = this.games.get(gameId).map(socket => socket.id);
// // if (playersIds[0] === payload.id)
// // {
// if (this.clients[playersIds[1]])
// this.clients[playersIds[1]].emit('pong:win');
// if (this.clients[playersIds[0]])
// this.clients[playersIds[0]].emit('pong:win');
// }
// if (playersIds[1] === payload.id)
// {
// }
//send victory to the other one
this.games.delete(gameId);
delete this.clients[client.id];
}

2
containers/react/.env
View File

@ -1,4 +1,4 @@
REACT_APP_BASE_URL=localhost
REACT_APP_BASE_URL=92.143.191.152
REACT_APP_API_SECRET=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
REACT_APP_CLIENT_UID=u-s4t2ud-6d29dfa49ba7146577ffd8bf595ae8d9e5aaa3e0a9615df18777171ebf836a41
# REACT_APP_BASE_URL=92.143.191.152

39
containers/react/src/components/Messages/Chats.tsx
View File

@ -97,6 +97,7 @@ function Chats(){
// let socket: Socket;
const socket = useRef<Socket | null>(null);
// const socket = Socket<DefaultEventsMap, DefaultEventsMap> | null
// socket = useRef( useRef<SocketIOClient.Socket | null>(null));
@ -115,15 +116,22 @@ function Chats(){
setConversation(convs.data);
// console.log(`connection....`);
socket.current = io('http://' + process.env.REACT_APP_BASE_URL + ':4001', { transports: ['polling'] });
// console.log(`connection done`);
socket.current.emit('connection', {username: tmpUser.data.username})
socket.current.on('message', (data) => { //data should be a message ?
// console.log(`message received data= ${data.sender}`)
// console.log(`message received data= ${data.convId}`)
// console.log(`message received data= ${data.sender}`)
// console.log(`current chat = ${currentChat}`)
socket.current.on('message', (data) => { //data should be a message ?)
setIncomingMessage(data);
});
socket.current.on('ban', (data) => {
// setIncomingMessage(data);
console.log("banned hehe");
window.location.reload()
});
socket.current.on('mute', (data) => {
console.log("muted hehe");
//set mute var to true and do nothing
});
setIsLoading(false)
}
@ -134,6 +142,14 @@ function Chats(){
};
getConv();
return () => {
console.log("Cleanup");
if (socket.current)
socket.current.disconnect();
// cleanup(); // Call the cleanup function to stop the ongoing process or perform necessary cleanup tasks
// cleanup();
};
}, [])
useEffect(()=> {
@ -175,6 +191,7 @@ function Chats(){
try {
const res = await api.post('/getMessage', data);
console.log("message of conv=", res.data)
setMessage(res.data);
} catch(err) {
@ -198,6 +215,14 @@ function Chats(){
id: null,
};
try{
const allowed = await api.post('/allowed', {convId: currentChat.id});
console.log("convid:", currentChat.id);
if (!allowed.data)
{
console.log("muted or banned");
return ;
}
console.log("not muted or banned");
const res = await api.post('/message', message);
const convMember = await api.post('/member', message);
message.members = convMember.data.members;
@ -437,7 +462,7 @@ function Chats(){
initial={false}
onExitComplete={() => null}
>
{setting && <ModalSetting handleClose={closeSetting} convId={currentChat.id.toString()}/>}
{setting && <ModalSetting handleClose={closeSetting} convId={currentChat.id.toString()} socket={socket.current}/>}
</AnimatePresence>
</motion.div>
</TouchDiv>

29
containers/react/src/components/Messages/GameModal.tsx
View File

@ -29,6 +29,7 @@ interface ModalGame {
const GameModal = ({ handleClose }: ModalGame) => {
const [users, setUsers] = useState([]);
// const [user, setUser] = useState();
const [selectedUser, setSelectedUser] = useState('');
// const [convs, setConvs] = useState([]);
const [channel, setChannel] = useState('');
@ -39,8 +40,10 @@ const GameModal = ({ handleClose }: ModalGame) => {
const fetchData = async () => {
try {
const tmpUsers = await api.get("/users");
// const tmpUser = await api.get("/profile");
// const tmpConvs = await api.get("/convs");
setUsers(tmpUsers.data);
// setUser(tmpUser.data);
// setConvs(tmpConvs.data);
} catch (err) {
console.log(err);
@ -53,20 +56,20 @@ const GameModal = ({ handleClose }: ModalGame) => {
setSelectedUser(event.target.value);
};
const joinChannel = async () => {
try {
await api.post("/join", { convId: channel });
} catch (err) {
console.log(err);
}
};
// const joinChannel = async () => {
// try {
// await api.post("/join", { convId: channel });
// } catch (err) {
// console.log(err);
// }
// };
const handleCheckButtonClick = () => {
// Perform your check action here
console.log("Checking user:", selectedUser);
};
// const handleCheckButtonClick = () => {
// // Perform your check action here
// console.log("Checking user:", selectedUser);
// };
const handleButtonClick = () => {
const handleButtonClick = async () => {
// let path = `play?`;
let path = `http://` + process.env.REACT_APP_BASE_URL + `/pong/play?`;
@ -93,6 +96,8 @@ const GameModal = ({ handleClose }: ModalGame) => {
// path = path.slice(0, -1);
// console.log(path)
// await api.post("/partyInvite", {username: selectedUser, gameId})
// console.log("path= ", path)
// history(path, { replace: true });
// window.location.replace(path);

15
containers/react/src/components/Messages/Message.tsx
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/01 18:24:46 by apommier #+# #+# */
/* Updated: 2023/06/20 12:47:33 by apommier ### ########.fr */
/* Updated: 2023/06/20 19:05:10 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -42,6 +42,8 @@ function MessageMe({message, own}: MessageMeProps){
const [user, setUser] = useState<User>();
const scrollRef = useRef<HTMLDivElement>(null);
// console.log("Message eher")
useEffect(() => {
if (scrollRef.current)
{
@ -80,13 +82,20 @@ function MessageMe({message, own}: MessageMeProps){
};
if (!user || !sender || !conv)
{
// console.log("return")
return (<></>);
}
// console.log("result includes=", conv.banned.includes(user.username))
// console.log("result includes=", conv.blocked.includes(user.username))
if (user.blocked && user.blocked.includes(message.sender))
return (<></>);
else if (conv.banned && conv.banned.includes(user.username))
return (<></>);
// else if (conv.banned && conv.banned.includes(user.username))
// {
// console.log("return2")
// return (<></>);
// }
// console.log("noy return")
// if (user.blocked.includes(message.sender))/
return (

4
containers/react/src/components/Messages/Modal.tsx
View File

@ -100,11 +100,11 @@ const Modal = ({handleClose}) => {
// let new_name;
return (
<Backdrop>
<Backdrop onClick={handleClose}>
<motion.div
onClick={(e) => e.stopPropagation()}
className="modal"
variant={dropIn}
// variant={dropIn}
initial="hidden"
animate="visible"
exit="exit"

30
containers/react/src/components/Messages/ModalSetting.tsx
View File

@ -8,6 +8,7 @@ import { Link } from "react-router-dom";
import api from "../../script/axiosApi.tsx";
import React from "react";
import {User} from "../../../interfaces.tsx"
import { Socket } from "socket.io-client";
const dropIn = {
@ -28,10 +29,11 @@ const dropIn = {
interface ModalSettingProps {
handleClose: Function,
convId: string
convId: string,
socket: Socket | null,
}
const ModalSetting = ({handleClose, convId}: ModalSettingProps) => {
const ModalSetting = ({handleClose, convId, socket }: ModalSettingProps) => {
const [password, setPassword] = useState(false);
const [users, setUsers] = useState<User[]>([]);
const [selectTags, setSelectTag] = useState([{ id: 1, selectedOption: ''}]);
@ -101,6 +103,7 @@ const ModalSetting = ({handleClose, convId}: ModalSettingProps) => {
return ;
try{
api.post("/name", {convId: convId, name: newName})
window.location.reload()
} catch(err) {
console.log(err);
}
@ -111,51 +114,56 @@ const ModalSetting = ({handleClose, convId}: ModalSettingProps) => {
if (e.key !== "Enter")
return ;
try{
api.post("/password", {convId: convId, password: newPassword})
await api.post("/password", {convId: convId, password: newPassword})
} catch(err) {
console.log(err);
}
handleClose();
}
const handleBan = () => {
const handleBan = async () => {
// console.log("ban option= ", selectedUser)
try{
// console.log("user select=", selectedUser.length)
if (!selectedUser.length)
return ;
api.post("/ban", {convId: convId, username: selectedUser})
await api.post("/ban", {convId: convId, username: selectedUser})
if (socket)
{
console.log("emit to ban server")
socket.emit("ban", {username: selectedUser})
}
} catch(err) {
console.log(err);
}
handleClose();
};
const handleAdmin = () => {
const handleAdmin = async () => {
if (!selectedUser.length)
return ;
try{
api.post("/admin", {convId: convId, username: selectedUser})
await api.post("/admin", {convId: convId, username: selectedUser})
} catch(err) {
console.log(err);
}
handleClose();
};
const handleMute = () => {
const handleMute = async () => {
if (!selectedUser.length)
return ;
try{
api.post("/mute", {convId: convId, username: selectedUser})
await api.post("/mute", {convId: convId, username: selectedUser})
} catch(err) {
console.log(err);
}
handleClose();
};
const handleInvite = () => {
const handleInvite = async () => {
try{
api.post("/invite", {convId: convId, username: selectedUser})
await api.post("/invite", {convId: convId, username: selectedUser})
} catch(err) {
console.log(err);
}

6
containers/react/src/components/Messages/PartyInvite.tsx
View File

@ -6,7 +6,7 @@
/* By: apommier <apommier@student.42.fr> +#+ +:+ +#+ */
/* +#+#+#+#+#+ +#+ */
/* Created: 2023/06/19 16:44:29 by apommier #+# #+# */
/* Updated: 2023/06/20 03:47:52 by apommier ### ########.fr */
/* Updated: 2023/06/20 23:53:01 by apommier ### ########.fr */
/* */
/* ************************************************************************** */
@ -83,9 +83,6 @@ export default function PartyInvite({currentInvite}: UserProps)
window.location.reload();
};
const Accept = async (request: User) => {
try{
//call canvas ??
@ -118,6 +115,7 @@ export default function PartyInvite({currentInvite}: UserProps)
// Vérifier si le contenu doit être caché
if (clickEvent) {
console.log("retrun true")
return null; // Rendre null pour ne pas afficher le contenu
}

28
containers/react/src/pages/canvas.tsx
View File

@ -61,7 +61,7 @@ function DrawCanvas(option: number, gameParam: GameProps) {
if(!ctx)
return ;
const socket = io('http://' + process.env.REACT_APP_BASE_URL + ':4000');
const socket = io('http://' + process.env.REACT_APP_BASE_URL + ':4000', { transports: ['polling'] });
// useEffect(() => {
// console.log("useeffect?????????????????")
// return () => {
@ -137,14 +137,14 @@ function DrawCanvas(option: number, gameParam: GameProps) {
socket.on('pong:win', async () => {
myScore = maxScore;
console.log("instant win opponent disconnect")
const data = {
myScore: myScore,
opScore: hisScore,
opName: opName,
opRank: opRank,
};
// const data = {
// myScore: myScore,
// opScore: hisScore,
// opName: opName,
// opRank: opRank,
// };
await api.post('/win', data);
// await api.post('/win', data);
console.log("after request1")
await api.post('/status', {status: 1});
console.log("after request2")
@ -152,7 +152,7 @@ socket.on('pong:win', async () => {
running = false;
socket.emit('pong:disconnect', {id: myId});
console.log("before reload")
window.location.replace("http://" + process.env.REACT_APP_BASE_URL + "/pong");
// window.location.replace("http://" + process.env.REACT_APP_BASE_URL + "/pong");
// window.location.reload();
return ;
// console.log("send all ?? win");
@ -468,6 +468,7 @@ async function draw(timestamp: number)
}
if (myScore === maxScore || hisScore === maxScore)
{
console.log("maxScore!!!!")
const data = {
myScore: myScore,
opScore: hisScore,
@ -485,8 +486,9 @@ async function draw(timestamp: number)
}
else
{
// await api.post('/loss', data);
// await api.post('/status', {status: 1});
await api.post('/loss', data);
await api.post('/status', {status: 1});
socket.emit('pong:disconnect', {id: myId});
//disconnect ?
console.log("send loose");
}
@ -604,7 +606,9 @@ async function draw(timestamp: number)
}
if (ballX > canvas.width)
{
console.log("win point")
// if (ballX > canvas.width * 2)
// socket.emit
// console.log("win point")
// if (ballY <= paddleY + paddleHeight + ballRadius && ballY >= paddleY - ballRadius)
// {
// console.log('true hehe');