Update public/script.js

public/script.js

@@ -9,14 +9,12 @@ const audioContainer = document.getElementById('audio-container');
 let localStream;
 const peers = {}; // Store connections to other users
 
-// WebRTC Configuration using free Google STUN servers
-// WebRTC Configuration using Google STUN and a free public TURN server
+// --- WebRTC Configuration ---
+// Includes Google STUN servers and the Metered.ca public TURN fallback
 const rtcConfig = {
     iceServers: [
-        // STUN helps find your public IP
         { urls: 'stun:stun.l.google.com:19302' },
-        
-        // TURN relays the audio when firewalls block direct connections
+        { urls: 'stun:stun1.l.google.com:19302' }, // Backup STUN
         {
             urls: 'turn:openrelay.metered.ca:80',
             username: 'openrelayproject',
@@ -80,7 +78,7 @@ joinBtn.onclick = async () => {
 socket.on('user-connected', (userId) => {
     if (!localStream) return; // Don't call if we aren't in the audio room
     
-    appendSystemMessage(`User ${userId.substring(0,4)} joined.`);
+    appendSystemMessage(`User ${userId.substring(0,4)} joined. Attempting connection...`);
     const peer = createPeerConnection(userId, true);
     peers[userId] = peer;
 });
@@ -98,15 +96,19 @@ socket.on('signal', async (data) => {
 
     const peer = peers[from];
 
-    if (signal.type === 'offer') {
-        await peer.setRemoteDescription(new RTCSessionDescription(signal));
-        const answer = await peer.createAnswer();
-        await peer.setLocalDescription(answer);
-        socket.emit('signal', { to: from, signal: peer.localDescription });
-    } else if (signal.type === 'answer') {
-        await peer.setRemoteDescription(new RTCSessionDescription(signal));
-    } else if (signal.candidate) {
-        await peer.addIceCandidate(new RTCIceCandidate(signal));
+    try {
+        if (signal.type === 'offer') {
+            await peer.setRemoteDescription(new RTCSessionDescription(signal));
+            const answer = await peer.createAnswer();
+            await peer.setLocalDescription(answer);
+            socket.emit('signal', { to: from, signal: peer.localDescription });
+        } else if (signal.type === 'answer') {
+            await peer.setRemoteDescription(new RTCSessionDescription(signal));
+        } else if (signal.candidate) {
+            await peer.addIceCandidate(new RTCIceCandidate(signal));
+        }
+    } catch (err) {
+        console.error("Signaling error:", err);
     }
 });
 
@@ -138,6 +140,18 @@ function createPeerConnection(targetUserId, isInitiator) {
         }
     };
 
+    // TRACK THE CONNECTION STATUS (Crucial for debugging NAT/Firewall issues)
+    peer.oniceconnectionstatechange = () => {
+        console.log(`Connection state with ${targetUserId}:`, peer.iceConnectionState);
+        if (peer.iceConnectionState === 'failed') {
+            appendSystemMessage(`❌ Connection to ${targetUserId.substring(0,4)} failed. Firewalls blocked it.`);
+        } else if (peer.iceConnectionState === 'connected') {
+            appendSystemMessage(`✅ Successfully connected to ${targetUserId.substring(0,4)}! Audio flowing.`);
+        } else if (peer.iceConnectionState === 'disconnected') {
+            appendSystemMessage(`⚠️ Connection to ${targetUserId.substring(0,4)} lost. Trying to reconnect...`);
+        }
+    };
+
     // When we receive their audio stream, play it
     peer.ontrack = (event) => {
         let audioEl = document.getElementById(`audio-${targetUserId}`);