Mute state honored on load

This commit is contained in:
James Ketr 2025-09-14 16:13:02 -07:00
parent 96d749d576
commit bef73a8af4

View File

@ -757,6 +757,18 @@ const MediaAgent = (props: MediaAgentProps) => {
); );
if (media && localUserHasMedia) { if (media && localUserHasMedia) {
media.getTracks().forEach((t) => { media.getTracks().forEach((t) => {
// Check if we should enable/disable the track based on local mute state
const localPeer = peers[session.id];
if (localPeer) {
if (t.kind === "audio") {
t.enabled = !localPeer.muted;
console.log(`media-agent - addPeer:${peer.peer_name} Audio track ${t.id} enabled: ${t.enabled} (local muted: ${localPeer.muted})`);
} else if (t.kind === "video") {
t.enabled = localPeer.video_on;
console.log(`media-agent - addPeer:${peer.peer_name} Video track ${t.id} enabled: ${t.enabled} (local video_on: ${localPeer.video_on})`);
}
}
console.log(`media-agent - addPeer:${peer.peer_name} Adding track:`, { console.log(`media-agent - addPeer:${peer.peer_name} Adding track:`, {
kind: t.kind, kind: t.kind,
enabled: t.enabled, enabled: t.enabled,
@ -815,7 +827,7 @@ const MediaAgent = (props: MediaAgentProps) => {
} }
} }
}, },
[peers, setPeers, media, sendJsonMessage, updatePeerConnectionState, session?.has_media] [peers, setPeers, media, sendJsonMessage, updatePeerConnectionState, session?.has_media, session?.id]
); );
// Process queued peers when media becomes available // Process queued peers when media becomes available
@ -1130,6 +1142,18 @@ const MediaAgent = (props: MediaAgentProps) => {
// Add or update current local peer // Add or update current local peer
if (!updated[session.id]) { if (!updated[session.id]) {
// Disable tracks based on initial muted state before assigning to peer
if (media) {
media.getAudioTracks().forEach(track => {
track.enabled = false; // Start muted
console.log(`media-agent - Local audio track ${track.id} disabled (initial state)`);
});
media.getVideoTracks().forEach(track => {
track.enabled = false; // Start with video off
console.log(`media-agent - Local video track ${track.id} disabled (initial state)`);
});
}
updated[session.id] = { updated[session.id] = {
peer_name: session.name || "Unknown", peer_name: session.name || "Unknown",
session_id: session.id, session_id: session.id,
@ -1142,7 +1166,7 @@ const MediaAgent = (props: MediaAgentProps) => {
}, },
dead: false, dead: false,
}; };
console.log(`media-agent - Added local peer to peers list`); console.log(`media-agent - Added local peer to peers list with tracks disabled`);
} }
return updated; return updated;
@ -1315,7 +1339,9 @@ const MediaControl: React.FC<MediaControlProps> = ({ isSelf, peer, className })
const [isDragging, setIsDragging] = useState<boolean>(false); const [isDragging, setIsDragging] = useState<boolean>(false);
useEffect(() => { useEffect(() => {
console.log(`media-agent - MediaControl mounted for peer ${peer?.peer_name}, local=${peer?.local}, hasSrcObject=${!!peer?.attributes?.srcObject}`);
if (!peer) return; if (!peer) return;
console.log(`media-agent - MediaControl peer changed for ${peer.peer_name}, updating state`);
setMuted(peer.muted); setMuted(peer.muted);
setVideoOn(peer.video_on); setVideoOn(peer.video_on);
}, [peer]); }, [peer]);
@ -1408,26 +1434,33 @@ const MediaControl: React.FC<MediaControlProps> = ({ isSelf, peer, className })
}, [peer, peer.attributes?.srcObject, peer.connection]); }, [peer, peer.attributes?.srcObject, peer.connection]);
useEffect(() => { useEffect(() => {
if (!peer || peer.dead || !peer.attributes?.srcObject) return; if (!peer || peer.dead || !peer.attributes?.srcObject) {
console.log(`media-agent - Audio track control: skipping for ${peer?.peer_name} (dead=${peer?.dead}, hasSrcObject=${!!peer?.attributes?.srcObject})`);
return;
}
console.log(`media-agent - Audio track control useEffect running for ${peer.peer_name}, muted=${muted}`);
const stream = peer.attributes.srcObject as MediaStream; const stream = peer.attributes.srcObject as MediaStream;
stream.getAudioTracks().forEach((t) => { stream.getAudioTracks().forEach((t) => {
t.enabled = !muted; const shouldEnable = !muted;
console.log(`media-agent - Audio track ${t.id} enabled: ${t.enabled}`); console.log(`media-agent - Setting audio track ${t.id} enabled: ${shouldEnable} (was ${t.enabled})`);
t.enabled = shouldEnable;
}); });
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [muted, peer?.attributes?.srcObject, peer?.dead]); }, [muted, peer?.attributes?.srcObject, peer?.dead, peer]);
useEffect(() => { useEffect(() => {
if (!peer || peer.dead || !peer.attributes?.srcObject) return; if (!peer || peer.dead || !peer.attributes?.srcObject) return;
console.log(`media-agent - Video track control useEffect running for ${peer.peer_name}, videoOn=${videoOn}`);
const stream = peer.attributes.srcObject as MediaStream; const stream = peer.attributes.srcObject as MediaStream;
stream.getVideoTracks().forEach((t) => { stream.getVideoTracks().forEach((t) => {
t.enabled = videoOn; const shouldEnable = videoOn;
console.log(`media-agent - Video track ${t.id} enabled: ${t.enabled}`); console.log(`media-agent - Setting video track ${t.id} enabled: ${shouldEnable} (was ${t.enabled})`);
t.enabled = shouldEnable;
}); });
// eslint-disable-next-line react-hooks/exhaustive-deps // eslint-disable-next-line react-hooks/exhaustive-deps
}, [videoOn, peer?.attributes?.srcObject, peer?.dead]); }, [videoOn, peer?.attributes?.srcObject, peer?.dead, peer]);
// Debug target element // Debug target element
useEffect(() => { useEffect(() => {