WebRTC JS Call

Overview - JS Call

A Call is the representation of an audio or video call between two browsers, SIP clients or phone numbers. The call object is created whenever a new call is initiated, either by you or the remote caller. You can access and act upon calls initiated by a remote caller in a telnyx.notification event handler.

Examples

To create a new call, i.e. dial:

const call = client.newCall({
  // Destination is required and can be a phone number or SIP URI
  destinationNumber: '18004377950',
  callerNumber: '155531234567',
});

Note: After pasting the above content, Kindly check and remove any new line added

To answer an incoming call:

client.on('telnyx.notification', (notification) => {
  const call = notification.call;

  if (notification.type === 'callUpdate' && call.state === 'ringing') {
    call.answer();
  }
});

Note: After pasting the above content, Kindly check and remove any new line added

Both the outgoing and incoming call has methods that can be hooked up to your UI.

// Hangup or reject an incoming call
call.hangup();

// Send digits and keypresses
call.dtmf('1234');

// Call states that can be toggled
call.hold();
call.muteAudio();

Note: After pasting the above content, Kindly check and remove any new line added

.direction

The direction of the call. Can be either inbound or outbound.

Type: Direction

.id

The call identifier.

Type: string

.prevState

The previous state of the call. See Call.state for all possible values.

Type: string

.state

The state of the call.

VALUE	DESCRIPTION
new	New call has been created in the client.
trying	It's attempting to call someone.
requesting	The outbound call is being sent to the server.
recovering	The previous call is recovering after the page refreshes. If the user refreshes the page during a call, it will automatically join the latest call.
ringing	Someone is attempting to call you.
answering	You are attempting to answer this inbound call.
early	It receives the media before the call has been answered.
active	Call has become active.
held	Call has been held.
hangup	Call has ended.
destroy	Call has been destroyed.
purge	Call has been purged.

Type: string

.localStream

Gets the local stream of the call. This can be used in a video/audio element to play the local media. See MediaStream.

Examples

const stream = call.localStream;
document.querySelector('audio').srcObject = stream;

Note: After pasting the above content, Kindly check and remove any new line added

.remoteStream

Gets the remote stream of the call. This can be used in a video/audio element to play the remote media. See MediaStream.

Examples

const stream = call.remoteStream;
document.querySelector('audio').srcObject = stream;

Note: After pasting the above content, Kindly check and remove any new line added

.telnyxIDs

Gets Telnyx call IDs, if using Telnyx Call Control services. You can use these IDs to identify specific calls in your application code.

Examples

const { telnyxCallControlId, telnyxSessionId, telnyxLegId } = call.telnyxIDs;

Note: After pasting the above content, Kindly check and remove any new line added

.answer()

Starts the process to answer the incoming call.

Examples

call.answer()

Note: After pasting the above content, Kindly check and remove any new line added

.deaf()

Turns off the remote stream audio.

Examples

call.deaf()

Note: After pasting the above content, Kindly check and remove any new line added

.dtmf(dtmf)

Sends dual-tone multi-frequency (DTMF) signal

Parameters

NAME	TYPE	REQUIRED	DESCRIPTION
dtmf	string	required	Single DTMF key

Examples

call.dtmf('0');
call.dtmf('1');
call.dtmf('*');
call.dtmf('#');

Note: After pasting the above content, Kindly check and remove any new line added

.getStats(callback, constraints)

Registers callback for stats.

Parameters

NAME	TYPE	REQUIRED	DESCRIPTION
callback	Function	required
constraints	any	required

.hold()

Holds the call.

Examples

Using async/await:

await call.hold()
console.log(call.state) // => 'held'

Note: After pasting the above content, Kindly check and remove any new line added

Using ES6 Promises:

call.hold().then(() => {
  console.log(call.state) // => 'held'
});

Note: After pasting the above content, Kindly check and remove any new line added

.muteAudio()

Turns off audio output, i.e. makes it so other call participants cannot hear your audio.

Examples

call.muteAudio();

