Skip to content

WebrtcCall

Jump to bottom
Adnan Mujagić edited this page Aug 25, 2025 · 18 revisions

extends Call



options()

Description

Returns the call options this call was started with.

Arguments

  • none

Returns

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice', WebrtcCallOptions.builder().build());
console.log(`Call options: ${JSON.stringify(webrtcCall.options())}`);



pauseIncomingVideo()

Description

Stop receiving the video media of the remote participant.

Arguments

  • none

Returns

  • N/A

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice');
webrtcCall.on(CallsApiEvent.ESTABLISHED, _ => {
    document.addEventListener('visibilitychange', () => {
        if (document.visibilityState !== 'visible') {
            console.log('Browser lost focus, stop showing remote video media.');
            webrtcCall.pauseIncomingVideo()
                .catch(error => console.log(`Error: ${error}`));
        }
    });
});



resumeIncomingVideo()

Description

Start receiving the video media of the remote participant.

Arguments

  • none

Returns

  • N/A

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice');
webrtcCall.on(CallsApiEvent.ESTABLISHED, _ => {
    document.addEventListener('visibilitychange', () => {
        if (document.visibilityState === 'visible') {
            console.log('Browser got focus back, start showing remote video media again.');
            webrtcCall.resumeIncomingVideo()
                .catch(error => console.log(`Error: ${error}`));
        }
    });
});



cameraVideo(cameraVideo)

Description

Controls whether the local camera video should be enabled. For video calls it is enabled by default.

Arguments

  • cameraVideo: boolean - Whether local camera video should be enabled.

Returns

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice');
webrtcCall.on(CallsApiEvent.ESTABLISHED, _ => {
    webrtcCall.cameraVideo(true)
        .catch(error => console.log(`Error: ${error}`));
});



hasCameraVideo()

Description

Returns information whether the current call has local camera video.

Arguments

  • none

Returns

  • boolean - true if the call has local camera video, otherwise false.

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCallOptions = WebrtcCallOptions.builder().setVideo(true).build();
let webrtcCall = infobipRTC.callWebrtc('alice', webrtcCallOptions);
let callType = webrtcCall.hasCameraVideo() ? 'video' : 'audio';
console.log(`Making ${callType} WebRTC call.`);



hasRemoteCameraVideo()

Description

Returns information whether the current call has remote video.

Arguments

  • none

Returns

  • boolean - true if the call has remote video, otherwise false.

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice');
webrtcCall.on(CallsApiEvent.ESTABLISHED, _ => {
    let remoteVideo = webrtcCall.hasRemoteCameraVideo() ? 'has camera video' : 'doesn\'t have camera video';
    console.log(`Remote user ${remoteVideo}.`);
});



screenShare(screenShare)

Please note that this method is being deprecated. Instead, You can use the startScreenShare and stopScreenShare methods.

Description

Toggles sharing the screen during the call.

This method is not available in mobile versions of browsers.

Arguments

  • screenShare: boolean - Controls whether the screen sharing should be started or stopped.

Returns

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice');
webrtcCall.on('established', _ => {
    webrtcCall.screenShare(true)
        .catch(error => console.log(`Error: ${error}`));
});
webrtcCall.on('screen-share-added', _ => {
    console.log('Started sharing screen');
})



startScreenShare(displayOptions)

Description

Starts sharing the screen during the call and optionally provides the ability to control surfaces which can be shared.

After one participant in the call starts sharing their screen, the screen-share-added event will be triggered on their side, and remote-screen-share-added event will be triggered on the remote side.

This method is not available in mobile versions of browsers.

Arguments

  • displayOptions: DisplayOptions - Optional argument which provides control over surfaces that can be shared during the call. If not provided, no restrictions on display surfaces that can be shared are set.

Returns

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice');
let displayOptions: DisplayOptions = {allowedDisplayOptions: ['window', 'monitor']}
webrtcCall.on('established', _ => {
    webrtcCall.startScreenShare(displayOptions)
        .catch(error => console.log(`Error: ${error}`));
});
webrtcCall.on('screen-share-added', _ => {
    console.log('Started sharing screen');
})



stopScreenShare()

Description

Stops sharing the screen during the call.

After one participant in the call stops sharing their screen, the screen-share-removed event will be triggered on their side, and remote-screen-share-removed event will be triggered on the remote side.

