diff --git a/src/modals/MaintenanceModal.tsx b/src/modals/MaintenanceModal.tsx deleted file mode 100644 index 94508e0..0000000 --- a/src/modals/MaintenanceModal.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import { Box, Label, Flex, Button, Text } from "theme-ui"; - -import Modal from "../components/Modal"; - -import { RequestCloseEventHandler } from "../types/Events"; - -type MaintenanceModalProps = { - isOpen: boolean; - onRequestClose: RequestCloseEventHandler; -}; - -function MaintenanceModal({ isOpen, onRequestClose }: MaintenanceModalProps) { - return ( - - - - - Continue offline? - - - - - - - ); -} - -export default MaintenanceModal; diff --git a/src/network/Session.ts b/src/network/Session.ts index 116f7c5..a85b8ad 100644 --- a/src/network/Session.ts +++ b/src/network/Session.ts @@ -1,6 +1,5 @@ -// import io, { Socket } from "socket.io-client"; -// import msgParser from "socket.io-msgpack-parser"; -import { Socket } from "socket.io-client"; +import io, { Socket } from "socket.io-client"; +import msgParser from "socket.io-msgpack-parser"; import { EventEmitter } from "events"; import Connection, { DataProgressEvent } from "./Connection"; @@ -66,41 +65,40 @@ class Session extends EventEmitter { * Connect to the websocket */ async connect() { - this.emit("status", "offline"); - // try { - // if (!process.env.REACT_APP_ICE_SERVERS_URL) { - // return; - // } - // const response = await fetch(process.env.REACT_APP_ICE_SERVERS_URL); - // if (!response.ok) { - // throw Error("Unable to fetch ICE servers"); - // } - // const data = await response.json(); - // this._iceServers = data.iceServers; + try { + if (!process.env.REACT_APP_ICE_SERVERS_URL) { + return; + } + const response = await fetch(process.env.REACT_APP_ICE_SERVERS_URL); + if (!response.ok) { + throw Error("Unable to fetch ICE servers"); + } + const data = await response.json(); + this._iceServers = data.iceServers; - // if (!process.env.REACT_APP_BROKER_URL) { - // return; - // } - // this.socket = io(process.env.REACT_APP_BROKER_URL, { - // withCredentials: true, - // parser: msgParser, - // }); + if (!process.env.REACT_APP_BROKER_URL) { + return; + } + this.socket = io(process.env.REACT_APP_BROKER_URL, { + withCredentials: true, + parser: msgParser, + }); - // this.socket.on("player_joined", this._handlePlayerJoined.bind(this)); - // this.socket.on("player_left", this._handlePlayerLeft.bind(this)); - // this.socket.on("joined_game", this._handleJoinedGame.bind(this)); - // this.socket.on("signal", this._handleSignal.bind(this)); - // this.socket.on("auth_error", this._handleAuthError.bind(this)); - // this.socket.on("game_expired", this._handleGameExpired.bind(this)); - // this.socket.on("disconnect", this._handleSocketDisconnect.bind(this)); - // this.socket.io.on("reconnect", this._handleSocketReconnect.bind(this)); - // this.socket.on("force_update", this._handleForceUpdate.bind(this)); + this.socket.on("player_joined", this._handlePlayerJoined.bind(this)); + this.socket.on("player_left", this._handlePlayerLeft.bind(this)); + this.socket.on("joined_game", this._handleJoinedGame.bind(this)); + this.socket.on("signal", this._handleSignal.bind(this)); + this.socket.on("auth_error", this._handleAuthError.bind(this)); + this.socket.on("game_expired", this._handleGameExpired.bind(this)); + this.socket.on("disconnect", this._handleSocketDisconnect.bind(this)); + this.socket.io.on("reconnect", this._handleSocketReconnect.bind(this)); + this.socket.on("force_update", this._handleForceUpdate.bind(this)); - // this.emit("status", "ready"); - // } catch (error) { - // logError(error); - // this.emit("status", "offline"); - // } + this.emit("status", "ready"); + } catch (error) { + logError(error); + this.emit("status", "offline"); + } } disconnect() { diff --git a/src/routes/Game.tsx b/src/routes/Game.tsx index 8dde676..9d9e20e 100644 --- a/src/routes/Game.tsx +++ b/src/routes/Game.tsx @@ -29,7 +29,6 @@ import NetworkedMapAndTokens from "../network/NetworkedMapAndTokens"; import NetworkedParty from "../network/NetworkedParty"; import Session, { PeerErrorEvent, SessionStatus } from "../network/Session"; -import MaintenanceModal from "../modals/MaintenanceModal"; function Game() { const { id: gameId }: { id: string } = useParams(); @@ -39,6 +38,17 @@ function Game() { const [session] = useState(new Session()); const [sessionStatus, setSessionStatus] = useState(); + useEffect(() => { + async function connect() { + await session.connect(); + } + connect(); + + return () => { + session.disconnect(); + }; + }, [session]); + // Handle session errors const [peerError, setPeerError] = useState(null); useEffect(() => { @@ -80,8 +90,6 @@ function Game() { }; }, [session]); - const [maintenance, setMaintenance] = useState(true); - // Join game useEffect(() => { if ( @@ -98,17 +106,6 @@ function Game() { } } - useEffect(() => { - async function connect() { - await session.connect(); - } - connect(); - - return () => { - session.disconnect(); - }; - }, [session]); - // A ref to the Konva stage // the ref will be assigned in the MapInteraction component const mapStageRef = useRef(null); @@ -158,10 +155,6 @@ function Game() { - setMaintenance(false)} - /> {!sessionStatus && } {sessionStatus && databaseStatus === "upgrading" && (