168 lines
4.9 KiB
JavaScript
168 lines
4.9 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";
|
|
import { notificationService } from "../../services/notification.service.js";
|
|
|
|
export default function Room() {
|
|
const router = useRouter();
|
|
const action = router.query;
|
|
const [user, setUser] = useState();
|
|
|
|
const {
|
|
send,
|
|
connect,
|
|
addMessageHandler,
|
|
removeMessageHandler,
|
|
disconnect,
|
|
isConnected,
|
|
} = useWebsocketContext();
|
|
|
|
|
|
|
|
useEffect(() => {
|
|
let handler = (e) => {
|
|
console.log('ROOT HANDLER')
|
|
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": {
|
|
console.log('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;
|
|
}
|
|
case "loginResponse": {
|
|
const error = data.error
|
|
if (error == 'USER_INPUT') {
|
|
notificationService.error('Connexion', data.description)
|
|
}
|
|
break;
|
|
}
|
|
case "room_deleted": {
|
|
sessionStorage.clear()
|
|
notificationService.info('Suppression', "La salle a été supprimée par l'administrateur", {keepAfterRouteChange: true})
|
|
router.push({ pathname: "/room/" });
|
|
|
|
break;
|
|
}
|
|
default:
|
|
break
|
|
}
|
|
};
|
|
addMessageHandler(handler);
|
|
return () => {
|
|
removeMessageHandler(handler);
|
|
};
|
|
});
|
|
|
|
|
|
useEffect(() => {
|
|
return () => {
|
|
disconnect()
|
|
}}, [])
|
|
return (
|
|
<>
|
|
{isEmpty(action) && router.isReady && <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
|
|
};
|
|
};
|
|
*/ |