Raise or Lower volume of each remote participant in the jitsi external iframe API

Developers Jitsi Meet API
#1

i see this option also on https://meet.jit.si/mymeeting

I want to show the volume option in Jitsi external iframe API,

image
image768Ă—616 81.7 KB

My question is related to https://github.com/jitsi/jitsi-meet/issues/5858

however, i m using jitsi using the external iframe API, how do i turn on this option so that all participants can lower or raise volumes for other participants?

My code looks something like this,



<script>

if ((typeof(JitsiMeetExternalAPI) !== "undefined") && (JitsiMeetExternalAPI === JitsiMeetExternalAPI)){

            var domain = "mydomain.com";
            var options = {
                roomName: "community3",
                configOverwrite: {
                     startWithVideoMuted:true
               },
                interfaceConfigOverwrite: {
                    filmStripOnly: true,
                    VERTICAL_FILMSTRIP: false,
                    MOBILE_APP_PROMO:false,
   TOOLBAR_BUTTONS: [
        'microphone', 'closedcaptions', 'desktop', 'fullscreen',
        'fodeviceselection',  'profile', 'chat', 'recording',
        'livestreaming', 'etherpad', 'sharedvideo',  'raisehand',
       'filmstrip', 'invite', 'feedback', 'stats',  'shortcuts',
        'tileview'
    ],
                }
            }
            var api = new JitsiMeetExternalAPI(domain, options);
api.executeCommand('displayName',this.app.user.username);
if (this.app.user.username == "Guest") {
        api.executeCommand('avatarUrl', "https://i.pravatar.cc/300"+"?v="+Math.random());
    } else {
        api.executeCommand('avatarUrl', this.app.user.picture);
    }

} else {
location.reload();
}

My iframe looks like this, but i dont see the 3 dots to lower or raise volume of each participant, what am i doing wrong or what am i missing?

image
image2242Ă—336 73.2 KB

Tagging some helpful devs here, @saghul @rishabhchd19 @Fuji @hkhait @Cuong_Quyet_Nguyen @damencho

2 Likes
#2

@Faizan_Zahid I checked and that “remote video menu” option (3 dots) is already available by default without any “configOverwrite” and “interfaceConfigOverwrite” in the iframe api.
I even just tried your above code by simply removing “filmStripOnly: true” and “3 dots” option was there… I don’t know why “filmStripOnly: true” make that option vanish but by simply removing it you can achieve that. May be there are other options too.
If you want fully customized control over every component you have to use lib-jitsi-meet https://github.com/jitsi/lib-jitsi-meet/blob/master/doc/API.md and have to manually do everything.
Thanx

Paid work: Add a button to mute mic of spammers or participants on voice call when using Jitsi meet iframe API
#3

@Fuji Yes i see that open after removing “filmStripOnly: true”

but we have almost 10-20 people always talking in a voice room, if i remove “filmStripOnly: true” then the UI gets messed up because i m showing the jitsi iframe in a horizontal landscape mode, how can i customize the UI (change height/width ) of the jitsi iframe according to my own needs and toggle options(like share screen, raise hands, chat etc etc) on and off which i dont need? any code examples? as i dont need all those options.