Browser Calls (WebRTC)

async function callAgent(agentId) {
  // 1. Get microphone access
  const stream = await navigator.mediaDevices.getUserMedia({ audio: true });
  // 2. Create peer connection
  const pc = new RTCPeerConnection({
    iceServers: [{ urls: "stun:stun.l.google.com:19302" }],
  });
  // 3. Add audio track
  stream.getTracks().forEach((track) => pc.addTrack(track, stream));
  // 4. Handle remote audio
  const remoteAudio = new Audio();
  remoteAudio.autoplay = true;
  pc.ontrack = (event) => {
    remoteAudio.srcObject = event.streams[0];
  };
  // 5. Create and send offer
  const offer = await pc.createOffer();
  await pc.setLocalDescription(offer);
  const response = await fetch(
    `https://api.voicebip.com/v1/public/try/${agentId}/offer`,
    {
      method: "POST",
      headers: { "Content-Type": "application/json" },
      body: JSON.stringify({ sdp: offer.sdp, agent_id: agentId }),
    }
  );
  const { sdp, call_id } = await response.json();
  // 6. Set remote description
  await pc.setRemoteDescription({ type: "answer", sdp });
  // Call is now active. The agent will greet the caller via TTS.
  console.log("Call started:", call_id);
  // 7. Hang up
  return {
    hangup: () => {
      pc.close();
      stream.getTracks().forEach((track) => track.stop());
    },
    callId: call_id,
  };
}

const audioContext = new AudioContext();
const analyser = audioContext.createAnalyser();
const source = audioContext.createMediaStreamSource(stream);
source.connect(analyser);
analyser.fftSize = 256;
const dataArray = new Uint8Array(analyser.frequencyBinCount);
function draw() {
  analyser.getByteFrequencyData(dataArray);
  const average = dataArray.reduce((a, b) => a + b) / dataArray.length;
  // Use `average` to drive a visual indicator (0-255)
  requestAnimationFrame(draw);
}
draw();

const es = new EventSource(
  `https://api.voicebip.com/v1/calls/${callId}/transcript/stream?token=${apiKey}`
);
es.onmessage = (event) => {
  const data = JSON.parse(event.data);
  // Each frame: { role, text, is_final, turn_id, ts }
  // role is "user" (caller) or "agent"
  console.log(`[${data.role}] ${data.text}`);
};
// Close when done
es.close();