Using the lobby feature using lib-jitsi-meet

ERSIN_COL · April 25, 2023, 8:05pm

I downloaded jitsi-meet-tokens, mod_token_affiliation, token_lobby_bypass, lobby_autostart plugins downloaded. Tested it and everything I expect for the lobby in the installed web interface is working.

I’m developing a custom UI using lib-jitsi-meet low level api, how should I go about it to use the lobby feature?

I can’t figure out exactly how I should go about it, I’d appreciate it if you could help

damencho · April 25, 2023, 8:52pm

To listen when lobby is enabled/disabled in a meeting:

github.com

jitsi/jitsi-meet/blob/646c58f7d12b9b6ef61393e971025eab3d4ce75d/react/features/lobby/middleware.ts#L111


      
          });
          
          
/**
           * Registers a change handler for state['features/base/conference'].conference to
           * set the event listeners needed for the lobby feature to operate.
           */
          StateListenerRegistry.register(
              state => state['features/base/conference'].conference,
              (conference, { dispatch, getState }, previousConference) => {
                  if (conference && !previousConference) {
                      conference.on(JitsiConferenceEvents.MEMBERS_ONLY_CHANGED, (enabled: boolean) => {
                          dispatch(setLobbyModeEnabled(enabled));
                          if (enabled) {
                              dispatch(setLobbyMessageListener());
                          }
                      });
          
          
            conference.on(JitsiConferenceEvents.LOBBY_USER_JOINED, (id: string, name: string) => {
                          const { soundsParticipantKnocking } = getState()['features/base/settings'];
          
          
                batch(() => {

Moderator receives a notification when someone joins lobby:

github.com

jitsi/jitsi-meet/blob/646c58f7d12b9b6ef61393e971025eab3d4ce75d/react/features/lobby/middleware.ts#L118


      
          state => state['features/base/conference'].conference,
          (conference, { dispatch, getState }, previousConference) => {
              if (conference && !previousConference) {
                  conference.on(JitsiConferenceEvents.MEMBERS_ONLY_CHANGED, (enabled: boolean) => {
                      dispatch(setLobbyModeEnabled(enabled));
                      if (enabled) {
                          dispatch(setLobbyMessageListener());
                      }
                  });
          
          
        conference.on(JitsiConferenceEvents.LOBBY_USER_JOINED, (id: string, name: string) => {
                      const { soundsParticipantKnocking } = getState()['features/base/settings'];
          
          
            batch(() => {
                          dispatch(
                              participantIsKnockingOrUpdated({
                                  id,
                                  name
                              })
                          );
                          if (soundsParticipantKnocking) {

And when lobby participant leaves:

github.com

jitsi/jitsi-meet/blob/646c58f7d12b9b6ef61393e971025eab3d4ce75d/react/features/lobby/middleware.ts#L161


      
          
          
conference.on(JitsiConferenceEvents.LOBBY_USER_UPDATED, (id: string, participant: IKnockingParticipant) => {
              dispatch(
                  participantIsKnockingOrUpdated({
                      ...participant,
                      id
                  })
              );
          });
          
          
conference.on(JitsiConferenceEvents.LOBBY_USER_LEFT, (id: string) => {
              batch(() => {
                  dispatch(knockingParticipantLeft(id));
                  dispatch(removeLobbyChatParticipant());
                  dispatch(updateLobbyParticipantOnLeave(id));
              });
          });
          
          
conference.on(JitsiConferenceEvents.ENDPOINT_MESSAGE_RECEIVED, (origin: any, sender: any) =>
              _maybeSendLobbyNotification(origin, sender, {
                  dispatch,

When a participant tries to join a conference where lobby is enabled, there is a conference failed event with member_onlu error:

github.com

jitsi/jitsi-meet/blob/646c58f7d12b9b6ef61393e971025eab3d4ce75d/react/features/lobby/middleware.ts#L271


      
          * @param {Function} next - The Redux next function.
          * @param {Object} action - The Redux action.
          * @returns {Object}
          */
          function _conferenceFailed({ dispatch, getState }: IStore, next: Function, action: AnyAction) {
             const { error } = action;
             const state = getState();
             const { membersOnly } = state['features/base/conference'];
             const nonFirstFailure = Boolean(membersOnly);
          
          
   if (error.name === JitsiConferenceErrors.MEMBERS_ONLY_ERROR) {
                 if (typeof error.recoverable === 'undefined') {
                     error.recoverable = true;
                 }
          
          
       const result = next(action);
          
          
       dispatch(openLobbyScreen());
          
          
       if (shouldAutoKnock(state)) {
                     dispatch(startKnocking());

And then that participant needs to join the lobby room:

github.com

jitsi/jitsi-meet/blob/646c58f7d12b9b6ef61393e971025eab3d4ce75d/react/features/lobby/actions.any.ts#L216


      
                  const state = getState();
                  const { membersOnly } = state['features/base/conference'];
                  const localParticipant = getLocalParticipant(state);
          
          
        dispatch(conferenceWillJoin(membersOnly));
          
          
        // We need to update the conference object with the current display name, if approved
                  // we want to send that display name, it was not updated in case when pre-join is disabled
                  sendLocalParticipant(state, membersOnly);
          
          
        membersOnly?.joinLobby(localParticipant?.name, localParticipant?.email);
                  dispatch(setLobbyMessageListener());
                  dispatch(setKnockingState(true));
              };
          }
          
          
/**
           * Action to toggle lobby mode on or off.
           *
           * @param {boolean} enabled - The desired (new) state of the lobby mode.
           * @returns {Function}

Everything you need is implemented in jitsi-meet under feature lobby:

You can use it as an example and debug the js code using meet.jit.si.

ERSIN_COL · April 28, 2023, 6:41am

thanks for your guidance

ERSIN_COL · April 28, 2023, 8:23am

lobby feature is active and lobby is forming. I can see this in prosody.


Apr 28 08:04:19 mod_bosh        info    New BOSH session, assigned it sid '414caf35-fa15-4d69-a963-7164abe9f3e1'
Apr 28 08:04:19 bosh414caf35-fa15-4d69-a963-7164abe9f3e1        info    Authenticated as bcfd76aa-1f5b-4b0f-9a48-3beb5f0910e0@mydomain.com
Apr 28 08:04:21 mydomain.com:muc_lobby_rooms      info    Lobby room jid = example-room-name@lobby.mydomain.com created from:(nil)

I’m sending a message to the lobby

room = connection.initJitsiConference(roomName, confOptions);
room.sendLobbyMessage('demo-message')

but I can’t use addLobbyMessageListener method addLobbyMessageListenerFunction

I implemented this method like this

room.addLobbyMessageListener(e=>{
          console.log(e)
        })

Is there something wrong with my listener function, how exactly should I use the chat feature in the lobby? can you help me?

damencho · April 28, 2023, 11:09am

github.com

jitsi/jitsi-meet/blob/0bea2926d21cce90f2f972250d7c8d94cecb93d9/react/features/lobby/actions.any.ts#L396


      
          export function setLobbyMessageListener() {
              return async (dispatch: IStore['dispatch'], getState: IStore['getState']) => {
                  const state = getState();
                  const conference = getCurrentConference(state);
                  const { enableChat = true } = getLobbyConfig(state);
          
          
        if (!enableChat) {
                      return;
                  }
          
          
        conference?.addLobbyMessageListener((message: any, participantId: string) => {
                      if (message.type === LOBBY_CHAT_MESSAGE) {
                          return dispatch(handleLobbyMessageReceived(message.message, participantId));
                      }
                      if (message.type === LOBBY_CHAT_INITIALIZED) {
                          return dispatch(handleLobbyChatInitialized(message));
                      }
                      if (message.type === MODERATOR_IN_CHAT_WITH_LEFT) {
                          return dispatch(updateLobbyParticipantOnLeave(message.moderatorId));
                      }
                  });

This is how you create the listener, your code seems correct.
You are sending the message too early. Make sure you get the conference error, then join the lobby, make aure you are in the lobby, then send a mesaage.

ERSIN_COL · May 2, 2023, 7:15am

thanks,
sendLobbyMessage function returned undefined. the user gets the CONFERENCE_FAILED error and joins the lobby, there is a lobby id side, but is there something like the enable chat feature of the lobby that the user joins is true or false, how can I access the lobby configuration I am in?

this is code :

room.on(
        JitsiMeetJS.events.conference.CONFERENCE_FAILED,
        (err) => {
            console.log('user failed to join the conference. : ', err);
            room.joinLobby()
                .then(()=>{
                    console.log(`lobby join success, local user lobby user id : ${room.myLobbyUserId()}`)
                .catch((err)=>{
                    console.log('lobby join error: ',err)
                })
            })
        }
    );

Ask to join on jitsi-meet web button, then moderator starts messaging. Is that why I can’t use the sendLobbyMessage function?

ERSIN_COL · May 2, 2023, 10:48am

Can you guide us how to apply the ask to join button with lib-jitsi-meet low level api?

damencho · May 2, 2023, 11:51am

On conference_failed of type members_only error:

github.com

jitsi/jitsi-meet/blob/29945f4809523bc2804cea5cba331aee3cdb0bd2/react/features/lobby/middleware.ts#L271


      
          * @param {Function} next - The Redux next function.
          * @param {Object} action - The Redux action.
          * @returns {Object}
          */
          function _conferenceFailed({ dispatch, getState }: IStore, next: Function, action: AnyAction) {
             const { error } = action;
             const state = getState();
             const { membersOnly } = state['features/base/conference'];
             const nonFirstFailure = Boolean(membersOnly);
          
          
   if (error.name === JitsiConferenceErrors.MEMBERS_ONLY_ERROR) {
                 if (typeof error.recoverable === 'undefined') {
                     error.recoverable = true;
                 }
          
          
       const result = next(action);
          
          
       dispatch(openLobbyScreen());
          
          
       if (shouldAutoKnock(state)) {
                     dispatch(startKnocking());

Open lobby screen with button join.

When join is clicked call:

github.com

jitsi/lib-jitsi-meet/blob/c24537454cb6e83961095fe92c7f5b421de7a0f9/JitsiConference.js#L4037


      
              }
          };
          
          
/**
           * Joins the lobby room with display name and optional email or with a shared password to skip waiting.
           *
           * @param {string} displayName Display name should be set to show it to moderators.
           * @param {string} email Optional email is used to present avatar to the moderator.
           * @returns {Promise<never>}
           */
          JitsiConference.prototype.joinLobby = function(displayName, email) {
              if (this.room) {
                  return this.room.getLobby().join(displayName, email);
              }
          
          
    return Promise.reject(new Error('The conference not started'));
          };
          
          
/**
           * Gets the local id for a participant in a lobby room.
           * Returns undefined when current participant is not in the lobby room.

Where the conference object is the same object you tried to join initially.

For the lobby chat is it enabled on your deployment?

github.com

jitsi/jitsi-meet/blob/43be4324af64ba5d22cf54ea1868d6d5b58f4a0f/config.js#L559


      
          // DEPRECATED. Please use `securityUi?.hideLobbyButton` instead.
          // Hides lobby button.
          // hideLobbyButton: false,
          
          
// DEPRECATED. Please use `lobby?.autoKnock` instead.
          // If Lobby is enabled starts knocking automatically.
          // autoKnockLobby: false,
          
          
// DEPRECATED. Please use `lobby?.enableChat` instead.
          // Enable lobby chat.
          // enableLobbyChat: true,
          
          
// DEPRECATED! Use `breakoutRooms.hideAddRoomButton` instead.
          // Hides add breakout room button
          // hideAddRoomButton: false,
          
          
// Require users to always specify a display name.
          // requireDisplayName: true,
          
          
// Enables webhid functionality for Audio.
          // enableWebHIDFeature: false,

Does it work with jitsi-meet?

ERSIN_COL · May 2, 2023, 12:01pm

lobby chat is enabled in my distribution and I have provided all these features but I cannot send a message to the lobby and I cannot see the message sent to the lobby. I’m using jitsi-meet web and my own custom UI web app over distribution. I can only accept and decline the request to join

damencho · May 2, 2023, 12:12pm

So it doesn’t work with pure jitsi-meet you say?

ERSIN_COL · May 2, 2023, 12:14pm

no it works. I join the same meeting with pure jitsi-meet and on the other hand, with the custom app I created using a low level api, but I can’t see and send messages sent to the lobby.

ERSIN_COL · May 2, 2023, 12:17pm

two users in the meeting are sending and receiving messages to each other but I can’t send messages to the user in the lobby and I can’t receive the message that the moderator sent to the lobby

damencho · May 2, 2023, 12:19pm

How do you sent the messages when you are in the lobby? And how the moderator is listening for those?

ERSIN_COL · May 2, 2023, 12:25pm

using these two functions

damencho · May 2, 2023, 12:42pm

If that works for jitsi-meet I don’t see why it would not work with your modifications. You can put a breakpoint on both of them and see how it behaves and the parameters that are passed when executed inside jitsi-meet and see what is the difference with your implementation.

ERSIN_COL · May 3, 2023, 6:05am

thanks i will try