diff --git a/client/src/Chat.js b/client/src/Chat.js index de309a5..819e428 100644 --- a/client/src/Chat.js +++ b/client/src/Chat.js @@ -11,7 +11,7 @@ import TextField from '@material-ui/core/TextField'; import Resource from './Resource.js'; import Dice from './Dice.js'; -const Chat = ({ table }) => { +const Chat = ({ table, game }) => { const [lastTop, setLastTop] = useState(0), [autoScroll, setAutoscroll] = useState(true), [latest, setLatest] = useState(''), @@ -76,11 +76,11 @@ const Chat = ({ table }) => { }); //const timeDelta = game.timestamp - Date.now(); - if (!table.game) { - console.log("Why no game?"); + if (!game.id) { + console.log("Why no game id?"); } - const messages = table.game && table.game.chat.map((item, index) => { + const messages = game && game.chat.map((item, index) => { const punctuation = item.message.match(/(\.+$)/); let period; if (punctuation) { @@ -130,15 +130,15 @@ const Chat = ({ table }) => { ); }); - if (table.game && table.game.chat && - table.game.chat.length && - table.game.chat[table.game.chat.length - 1].date !== latest) { - setLatest(table.game.chat[table.game.chat.length - 1].date); + if (game.chat && + game.chat.length && + game.chat[game.chat.length - 1].date !== latest) { + setLatest(game.chat[game.chat.length - 1].date); setAutoscroll(true); } - const name = table.game ? table.game.name : "Why no game?"; - const elapsed = table.game ? (table.game.timestamp - table.game.startTime) : undefined; + const name = game ? game.name : "Why no game?"; + const elapsed = game ? (game.timestamp - game.startTime) : undefined; return ( @@ -148,7 +148,7 @@ const Chat = ({ table }) => { disabled={!name} onChange={chatInput} onKeyPress={chatKeyPress} - label={elapsed && } variant="outlined"/> + label={elapsed && } variant="outlined"/> ); } diff --git a/client/src/MediaControl.js b/client/src/MediaControl.js index b3a0a6a..8b1225a 100644 --- a/client/src/MediaControl.js +++ b/client/src/MediaControl.js @@ -1,4 +1,5 @@ -import React, { useState, useEffect } from "react"; +import React, { useState, useEffect, useRef, useCallback, + useContext, createContext } from "react"; import "./MediaControl.css"; import VolumeOff from '@mui/icons-material/VolumeOff'; @@ -6,53 +7,169 @@ import VolumeUp from '@mui/icons-material/VolumeUp'; import MicOff from '@mui/icons-material/MicOff'; import Mic from '@mui/icons-material/Mic'; -const USE_AUDIO = true; -const DEFAULT_CHANNEL = 'some-global-channel-name'; -const MUTE_AUDIO_BY_DEFAULT = false; -let local_media_stream = undefined; +const MediaContext = createContext(); -const ICE_SERVERS = [ - {urls:"stun:stun.l.google.com:19302"} -]; +/* Proxy object so we can pass in srcObject to