Add your own buttons / actions

Adding Control Bar Buttons

This lets you add custom buttons on the bottom control bar of the meeting and add an event to these buttons via onClick().

// Add a custom button to the control bar
button = meeting.controlBar.addButton({
    icon: <div>😀</div>,
    label: 'React',
    position: 'center',
    onClick: () => {
        meeting.sendRoomMessage(message);
    },
});

// Remove the button that was just added
meeting.controlBar.removeButton(button);

Add Participant Controls

This lets you add custom menu item in participant tab and the context menu (right-click) of a video. On interacting with this menu item, you get an onClick() event that also gives you the participant ID as peerId.

meeting.addParticipantControl({
    label: 'React 😀',
    onClick: (peerId) => {
    }
});