This method is not available in mobile versions of browsers.

Additionally, screenshare control is not available on all web browsers. Before attempting to use this feature, please consult the browser compatibility table.

Arguments

  • none

Returns

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice');
webrtcCall.on('screen-share-added', _ => {
    webrtcCall.stopScreenShare()
        .catch(error => console.log(`Error: ${error}`));
});
webrtcCall.on('screen-share-removed', _ => {
    console.log('Stopped sharing screen');
})



hasScreenShare()

Description

Returns information whether screen is being shared with remote peer.

Arguments

  • none

Returns

  • boolean - true if screen is being shared, otherwise false.

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice');
webrtcCall.on('established', _ => {
    webrtcCall.screenShare(true)
        .catch(error => console.log(`Error: ${error}`));
});
webrtcCall.on('screen-share-added', _ => {
    if (webrtcCall.hasScreenShare()) {
        console.log('Sharing screen...');
    }
})



hasRemoteScreenShare()

Description

Returns information whether the remote user is sharing their screen.

Arguments

  • none

Returns

  • boolean - true if screen is being shared, otherwise false.

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice');
webrtcCall.on('remote-screen-share-added', _ => {
    if (webrtcCall.hasRemoteScreenShare()) {
        console.log('Remote user sharing screen...');
    }
})



setVideoInputDevice(deviceId)

Description

Sets the video input device with the given id to be used during the call.

Arguments

  • deviceId: string - Video input device identifier.

Returns

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice', WebrtcCallOptions.Builder.setVideo(true).build());
webrtcCall.on('established', _ => {
    webrtcCall.setVideoInputDevice('videoDeviceId')
        .catch(error => console.log(`Error: ${error}`));
});



cameraOrientation()

Description

Returns current camera orientation.

Arguments

  • none

Returns

Example

let videoOptions = VideoOptions.builder().setCameraOrientation(CameraOrientation.BACK).build();
let webrtcCallOptions = WebrtcCallOptions.builder().setVideo(true).setVideoOptions(videoOptions).build();
let webrtcCall = infobipRTC.callWebrtc('alice', webrtcCallOptions);
console.log(`Camera orientation is: ${webrtcCall.cameraOrientation()}`);



setCameraOrientation(cameraOrientation)

Description

Sets a local camera orientation to the given enum value.

Arguments

Returns

Example

let webrtcCall = infobipRTC.callWebrtc('alice', WebrtcCallOptions.builder().setVideo(true).build());
webrtcCall.on('established', _ => {
    webrtcCall.setCameraOrientation(CameraOrientation.BACK)
        .catch(error => console.log(`Error: ${error}`));
});



setVideoFilter(videoFilter)

Description

Sets the video filter to be used during the video call. Passing null will remove and release any already existing video filter.

Arguments

  • videoFilter: VideoFilter - An object instance which implements the VideoFilter interface.

Returns

  • Promise<void> - Promise that resolves once the filter has been applied to the current video stream.

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice', WebrtcCallOptions.builder().setVideo(true).build());
let videoFilter = createVideoFilterImplementation();
webrtcCall.setVideoFilter(videoFilter);



videoFilter()

Description

Gets the video filter that has been set for the video call.

Arguments

  • none

Returns

  • VideoFilter - An object instance which implements the VideoFilter interface.

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice', WebrtcCallOptions.builder().setVideo(true).build());
let videoFilter = createVideoFilterImplementation();
webrtcCall.setVideoFilter(videoFilter);
let currentVideoFilter = webrtcCall.videoFilter();



clearVideoFilter()

Description

Convenience method that is used to remove the video filter if it is present.

Arguments

  • none

Returns

  • Promise<void> - Promise that resolves once the filter has been removed.

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice', WebrtcCallOptions.builder().setVideo(true).build());
let videoFilter = createVideoFilterImplementation();
webrtcCall.setVideoFilter(videoFilter);

webrtcCall.clearVideoFilter();



localCapturer()

Description

Gets an instance of LocalWebrtcCapturer, which can be used to take screenshots of current user's or remote's videos.

Arguments

  • none

Returns

  • LocalWebrtcCapturer - Returns an instance of a capturer used for storing screenshots locally.

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice', WebrtcCallOptions.builder().setVideo(true).build());
let videoType = VideoType.CAMERA;

