diff --git a/client/src/embodied/CommandEntry.css b/client/src/embodied/CommandEntry.css index 6aa7cac0..22f2ef94 100644 --- a/client/src/embodied/CommandEntry.css +++ b/client/src/embodied/CommandEntry.css @@ -3,19 +3,27 @@ margin-bottom: 2rem; margin-left: auto; margin-right: auto; - background: lightblue; + padding: 0; + background: lightgreen; position: fixed; bottom: 0; left: 20%; right: 20%; - + border-radius: 1rem; +} +.commandline form { + display: flex; + flex-direction: row; + width: 100%; } .commandline input { + flex: 10; font-size: 16pt; border: none; - padding: 1rem; - width: calc(100% - 2rem); - margin-left: 0; - margin-right: 0; + padding: 2rem; + background: transparent; +} + +.commandline button { } \ No newline at end of file diff --git a/client/src/embodied/CommandEntry.jsx b/client/src/embodied/CommandEntry.jsx index 0ce2e322..84d536d4 100644 --- a/client/src/embodied/CommandEntry.jsx +++ b/client/src/embodied/CommandEntry.jsx @@ -1,10 +1,16 @@ +import { useForm } from "react-hook-form"; + import './CommandEntry.css'; -function CommandEntry({command, onChange, onSubmit, ...props}) { +function CommandEntry({ onSubmit }) { + const { register, handleSubmit, setValue } = useForm(); + return (
- - +
{ setValue('command', ""); onSubmit(data.command); })}> + + +
); } diff --git a/client/src/embodied/Live.jsx b/client/src/embodied/Live.jsx index 8fe1f233..50c69dda 100644 --- a/client/src/embodied/Live.jsx +++ b/client/src/embodied/Live.jsx @@ -14,24 +14,27 @@ import CommandEntry from './CommandEntry.jsx'; function Live({editing, ...props}) { const navigate = useNavigate(); const loggedIn = useLoggedIn(); - const { pagenumber } = useParams(); - const [command, setCommand] = useState(""); + const [ messageHistory, setMessageHistory ] = useState([]); const [ currentNumber, setCurrentNumber ] = useState(1); - const [ connecting, setConnecting ] = useState(true); + const { sendMessage, lastMessage, readyState } = useWebSocket(`${wsUrl}/embody`, { onClose: () => setConnecting(false) }, connecting); useEffect(() => { if (lastMessage !== null) { + console.log(lastMessage); setMessageHistory((prev) => prev.concat(lastMessage)); + + if (lastMessage.data.startsWith("location change to: ")) { + const num = Number(lastMessage.data.replace("location change to: #", "")); + setCurrentNumber(num); + } } }, [lastMessage]); - useEffect(() => { sendMessage("what the fuk is up"); }, []); - function handleSendMessage() { console.log("sending a message..."); sendMessage("button got clicked"); @@ -43,16 +46,14 @@ function Live({editing, ...props}) { + -