Skip to main content
Version: legacy

PostMessages for Call Controls

Control Call from Parent​

You can control the JioMeet call in the iframe from the parent web application by using the browser’s postMessage API. The format for sending the postMessages to JioMeet iframe is like so:

document.getElementById(<iframe-id>).contentWindow.postMessage(JSON.stringify({'type': 'toggleVideo'}),”*”)

The following are the meeting control types available to you using this method:

  1. toggleAudio : to toggle audio mute/unmute functionality

  2. toggleVideo: to toggle video mute/unmute functionality

  3. toggleParticipantList: to toggle participant list

  4. toggleChat: to toggle chat window

  5. startScreenShare: to start screen sharing

  6. startWhiteboardShare: to start whiteboard sharing

  7. stopSharing: stop screen/whiteboard sharing

  8. toggleHand: toggle raise/lower hand

  9. leaveMeeting: to leave meeting

  10. EndMeeting: to End Meeting

Hide self view​

window.postMessage(JSON.stringify({ type: "showSelfView", show: false }));

Show self-view​

window.postMessage(JSON.stringify({ type: "showSelfView", show: true }));

Hide left-panel sidebar​

window.postMessage(
  JSON.stringify({ type: "toggleParticipantsView", show: false })
);

Opening URL in iframe​

You can now load a URL inside JioMeet iframe by following these steps:

  1. To open any URL, you need to send the following postMessage:
window.postMessage(
  JSON.stringify({ type: "openIframe", url: "https://www.example.com" })
);
  1. To close the URL in the iframe, you need to send the following postMessage:
window.postMessage(JSON.stringify({ type: "closeIframe" }));

Presenter Layout​

Enable Presenter Layout for screensharing user​

window.postMessage(JSON.stringify({ type: "enablePresenterLayout" }));

Above callback will enable presenter layout and will pick the user who is sharing the screen automatically, if any user is not sharing the screen first user who is not local participant would be the presenter.

Enable Presenter layout and select User​

window.postMessage(
  JSON.stringify({
    type: "enablePresenterLayout",
    participant: { participantId: "809842683" },
  })
);

Above callback will enable presenter layout with predefined user i.e supplied participantId.

Disable Presenter Layout​

window.postMessage(JSON.stringify({ type: "disablePresenterLayout" }));

If presenter layout is turned on it will disable the presenter layout

Dynamically Change Presenter​

window.postMessage(
  JSON.stringify({
    type: "changePresenter",
    participant: { participantId: "809842683" },
  })
);

By supplying above callback if presenterLayout is enabled, you can dynamically change the presenter by providing participantId like above.