// we take a screenshot of the current user's camera, and download it to the local machine as a `.png` file
webrtcCall.localCapturer().takeLocalScreenshot(videoType)
    .then(url => {
        const link = document.createElement('a');
        link.download = `local_${videoType.toString().toLowerCase()}.png`;
        link.href = url;
        link.click();
        link.remove();
    });



serverCapturer()

Description

Gets an instance of ServerCapturer, which is used to upload screenshots of current user's or remote's videos to the cloud. These screenshots can subsequently be retrieved using the WebRTC Files API.

Arguments

  • none

Returns

  • ServerCapturer - Returns an instance of a capturer used to upload screenshots to the cloud.

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice', WebrtcCallOptions.builder().setVideo(true).build());
let videoType = VideoType.SCREENSHARE;

// take a screenshot of the remote user's screen share, which is directly uploaded to the server (cloud)
webrtcCall.serverlCapturer().takeRemoteScreenshot(videoType)
    .then(fileResponse => {
        console.log(`Screenshot uploaded to the server with id: ${fileResponse.id}, and name: ${fileResponse.name}`);
    }).catch(err => {
        console.log('There was an error uploading a screenshot to the server!');
    });



dataChannel()

Description

Gets an instance of DataChannel, that should be used to send and receive data during the current call.

Arguments

  • none

Returns

Example

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice', WebrtcCallOptions.builder().setDataChannel(true).build());

webrtcCall.dataChannel().send('Hello world!', webrtcCall.counterpart())
    .then(id => {
        console.log(`Sent text with id: ${id} to ${webrtcCall.counterpart().identifier}`)
    });



on(eventName, eventHandler)

Description

Configures the event handler for call events.

Arguments

  • eventName: CallsApiEvent - Name of the application call event. Allowed values are a subset of CallsApiEvent.

  • eventHandler: CallsEventHandlers - Function that will be called when specified event occurs, with exactly one parameter being passed to the function containing event information. Depending on the event, the passed parameter will contain a set of fields that will describe the event, namely:

    • RINGING - No additional data is provided in the event object.

      event = {}

    • EARLY_MEDIA - A MediaStream object representing the media being played is received in the event object.

      event = { stream: MediaStream }

    • ESTABLISHED - A MediaStream object representing the media in the call is received in the event object.

      event = { stream: MediaStream }

    • HANGUP - A received ErrorCode object provides details about the reason for the call hang-up, along with a TotalMediaStats object that offers a comprehensive summary of the call's audio statistics.

      event = { errorCode: ErrorCode, totalMediaStats: TotalMediaStats }

    • ERROR - A received ErrorCode object provides details about the reason for the error occurrence.

      event = { errorCode: ErrorCode }

    • CAMERA_VIDEO_ADDED - A MediaStream object representing the media in the call is received in the event object.

      event = { stream: MediaStream }

    • CAMERA_VIDEO_UPDATED - A MediaStream object representing the media in the call is received in the event object.

      event = { stream: MediaStream }

    • CAMERA_VIDEO_REMOVED - No additional data is provided in the event object.

      event = {}

    • SCREEN_SHARE_ADDED - A MediaStream object representing the media in the call is received in the event object.

      event = { stream: MediaStream }

    • SCREEN_SHARE_REMOVED - A VideoRemovalReason enum value giving additional info on the reason for removing the screen share.

      event = { reason: VideoRemovalReason }

    • REMOTE_MUTED - No additional data is provided in the event object.

      event = {}

    • REMOTE_UNMUTED - No additional data is provided in the event object.

      event = {}

    • TALKING_WHILE_MUTED - No additional data is provided in the event object.

      event = {}

    • REMOTE_DISCONNECTED - No additional data is provided in the event object.

      event = {}

    • REMOTE_RECONNECTED - No additional data is provided in the event object.

      event = {}

    • REMOTE_CAMERA_VIDEO_ADDED - A MediaStream object representing the remote user's camera video stream.

      event = { stream: MediaStream }

    • REMOTE_CAMERA_VIDEO_REMOVED - No additional data is provided in the event object.

      event = {}

    • REMOTE_SCREEN_SHARE_ADDED - A MediaStream object representing the remote user's screen share stream.

      event = { stream: MediaStream }

    • REMOTE_SCREEN_SHARE_REMOVED - No additional data is provided in the event object.

      event = {}

    • NETWORK_QUALITY_CHANGED - An event containing a NetworkQuality and a CurrentMediaStats objects that provides details on the network quality of a local participant and its corresponding media stats.

      event = { networkQuality: NetworkQuality, currentMediaStats: CurrentMediaStats }

    • REMOTE_NETWORK_QUALITY_CHANGED - An event containing a NetworkQuality object that provides details on the network quality of a remote participant

      event = { networkQuality: NetworkQuality }

    • CALL_RECORDING_STARTED - An event that is triggered once a call recording starts. It includes RecordingType enum value which corresponds to the type of recording initiated.

      event = { recordingType: RecordingType }

    • RECONNECTING - No additional data is provided in the event object.

      event = {}

    • RECONNECTED - No additional data is provided in the event object.

      event = {}

