Merge pull request #6 from Nonhuman-Nonsense/albin

Add message before meeting is ready
Nonhuman-Nonsense · Apr 21, 2024 · 6b297ed · 6b297ed
2 parents c5c9dca + 7467f56
commit 6b297ed
Show file tree

Hide file tree

Showing 2 changed files with 40 additions and 29 deletions.
diff --git a/client/src/components/AudioOutput.jsx b/client/src/components/AudioOutput.jsx
@@ -6,10 +6,6 @@ function AudioOutput({ currentAudioMessage }) {
 
   useEffect(() => {
     if (currentAudioMessage) {
-      console.log(
-        "Creating blob with ArrayBuffer of size:",
-        currentAudioMessage.audio.byteLength
-      );
       const blob = new Blob([currentAudioMessage.audio], { type: "audio/mp3" });
       const url = URL.createObjectURL(blob);
       audioRef.current.src = url;

diff --git a/client/src/components/Output.jsx b/client/src/components/Output.jsx
@@ -9,11 +9,23 @@ function Output({ conversation, audioMessages }) {
   const [currentMessageTextSnippet, setCurrentMessageTextSnippet] =
     useState("");
   const [isPaused, setIsPaused] = useState(false);
+  const [isReadyMeeting, setIsReadyMeeting] = useState(false);
 
   useEffect(() => {
-    console.log("Audio buffers length:", audioMessages.length);
-    console.log("Current audio buffer index:", currentMessageIndex);
-  }, [audioMessages, currentMessageIndex]);
+    if (!isReadyMeeting) {
+      const currentAudioMessage = audioMessages.find(
+        (a) => a.message_index === currentMessageIndex
+      );
+
+      console.log(currentAudioMessage);
+
+      if (currentAudioMessage) {
+        console.log("Ready!");
+
+        setIsReadyMeeting(true);
+      }
+    }
+  }, [audioMessages, currentMessageIndex, isReadyMeeting]);
 
   useEffect(() => {
     if (conversation.length > 0 && !isPaused) {
@@ -29,13 +41,12 @@ function Output({ conversation, audioMessages }) {
             setCurrentSnippetIndex(0);
           }
         }, calculateDisplayTime(snippets[currentSnippetIndex]) * 1000);
-
         return () => clearTimeout(timeout); // Cleanup timeout on unmount or dependency change
       }
     }
-  }, [currentMessageIndex, currentSnippetIndex, conversation, isPaused]); // Include isPaused in dependencies
+  }, [currentMessageIndex, currentSnippetIndex, conversation, isPaused]);
 
-  const calculateDisplayTime = (text) => Math.max(3, text.length * 0.065);
+  const calculateDisplayTime = (text) => Math.max(3, text.length * 0.055);
 
   function handlePauseResume() {
     setIsPaused(!isPaused); // Toggle pause state
@@ -46,10 +57,8 @@ function Output({ conversation, audioMessages }) {
       const snippets =
         conversation[currentMessageIndex].text.split(/(?<=\.\s)/);
       if (currentSnippetIndex < snippets.length - 1) {
-        // Move to the next snippet within the same message
         setCurrentSnippetIndex(currentSnippetIndex + 1);
       } else if (currentMessageIndex < conversation.length - 1) {
-        // Move to the first snippet of the next message
         setCurrentMessageIndex(currentMessageIndex + 1);
         setCurrentSnippetIndex(0);
       }
@@ -58,23 +67,29 @@ function Output({ conversation, audioMessages }) {
 
   return (
     <div style={{ textAlign: "center", width: "75%" }}>
-      <h2>
-        Speaker:{" "}
-        {conversation.length > 0
-          ? conversation[currentMessageIndex].speaker
-          : ""}
-      </h2>
-      <TextOutput currentMessageTextSnippet={currentMessageTextSnippet} />
-      <AudioOutput
-        currentAudioMessage={audioMessages.find(
-          (a) => a.message_index == currentMessageIndex
-        )}
-      />
-      <ConversationControls
-        isPaused={isPaused}
-        onPauseResume={handlePauseResume}
-        onSkipForward={handleSkipForward}
-      />
+      {isReadyMeeting ? (
+        <>
+          <h2>
+            Speaker:{" "}
+            {conversation.length > 0
+              ? conversation[currentMessageIndex].speaker
+              : ""}
+          </h2>
+          <TextOutput currentMessageTextSnippet={currentMessageTextSnippet} />
+          <AudioOutput
+            currentAudioMessage={audioMessages.find(
+              (a) => a.message_index === currentMessageIndex
+            )}
+          />
+          <ConversationControls
+            isPaused={isPaused}
+            onPauseResume={handlePauseResume}
+            onSkipForward={handleSkipForward}
+          />
+        </>
+      ) : (
+        <h2>The council is getting ready...</h2>
+      )}
     </div>
   );
 }