Janus
Implement video mute / unmute functionality in janus video conference
July 07, 2021
1 min

Implement video mute / unmute functionality in janus video conference

What is janus?

As described by its creator meetecho, janus is a general purpose WebRTC endpoint that browsers can interact with, and different modules can determine what should be done with the media. You can do, text messaging, video conferencing, streaming and more other things with janus. Also if there is no such module to do stuff what you are looking, you can expand janus by yourself.

What is janus VideoRoom plugin?

Janus videoroom plugin implement virtual conferencing room that peers can join and leave at anytime. Janus using here publish/subscribe method to initiate video conference. When some one join to the virtual room they can publish their own video/audio streams into room. Then others who already joined to the room receive notification about that publish. Then they can subscribe that stream.

Implement video mute / unmute functionality

There is two main approaches you can move to implement video mute / unmute functionality in existing video conference created by janus.

  • Mute / Unmute through renegotiation peer connection.
  • Use muteVideo / unmuteVideo commands gives by Janus handler.

How to use renegotiation method

You can createOffer and renegotiate peer connection as in this example.

const muteVideo = (handle: JanusJS.PluginHandle) => {
    handle.createOffer({
        media: { removeVideo: true },
        success: (jsep: JanusJS.JSEP) => {
            handle.send({ message: { request: "configure" }, jsep: jsep })
        },
        error: (error: any) => {...},
        })
}

const unmuteVideo = (handle: JanusJS.PluginHandle) => {
    handle.createOffer({
        media: { replaceVideo: true },
        success: (jsep: JanusJS.JSEP) => {
            handle.send({ message: { request: "configure" }, jsep: jsep })
        },
        error: (error: any) => {...},
        })
}

In this approach, janus cut your video stream by itself and subscribers who already subscribe this feed will call new onremotestream event. In there you can figure that this video is muted or unmuted.

How to use inbuilt muteVideo / unmuteVideo commands

const muteVideo = (handle: JanusJS.PluginHandle) => {
    handle.muteVideo();
}

const unmuteVideo = (handle: JanusJS.PluginHandle) => {
    handle.unmuteVideo();
}

This will mute your stream by janus.js layer. But there is no indication about that muting for the subscribers. So you can use data channel and send command to your to all subscribers, to notify them of the respective change.

You can use data channel as follows.

const muteVideo = (handle: JanusJS.PluginHandle) => {
    handle.muteVideo();
    handle.data({text: "mutedMyVideo"})
}

const unmuteVideo = (handle: JanusJS.PluginHandle) => {
    handle.unmuteVideo();
    handle.data({text: "unmutedMyVideo"})
}

But for success this, you have to mark as data: true in your createOffer media section when you publish stream and also createAnswer media section when you subscribe others stream.

When you send data via data channel as per above subscribers catch that commands by ondata event.

Test all two approaches with your application and choose what is the way that fit to your need.


Tags

webrtcjanusubuntuvideomute / unmutedata channel

Related Posts

Janus
How to install Janus Gateway in Ubuntu Server 18.04
July 15, 2021
1 min