Generateurv2/frontend/pages/room/[[...mode]].jsx
Kilton937342 035af2a3b7 modifs
2022-06-11 23:39:03 +02:00

201 lines
6.2 KiB
JavaScript

import { useRouter } from "next/router";
import Layout from "../../components/Layout.js";
import Join from "../../components/room/Join.jsx";
import Create from "../../components/room/Create.jsx";
import { isBrowser, isEmpty } from "../../utils/utils.js";
import { useQuery } from "react-query";
import { useCallback, useContext, useEffect, useState } from "react";
import { getRoom } from "../../requests/requests.room.js";
import RoomPage from "../../components/room/RoomPage.jsx";
import { getExos, getTags } from "../../requests/requests.exos.js";
import ReconnectingWebSocket from "reconnecting-websocket";
import WaitingRoom from "../../components/room/WaitingRoom.jsx";
import useWebsocketConsumer from "../../hooks/useWebsocketConsumer.jsx";
import useWebsocket from "../../hooks/useWebsocket.jsx";
import {
useWebsocketContext,
WebsocketContext,
WebsocketProvider,
} from "../../context/websocket.context.js";
import RoomHome from "../../components/room/HomePage.jsx";
export default function Room() {
const router = useRouter();
const action = router.query;
//const [ws, setWs] = useState(null);
/* const wsConnect = useCallback((id_code) => {
if (isBrowser) {
if (ws != null) {
ws.close();
setWs(null);
}
setWs(
new ReconnectingWebSocket("ws://192.168.1.18:8000/ws/room/" + id_code)
);
}
}, []);
*/
const [user, setUser] = useState();
/* useEffect(() => {
if (ws != null) {
console.log("TEST");
ws.onmessage = (e) => {
console.log("eeeee", e);
let data = JSON.parse(e.data);
let type = data.type;
if (type == "roomJoined") {
let id_code = data.id_code;
setUser({ clientId: data.clientId, user: data.identity });
sessionStorage.setItem("clientId", data.clientId);
router.push({ pathname: `/room/${id_code}` }, undefined, {
shallow: true,
});
} else if (type == "accept_room") {
let code = data.code;
ws.send(JSON.stringify({ data: { type: "logAcceptedWaiter", code: code } }));
} else if (type == "waitingRoom") {
let nick = data.nick
let id_code = data.id_code
setWaiting(true);
sessionStorage.setItem('waiter', true)
sessionStorage.setItem('waiter_nick', nick)
router.push({pathname: '/room/waiting/' + id_code}, undefined, {shallow: true })
} else if (type == "reloged") {
let id_code = data.id_code;
setUser({ clientId: data.clientId, user: data.identity });
sessionStorage.setItem("clientId", data.clientId);
router.push({ pathname: `/room/${id_code}` }, undefined, {
shallow: true,
});
} else if (type == "reconnectError") {
router.push({ pathname: "/room/join" });
} else if (type == "reconnected") {
setUser({ clientId: data.clientId, user: data.identity });
}
};
}
}, [ws]); */
//useWebsocketConsumer(ws, setUser,user, setData, dataRoom);
/* const { connect, ws, addMessageHandler, removeMessageHandler, reconnect } =
useWebsocket(); */
const {
send,
connect,
addMessageHandler,
removeMessageHandler,
isConnected,
} = useWebsocketContext();
useEffect(() => {
let handler = (e) => {
let data = JSON.parse(e.data);
let type = data.type;
switch (type) {
case "roomJoined": {
let id_code = data.id_code;
setUser({ clientId: data.clientId, user: data.identity });
sessionStorage.setItem("clientId", data.clientId);
router.push({ pathname: `/room/${id_code}` }, undefined, {
shallow: true,
});
break;
}
case "accept_room": {
let code = data.code;
let nick = data.nick;
send({
data: { type: "logAcceptedWaiter", code: code , nick: nick},
});
break;
}
case "waitingRoom": {
let nick = data.nick;
let id_code = data.id_code;
sessionStorage.setItem("waiter", true);
sessionStorage.setItem("waiter_nick", nick);
router.push({ pathname: "/room/waiting/" + id_code }, undefined, {
shallow: true,
});
break;
}
case "reloged": {
let id_code = data.id_code;
setUser({ clientId: data.clientId, user: data.identity });
sessionStorage.setItem("clientId", data.clientId);
router.push({ pathname: `/room/${id_code}` }, undefined, {
shallow: true,
});
break;
}
case "reconnected": {
setUser({ clientId: data.clientId, user: data.identity });
sessionStorage.setItem('clientId', data.clientId)
break;
}
case "reconnectError": {
router.push({ pathname: "/room/join/" + data.id_code });
break;
}
default:
console.log("default root", e);
}
};
addMessageHandler(handler);
return () => {
removeMessageHandler(handler);
};
});
return (
<>
{isEmpty(action ) && <RoomHome />}
{!isEmpty(action) && (
<>
{action.mode[0] == "create" ? (
<Create />
) : action.mode[0] == "join" ? (
<Join
wsConnect={(id_code) => {
connect(`ws://192.168.1.18:8000/ws/room/${id_code}`);
}}
send={send}
/>
) : action.mode[0] == "waiting" ? (
<WaitingRoom
wsConnect={(id_code) => {
connect(`ws://192.168.1.18:8000/ws/room/${id_code}`);
}}
send={send}
/>
) : (
<RoomPage
id_code={action.mode[0]}
user={user}
/>
)}
</>
)}
</>
);
}
export async function getStaticProps() {
return {
props: {},
revalidate: 60,
};
}
export const getStaticPaths = async () => {
return {
paths: [
/* { params: { mode: "join" } }, { params: { mode: "create" } } */
], //indicates that no page needs be created at build time
fallback: "blocking", //indicates the type of fallback
};
};