Get participant name that left (iFrame)

Developers Jitsi Meet API
#1

How do I get the name of the participant that ended the call?

api.addListener('participantLeft', (id, displayName) => {

                console.log(id);

                console.log(displayName);

            });

This however does not work. What is the right way?

#2

Listen to event participantJoined and store the participants yourself. Then when the participant leaves check the local array for display name.

let participants = [];

api.addListener('participantJoined', (data) => {
	// data includes id and displayName
	participants.push(data);
});

api.addListener('participantLeft', ({ id }) => {
	const participant = participants.find(p => p.id === id);
	// You can use participant.displayName here
	
	participants = participants.filter(p => p.id !== id);
});
2 Likes
#3

Hello all. I used the solution given by @izakgl . What I am doing is using the CDN directly and not installing server while using IFrame. I used the same code using IFrame API but I cant get the events running. Is there something which is required before using IFrame API or any installation? Thanks in advance. Here is the code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
    <script src="https://meet.jit.si/libs/lib-jitsi-meet.min.js"></script>
    <title>Video Conf</title>
</head>
<body>
    <div id="meet" style="    display: block;
    width: 100%;
    height: 100vh"></div>
  <div size="middle" type="primary" class="mr-1" danger  onClick="api.executeCommand('toggleAudio')">End Meeting For All</div>    
    <script src="https://meet.jit.si/external_api.js"></script>
    <script>
        var domain = "meet.jit.si";

        var charlist = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'.split('')
        var rname = ""
        for (let i = 0; i < 12; i++) {
            rname = rname+charlist[Math.floor(Math.random() * charlist.length)];
        }
        console.log(rname)
        var options = {
            roomName: "ahhaa_coach_meet",
            width: '100%',
            height: '100%',
            parentNode: document.querySelector('#meet')
        }
        var api = new JitsiMeetExternalAPI(domain, options);
        
        let participants = [];
        api.addListener('participantJoined', (data) => {
            // data includes id and displayName
            participants.push(data);
            console.log(participants);
        });

        api.addListener('participantLeft', ({ id }) => {
            const participant = participants.find(p => p.id === id);
            // You can use participant.displayName here
            
            participants = participants.filter(p => p.id !== id);
            console.log(participants);
        });

        api.executeCommand('subject', 'New Room 2');
        
        
        
    </script>
</body>
</html>