diff --git a/.vscode/launch.json b/.vscode/launch.json new file mode 100644 index 0000000..4b1147d --- /dev/null +++ b/.vscode/launch.json @@ -0,0 +1,15 @@ +{ + // Use IntelliSense to learn about possible attributes. + // Hover to view descriptions of existing attributes. + // For more information, visit: https://go.microsoft.com/fwlink/?linkid=830387 + "version": "0.2.0", + "configurations": [ + { + "type": "chrome", + "request": "launch", + "name": "Launch Chrome against localhost", + "url": "http://localhost:3000", + "webRoot": "${workspaceFolder}" + } + ] +} diff --git a/client/src/components/Council.jsx b/client/src/components/Council.jsx index fd4d278..796ad5a 100644 --- a/client/src/components/Council.jsx +++ b/client/src/components/Council.jsx @@ -9,7 +9,7 @@ import Contact from "./Contact"; import Share from "./Share"; import ResetWarning from "./ResetWarning"; import Navbar from "./Navbar"; -import TextOutput from "./TextOutput"; +import Output from "./Output"; import useWindowSize from "../hooks/useWindowSize"; function Council({ options }) { @@ -108,7 +108,7 @@ function Council({ options }) { className="text-container" style={{ justifyContent: "end" }} > - + )}
diff --git a/client/src/components/TextOutput.jsx b/client/src/components/TextOutput.jsx index 27e7d3d..e43b49c 100644 --- a/client/src/components/TextOutput.jsx +++ b/client/src/components/TextOutput.jsx @@ -1,58 +1,13 @@ -import React, { useState, useEffect } from "react"; +import React from "react"; -function TextOutput({ conversation }) { - const [currentMessageIndex, setCurrentMessageIndex] = useState(0); - const [currentSnippetIndex, setCurrentSnippetIndex] = useState(0); - const [currentMessageTextSnippet, setCurrentMessageTextSnippet] = - useState(""); - const [initialize, setInitialize] = useState(true); // Flag to control initialization +function TextOutput({ currentMessageTextSnippet }) { const textOutputStyle = { fontFamily: "Arial, sans-serif", backgroundColor: "rgba(0,0,0,0.7)", }; - // Function to calculate the display time based on text length - const calculateDisplayTime = (text) => Math.max(3, text.length * 0.05); - - useEffect(() => { - if (initialize && conversation.length > 0) { - setCurrentMessageIndex(0); - setCurrentSnippetIndex(0); - setInitialize(false); // Reset initialization flag after first setup - } - }, [conversation, initialize]); - - useEffect(() => { - const processSnippets = () => { - if (conversation.length > currentMessageIndex) { - const snippets = - conversation[currentMessageIndex].text.split(/(?<=\.\s)/); - if (snippets.length > currentSnippetIndex) { - setCurrentMessageTextSnippet(snippets[currentSnippetIndex]); - const timeout = setTimeout(() => { - if (currentSnippetIndex < snippets.length - 1) { - setCurrentSnippetIndex(currentSnippetIndex + 1); - } else if (currentMessageIndex < conversation.length - 1) { - setCurrentMessageIndex(currentMessageIndex + 1); - setCurrentSnippetIndex(0); - } - }, calculateDisplayTime(snippets[currentSnippetIndex]) * 1000); - return () => clearTimeout(timeout); - } - } - }; - - processSnippets(); - }, [currentMessageIndex, currentSnippetIndex, conversation]); - return (
-

- Speaking:{" "} - {conversation.length > 0 - ? conversation[currentMessageIndex].speaker - : ""} -

{currentMessageTextSnippet || ""}

);