← All demos
Two-way chat
Two peers on this page each publish a canvas animation plus a WebAudio tone, and each one views the other's stream. No camera or microphone is needed. Each peer uses its own SDK instance in a shared, password-protected room.
- Click Connect on Peer 1. It starts its animation and tone and publishes them.
- Click Connect on Peer 2. The two peers find each other and each shows the other's stream.
- Change the animation, speed, tone or volume on one peer and watch and hear it on the other. Use Mute on a remote video if two tones are too much.
Peer 1
Not connected
Sending
From Peer 2
- Room
- -
- Stream ID
- -
- Viewing
- -
Peer 2
Not connected
Sending
From Peer 1
- Room
- -
- Stream ID
- -
- Viewing
- -
Key SDK calls in this demo
// Each peer runs this with its own SDK instance
const sdk = new VDONinjaSDK({ room, password });
sdk.addEventListener('track', (e) => {
if (e.detail.streams[0]) remoteVideo.srcObject = e.detail.streams[0];
});
await sdk.connect();
await sdk.joinRoom({ room, password });
// Canvas video + WebAudio tone, no camera needed
const stream = new MediaStream([
canvas.captureStream(30).getVideoTracks()[0],
toneDestination.stream.getAudioTracks()[0]
]);
await sdk.publish(stream, { streamID: myStreamID });
// One view request; if the other peer isn't publishing yet,
// the SDK connects when it shows up in the room.
sdk.view(otherStreamID, { audio: true, video: true });