Handle a Local Stream
The React Native SDK provides the following methods to handle a local stream:
- publish(): To publih a local stream into a room.
- switchCamera(): To switch between rear and front camera as a source for the published stream.
- switchMediaDevice(): To switch the microphone.
- muteSelfAudio(): To mute and unmute audio from a local stream.
- muteSelfVideo(): To mute and unmute video from a local stream.
- setAdvancedOptions(): To set advanced options for stream configuration.
Publish a Local Stream
The local stream with audio and video needs to be initiated and published into the Room for other participants to see and hear you. Enx.publish()
method is used to publish a local stream to the connected Room. After the local stream is published to the Room, all participants are notified with a callback named streamAdded
.
Method: publish()
Callbacks
Callback | Description |
---|---|
streamPublished | To the publisher that the stream has been published. |
eventError | To the publisher to notify that publishing has failed. |
streamAdded | To all participants of a room that a new stream is published in the room. |
Sample Code
roomConnected:event=>{Enx.publish(); // Publish Stream}streamPublished:event=>{// To publisher - Stream has been published}eventError : event=>{// To publisher - Failed to publish}streamAdded:event=>{// To others - New stream is added}
Switch Camera, Microphone, and Speaker
A user can switch to alternate media devices to publish the user's streams. EnableX provides APIs to allow switching of media devices on the fly. You can switch between rear and front camera and to other available microphones.
Switch between Rear and Front Camera
To switch between the rear and front camera as a source of published stream, use the Enx.switchCamera()
method.
Method: Enx.switchCamera(localStreamId)
Parameter: localStreamId
: String. Id of the local stream whose source camera is being switched.
Sample Code
Enx.switchCamera(localStreamId);
Switch to Alternate Microphone
If a user wants to switch the microphone, which is used to create a published stream, to an alternate microphone, use the Enx.switchMediaDevice()
method. This API requires the name of the new device that it needs to switch to. Use the Enx.getDevices()
method to fetch the list of microphone names and create a UI for the new device selection.
Method: Enx.switchMediaDevice(micDevice)
Parameter: micDevice
: String. Name of the new microphone device.
Callback: notifyDeviceUpdate
: JSON Object. When the audio device update is complete. It returns the details of the switched microphone device.
Sample Code
Enx.switchMediaDevice( micDevice ); // To switch to new micDev// To self: Device updatednotifyDeviceUpdate : event =>{// event = micDevice name}
Mute or Unmute Audio in a Stream
Use the Enx.muteSelfAudio()
method to mute and unmute audio from a local stream. When a user mutes or unmutes audio from their Published Stream, all other connected users of the room are notified with remoteStreamAudioMute
and remoteStreamAudioUnmute
callbacks, respectively. Listen to these events to update related UI elements.
Method: Enx.muteSelfAudio( localStreamId, muteState )
Parameters:
Parameter | Data Type | Description |
---|---|---|
localStreamId | String | Local Stream Id, which is to be muted or unmuted |
muteState | Boolean | * set true - to mute audio in a stream * set false - to unmute audio in a stream |
Callbacks:
Callback | Data Type | Description |
---|---|---|
remoteStreamAudioMute | JSONObject | To all participants notifying the user has muted audio |
remoteStreamAudioUnmute | JSONObject | To all participants notifying the user has unmuted audio |
audioEvent | JSONObject | To self that audio is either muted or unmuted |
Sample Code
Enx.muteSelfAudio(localStreamId, true); //To mute audioEnx.muteSelfAudio(localStreamId,false); //To unMute audio// To all participant - user muted audioremoteStreamAudioMute:event=>{// event = { "result":0, "clientId":"XXX", "msg":"user muted audio" }}// To all participant - user unmuted audioremoteStreamAudioUnMute:event=>{// event = { "result":0, "clientId":"XXX", "msg":"user unmuted audio" }}// To self - Audio muted / unmutedaudioEvent:event=>{// event = { "msg":"Audio Off", "result":0 }// event = { "msg":"Audio On", "result":0 }}
Mute or Unmute Video in a Stream
Use the Enx.muteSelfVideo()
method to mute and unmute video from a local stream. When a user mutes or unmutes video from the user's published stream, all other connected users of the room are notified with remoteStreamVideoMute
and remoteStreamVideoUnMute
callbacks, respectively. Listen to these events to update the related UI elements.
Method: Enx.muteSelfVideo( localStreamId, muteState )
Parameters:
Parameter | Data Type | Description |
---|---|---|
localStreamId | String | Id of the a local stream which needs to be muted or unmuted. |
muteState | Boolean | Set it to true to mute video in a stream. Otherwise, set it to false. |
Callbacks:
Callback | Data Type | Description |
---|---|---|
remoteStreamVideoMute | JSON Object | To all the participants to notify them that a user has muted the video of the user's stream. |
remoteStreamVideoUnmute | JSON Object | To all the participants to notify them that a user has unmuted the video of the user's stream. |
videoEvent | JSON Object | Self notification that video is either muted or unmuted. |
Sample Code
Enx.muteSelfVideo(localStreamId, true); //To mute videoEnx.muteSelfVideo(localStreamId,false); //To unMute video// To all participant - user muted videoremoteStreamVideoMute:event=>{// event = { "result":0, "clientId":"XXX", "msg":"user muted video" }}// To all participant - user unmuted videoremoteStreamVideoUnMute:event=>{// event = { "result":0, "clientId":"XXX", "msg":"user unmuted video" }}// To self - Video muted / unmutedvideoEvent:event=>{// event = { "msg":"Video Off", "result":0 }// event = { "msg":"Video On", "result":0 }}
Advanced Stream Options
The Enx.setAdvancedOptions(AdvanceOptions)
and Enx.setAdvancedOptions(advanceOptions)
methods notify the user of various events affecting their streaming process.
Method: setAdvancedOptions(AdvanceOptions)
Parameter
Parameter | Data Type | Description |
---|---|---|
AdvanceOptions |
Array | AdvanceOptions.battery_updates : Boolean. Set it to true to receive battery updates/information. AdvanceOptions.notify_video_resolution_change : Boolean. Set it to true to receive information about video resolution change. |
Callback
Callback | Data Type | Description |
---|---|---|
advancedOptionsUpdate |
JSONObject | To notify that advanced options on the local stream have been updated. |
Sample Code
advanceOptions: {battery_updates: true,notify_video_resolution_change: true}Enx.setAdvancedOptions(advanceOptions)// Advance Options are updatedadvancedOptionsUpdate: event => {/* event =[{ "id":"battery_updates","enable":true},{ "id":"notify-video-resolution-change","enable":true}] */}
Method: Enx.getAdvancedOptions()
: To get advanced options.
Sample Code
Enx.getAdvancedOptions()// Advance Options are updatedgetAdvancedOptions: event => {/* event =[{ "id":"battery_updates","enable":true},{ "id":"notify-video-resolution-change","enable":true}] */}