Note: After pasting the above content, Kindly check and remove any new line added

.muteVideo()

Turns off the video output, i.e. hides video from other call participants.

Examples

call.muteVideo();

Note: After pasting the above content, Kindly check and remove any new line added

.setAudioInDevice(deviceId)

Changes the audio input device (i.e. microphone) used for the call.

Parameters

NAME	TYPE	REQUIRED	DESCRIPTION
deviceId	string	required	the target audio input device ID

Examples

Using async/await:

await call.setAudioInDevice('abc123')

Note: After pasting the above content, Kindly check and remove any new line added

Using ES6 Promises:

call.setAudioInDevice('abc123').then(() => {
  // Do something using new audio input device
});

Note: After pasting the above content, Kindly check and remove any new line added

Usage with .getAudioInDevices:

let result = await client.getAudioInDevices();

if (result.length) {
  call.setAudioInDevice(result[1].deviceId);
}

Note: After pasting the above content, Kindly check and remove any new line added

.setAudioOutDevice(deviceId)

Changes the audio output device (i.e. speaker) used for the call.

Parameters

NAME	TYPE	REQUIRED	DESCRIPTION
deviceId	string	required	The target audio output device ID

Examples

Using async/await:

await call.setAudioOutDevice('abc123')

Note: After pasting the above content, Kindly check and remove any new line added

Using ES6 Promises:

call.setAudioOutDevice('abc123').then(() => {
  // Do something using new audio output device
});

Note: After pasting the above content, Kindly check and remove any new line added

Usage with .getAudioOutDevices:

let result = await client.getAudioOutDevices();

if (result.length) {
  await call.setAudioOutDevice(result[1].deviceId);
}

Note: After pasting the above content, Kindly check and remove any new line added

.setVideoDevice(deviceId)

Changes the video device (i.e. webcam) used for the call.

Parameters

NAME	TYPE	REQUIRED	DESCRIPTION
deviceId	string	required	the target video device ID

Examples

Using async/await:

await call.setVideoDevice('abc123')

Using ES6 Promises:

call.setVideoDevice('abc123').then(() => {
  // Do something using new video device
});

Note: After pasting the above content, Kindly check and remove any new line added

Usage with .getVideoDevices:

let result = await client.getVideoDevices();

if (result.length) {
  await call.setVideoDevice(result[1].deviceId);
}

Note: After pasting the above content, Kindly check and remove any new line added

.toggleAudioMute()

Toggles the audio output on/off.

Examples

call.toggleAudioMute();

Note: After pasting the above content, Kindly check and remove any new line added

.toggleDeaf()

Toggles the remote stream audio.

Examples

call.toggleDeaf()

Note: After pasting the above content, Kindly check and remove any new line added

.toggleHold()

Toggles hold state of the call.

Examples

Using async/await:

await call.toggleHold()
console.log(call.state) // => 'held'

await call.toggleHold()
console.log(call.state) // => 'active'

Note: After pasting the above content, Kindly check and remove any new line added

.toggleVideoMute()

Toggles the video output on/off.

Examples

call.toggleVideoMute();

Note: After pasting the above content, Kindly check and remove any new line added

.undeaf()

Turns on the remote stream audio.

Examples

call.undeaf()

Note: After pasting the above content, Kindly check and remove any new line added

.unhold()

Removes hold from the call.

Examples

Using async/await:

await call.unhold()
console.log(call.state) // => 'active'

Note: After pasting the above content, Kindly check and remove any new line added

Using ES6 Promises:

call.unhold().then(() => {
  console.log(call.state) // => 'active'
});

Note: After pasting the above content, Kindly check and remove any new line added

.unmuteAudio()

Turns on audio output, i.e. makes it so other call participants can hear your audio.

Examples

call.unmuteAudio();

Note: After pasting the above content, Kindly check and remove any new line added

.unmuteVideo()

Turns on the video output, i.e. makes video visible to other call participants.

Examples

call.unmuteVideo();

Note: After pasting the above content, Kindly check and remove any new line added