Returns

  • N/A

Example

Let's assume you have an audio HTML element with the id callAudio and video HTML elements with the ids cameraVideo, remoteCameraVideo, screenShareVideo, and remoteScreenShareVideo.

let infobipRTC = createInfobipRtc('2e29c3a0-730a-4526-93ce-cda44556dab5', {debug: true});
let webrtcCall = infobipRTC.callWebrtc('alice', WebrtcCallOptions.builder()
        .setAutoReconnect(true) // Required in order to receive RECONNECTING and RECONNECTED events
        .build());

webrtcCall.on(CallsApiEvent.RINGING, () => {
    console.log('Ringing...');
});

webrtcCall.on(CallsApiEvent.EARLY_MEDIA, (event) => {
    console.log('Ringtone playing...');
    $('#callAudio').srcObject = event.stream;
});

webrtcCall.on(CallsApiEvent.ESTABLISHED, (event) => {
    $('#callAudio').srcObject = event.stream;
});

webrtcCall.on(CallsApiEvent.HANGUP, (event) => {
    console.log(`Call finished. Status: ${event.errorCode.name}`);
});

webrtcCall.on(CallsApiEvent.ERROR, (event) => {
    console.log(`An error has occurred. Error: ${event.errorCode.name}`);
});

webrtcCall.on(CallsApiEvent.CAMERA_VIDEO_ADDED, (event) => {
    $('#cameraVideo').srcObject = event.stream;
});

webrtcCall.on(CallsApiEvent.REMOTE_CAMERA_VIDEO_ADDED, (event) => {
    $('#remoteCameraVideo').srcObject = event.stream;
});

webrtcCall.on(CallsApiEvent.REMOTE_DISCONNECTED, (event) => {
  console.log('Remote user has been disconnected!');
});

webrtcCall.on(CallsApiEvent.REMOTE_RECONNECTED, (event) => {
  console.log('Remote user has been reconnected!');
});

webrtcCall.on(CallsApiEvent.DISCONNECTED, (event) => {
  console.log('Call disconnected!');
});

webrtcCall.on(CallsApiEvent.RECONNECTED, (event) => {
  console.log('Call reconnected!');
});

webrtcCall.on(CallsApiEvent.SCREEN_SHARE_ADDED, (event) => {
    $('#screenShareVideo').srcObject = event.stream;
});

webrtcCall.on(CallsApiEvent.REMOTE_SCREEN_SHARE_ADDED, (event) => {
    $('#remoteScreenShareVideo').srcObject = event.stream;
});

webrtcCall.on(CallsApiEvent.REMOTE_MUTED, (event) => {
    console.log(`Remote user is muted`);
});

webrtcCall.on(CallsApiEvent.REMOTE_UNMUTED, (event) => {
    console.log(`Remote user is unmuted`);
});

webrtcCall.on(CallsApiEvent.TALKING_WHILE_MUTED, (event) => {
    console.log(`You are talking while muted. Do you want to unmute?`);
});

webrtcCall.on(CallsApiEvent.NETWORK_QUALITY_CHANGED, (event) => {
    console.log(`Local network quality is: ${NetworkQuality[event.networkQuality]}`);
});

webrtcCall.on(CallsApiEvent.REMOTE_NETWORK_QUALITY_CHANGED, (event) => {
    console.log(`Remote network quality is: ${NetworkQuality[event.networkQuality]}`);
});

webrtcCall.on(CallsApiEvent.CALL_RECORDING_STARTED, (event) => {
  console.log(`Call recording started with type ${event.recordingType}`);
});

Tutorials

Migration guides

Reference documentation

Clone this wiki locally