diff --git a/modules/API/API.js b/modules/API/API.js index 022e9001af..2ba0820014 100644 --- a/modules/API/API.js +++ b/modules/API/API.js @@ -1695,6 +1695,19 @@ class API { }); } + /** + * Notify the external application that the state of the participants pane changed. + * + * @param {boolean} open - Wether the panel is open or not. + * @returns {void} + */ + notifyParticipantsPaneToggled(open) { + this._sendEvent({ + name: 'participants-pane-toggled', + open + }); + } + /** * Disposes the allocated resources. * diff --git a/modules/API/external/external_api.js b/modules/API/external/external_api.js index c15f1bfdcc..4b5ebb8025 100644 --- a/modules/API/external/external_api.js +++ b/modules/API/external/external_api.js @@ -126,6 +126,7 @@ const events = { 'participant-kicked-out': 'participantKickedOut', 'participant-left': 'participantLeft', 'participant-role-changed': 'participantRoleChanged', + 'participants-pane-toggled': 'participantsPaneToggled', 'password-required': 'passwordRequired', 'proxy-connection-event': 'proxyConnectionEvent', 'raise-hand-updated': 'raiseHandUpdated', diff --git a/react/features/app/middlewares.any.js b/react/features/app/middlewares.any.js index 0161856adb..27602427e7 100644 --- a/react/features/app/middlewares.any.js +++ b/react/features/app/middlewares.any.js @@ -36,6 +36,7 @@ import '../large-video/middleware'; import '../lobby/middleware'; import '../notifications/middleware'; import '../overlay/middleware'; +import '../participants-pane/middleware'; import '../polls/middleware'; import '../reactions/middleware'; import '../recent-list/middleware'; diff --git a/react/features/participants-pane/middleware.ts b/react/features/participants-pane/middleware.ts new file mode 100644 index 0000000000..f2c91157ce --- /dev/null +++ b/react/features/participants-pane/middleware.ts @@ -0,0 +1,30 @@ +// @ts-ignore +import { IStore } from '../app/types'; +// @ts-ignore +import { MiddlewareRegistry } from '../base/redux'; +import { PARTICIPANTS_PANE_CLOSE, PARTICIPANTS_PANE_OPEN } from './actionTypes'; + + +declare var APP: any; + +/** + * Middleware which intercepts participants pane actions. + * + * @param {IStore} store - The redux store. + * @returns {Function} + */ +MiddlewareRegistry.register((store: IStore) => (next:Function) => (action:any) => { + switch(action.type) { + case PARTICIPANTS_PANE_OPEN: + if (typeof APP !== 'undefined') { + APP.API.notifyParticipantsPaneToggled(true); + } + break; + case PARTICIPANTS_PANE_CLOSE: + if (typeof APP !== 'undefined') { + APP.API.notifyParticipantsPaneToggled(false); + } + break; + } + return next(action); +});