From 70c099c4b54ff956300e8e862a1bde04a724b5ab Mon Sep 17 00:00:00 2001
From: David Baker <dave@matrix.org>
Date: Fri, 29 Apr 2022 18:56:17 +0100
Subject: [PATCH] Wire up pressing the PTT button to unmute as well as spacebar

---
 src/room/PTTButton.jsx   |  4 ++++
 src/room/PTTCallView.jsx |  4 ++++
 src/room/usePTT.js       | 34 ++++++++++++++++++++++------------
 3 files changed, 30 insertions(+), 12 deletions(-)

diff --git a/src/room/PTTButton.jsx b/src/room/PTTButton.jsx
index 1e0ba2fd..6da9b863 100644
--- a/src/room/PTTButton.jsx
+++ b/src/room/PTTButton.jsx
@@ -11,6 +11,8 @@ export function PTTButton({
   activeSpeakerAvatarUrl,
   activeSpeakerIsLocalUser,
   size,
+  startTalking,
+  stopTalking,
 }) {
   return (
     <button
@@ -18,6 +20,8 @@ export function PTTButton({
         [styles.talking]: activeSpeakerUserId,
         [styles.error]: showTalkOverError,
       })}
+      onMouseDown={startTalking}
+      onMouseUp={stopTalking}
     >
       {activeSpeakerIsLocalUser || !activeSpeakerUserId ? (
         <MicIcon
diff --git a/src/room/PTTCallView.jsx b/src/room/PTTCallView.jsx
index 55187e08..6993ec9e 100644
--- a/src/room/PTTCallView.jsx
+++ b/src/room/PTTCallView.jsx
@@ -45,6 +45,8 @@ export function PTTCallView({
     talkOverEnabled,
     setTalkOverEnabled,
     activeSpeakerUserId,
+    startTalking,
+    stopTalking,
   } = usePTT(client, groupCall, userMediaFeeds);
 
   const activeSpeakerIsLocalUser =
@@ -115,6 +117,8 @@ export function PTTCallView({
             activeSpeakerAvatarUrl={activeSpeakerAvatarUrl}
             activeSpeakerIsLocalUser={activeSpeakerIsLocalUser}
             size={pttButtonSize}
+            startTalking={startTalking}
+            stopTalking={stopTalking}
           />
           <p className={styles.actionTip}>
             {showTalkOverError
diff --git a/src/room/usePTT.js b/src/room/usePTT.js
index 5ba91ea7..89a1bcf9 100644
--- a/src/room/usePTT.js
+++ b/src/room/usePTT.js
@@ -47,18 +47,30 @@ export function usePTT(client, groupCall, userMediaFeeds) {
     };
   }, [userMediaFeeds]);
 
+  const startTalking = useCallback(() => {
+    if (!activeSpeakerUserId || isAdmin || talkOverEnabled) {
+      if (groupCall.isMicrophoneMuted()) {
+        groupCall.setMicrophoneMuted(false);
+      }
+
+      setState((prevState) => ({ ...prevState, pttButtonHeld: true }));
+    }
+  }, []);
+
+  const stopTalking = useCallback(() => {
+    if (!groupCall.isMicrophoneMuted()) {
+      groupCall.setMicrophoneMuted(true);
+    }
+
+    setState((prevState) => ({ ...prevState, pttButtonHeld: false }));
+  }, []);
+
   useEffect(() => {
     function onKeyDown(event) {
       if (event.code === "Space") {
         event.preventDefault();
 
-        if (!activeSpeakerUserId || isAdmin || talkOverEnabled) {
-          if (groupCall.isMicrophoneMuted()) {
-            groupCall.setMicrophoneMuted(false);
-          }
-
-          setState((prevState) => ({ ...prevState, pttButtonHeld: true }));
-        }
+        startTalking();
       }
     }
 
@@ -66,11 +78,7 @@ export function usePTT(client, groupCall, userMediaFeeds) {
       if (event.code === "Space") {
         event.preventDefault();
 
-        if (!groupCall.isMicrophoneMuted()) {
-          groupCall.setMicrophoneMuted(true);
-        }
-
-        setState((prevState) => ({ ...prevState, pttButtonHeld: false }));
+        stopTalking();
       }
     }
 
@@ -107,5 +115,7 @@ export function usePTT(client, groupCall, userMediaFeeds) {
     talkOverEnabled,
     setTalkOverEnabled,
     activeSpeakerUserId,
+    startTalking,
+    stopTalking,
   };
 }