Skip to main content

Implementation Examples

We provide reference implementations demonstrating different integration patterns:

Basic Implementation​

Minimal setup with essential call functionality:

View Basic Example

  • Call and hang up buttons
  • Status display
  • Device selection
  • Mute functionality

Advanced Implementation​

Full-featured implementation with conversation history:

View Advanced Example

  • Real-time conversation transcript
  • RAG document display
  • Audio waveform visualization
  • Complete device management

Common Implementation Patterns​

Mute Button Implementation​

<button id="muteButton">Mute</button>

<script>
let isMuted = false;
const muteButton = document.getElementById('muteButton');

muteButton.onclick = () => {
    isMuted = !isMuted;
    callManager.mute(isMuted);
    muteButton.textContent = isMuted ? 'Unmute' : 'Mute';
    muteButton.classList.toggle('muted', isMuted);
};
</script>

Device Selector Implementation​

<select id="microphoneSelect">
    <option value="">Loading microphones...</option>
</select>

<script>
async function setupDeviceSelector() {
    const devices = await CallManager.getAvailableDevices();
    const select = document.getElementById('microphoneSelect');
    
    select.innerHTML = '';
    devices.microphones.forEach(mic => {
        const option = document.createElement('option');
        option.value = mic.deviceId;
        option.textContent = mic.label;
        select.appendChild(option);
    });
    
    select.onchange = async (e) => {
        await callManager.changeDevices(e.target.value, null);
    };
}
</script>

Testing with URL Parameters​

Our examples support URL parameters for easy testing:

sdk_test.html?partner=github:partner&character=character&apiKey=YOUR_API_KEY