Parent Window Communication

When you embed the Low Code Video application inside an IFRAME, the embed and the parent page can communicate bidirectionally using the browser's postMessage API. This turns the embedded video session into an interactive component that is aware of your application — not just a passive frame.

Communication flows in two directions:

• Parent → Embed (Actions) — Your page sends a JSON message to the IFRAME to trigger something inside the video session, such as starting a live stream, muting audio, or disconnecting a user.
• Embed → Parent (Notifications) — The embed sends JSON messages to your page to report events, such as a participant joining, the room being connected, or live streaming starting.

How It Works

Both directions use the standard browser window messaging model. Your parent page holds a reference to the IFRAME's contentWindow and calls postMessage() on it to send an action. The embed sends notifications back using the same mechanism, and your parent page receives them by listening for the notification event on window.

All messages are JSON-serialised strings. The structure of an action sent from the parent always contains an "action" key and, where applicable, a "data" object:

// Sending an action from the parent page to the embed
const message = JSON.stringify({
  action: "action-name",
  data: { /* optional payload */ }
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');
// Replace "videoIframe" with the actual id of your IFRAME element

A notification received by the parent from the embed follows this structure:

// Listening for notifications from the embed on the parent page
window.addEventListener('notification', function(e) {
  const decoded = JSON.parse(e);

  switch (decoded.notification) {
    case 'room-connected':
      // handle room connected
      break;
    case 'user-connected':
      // handle user joined
      break;
  }
});

Notification Subscription

Before the embed sends notifications to the parent, the parent must subscribe to one or more notification groups. Each group covers a category of events. Subscribing to a group means you receive all events in that group until you explicitly unsubscribe.

Subscribe to Notifications

Send this action to start receiving notifications from the specified groups:

const message = JSON.stringify({
  action: "subscribe-notification",
  data: [
    "live-streaming",
    "room-connection",
    "user-connection",
    "stream-updates",
    "messaging"
  ]
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Available notification groups:

Unsubscribe from Notifications

To stop receiving notifications from specific groups:

const message = JSON.stringify({
  action: "unsubscribe-notification",
  data: [
    "live-streaming",
    "room-connection"
  ]
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

To unsubscribe from all notification groups at once, pass an empty array:

const message = JSON.stringify({
  action: "unsubscribe-notification",
  data: []
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Room Connection

Disconnect from Room

Instructs the embed to disconnect the current user from the video session. You can optionally show a confirmation prompt before disconnecting.

With a confirmation prompt:

const message = JSON.stringify({
  action: "disconnect-room",
  data: { alert: true }
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Immediately, without a prompt:

const message = JSON.stringify({
  action: "disconnect-room",
  data: { alert: false }
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Destroy Video Session

A moderator can end the session for all participants by destroying the room. All connected users are disconnected automatically.

With a confirmation prompt:

const message = JSON.stringify({
  action: "destroy-room",
  data: { alert: true }
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Immediately, without a prompt:

const message = JSON.stringify({
  action: "destroy-room",
  data: { alert: false }
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Stream Updates

Control the local user's audio and video tracks from the parent page.

Mute Video

Stops the video track on the local stream. The stream continues, but no video data is sent.

const message = JSON.stringify({ action: "mute-video" });
document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Unmute Video

Restores the video track on the local stream.

const message = JSON.stringify({ action: "unmute-video" });
document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Mute Audio

Stops the audio track on the local stream.

const message = JSON.stringify({ action: "mute-audio" });
document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Unmute Audio

Restores the audio track on the local stream.

const message = JSON.stringify({ action: "unmute-audio" });
document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Live Streaming

These actions start and stop HLS/RTMP live streaming of the current video session. You provide the RTMP endpoint and key that the streaming service (such as YouTube Live or any RTMP destination) gives you.

Start Live Streaming

const message = JSON.stringify({
  action: "start-live-streaming",
  data: {
    name: "YouTube",
    rtmp_endpoint: "rtmp://a.rtmp.youtube.com/live2",
    rtmp_key: "YOUR_STREAM_KEY"
  }
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Stop Live Streaming

Stops all active live streams for the current session.

const message = JSON.stringify({ action: "stop-live-streaming" });
document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Change Video Layout

Switch the video grid between gallery view and leader view. You can target only the RTMP stream output, or apply the change to all endpoints simultaneously.

const message = JSON.stringify({
  action: "change-layout",
  data: {
    target: "all",
    layout: "leader"
  }
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

Custom Signalling

Broadcast a custom data payload to all users in the session. EnableX does not interpret the payload — it simply relays it to every connected endpoint. This is a lightweight signalling mechanism for passing application-specific messages between participants.

const message = JSON.stringify({
  action: "signal",
  data: {
    /* Define your own data structure here */
    type: "poll-question",
    question: "Which feature do you use most?"
  }
});

document.getElementById("videoIframe").contentWindow.postMessage(message, '*');

The embed fires these notifications to the parent window. Unless otherwise noted, you must subscribe to the relevant notification group before the embed will send that notification. See Subscribe to Notifications above.

Subscription Notifications

These two notifications are sent automatically whenever you subscribe or unsubscribe — no prior subscription is required.

Notification Subscribed

Confirms the groups you have successfully subscribed to.

{
  "notification": "notification-subscribed",
  "data": [
    "live-streaming",
    "room-connection"
  ]
}

Notification Unsubscribed

Confirms the groups you have unsubscribed from.

{
  "notification": "notification-unsubscribed",
  "data": [
    "live-streaming",
    "room-connection"
  ]
}

Room Connection Notifications

Sent when the embed's connection to the video room changes state. The room-connected, room-not-connected, and room-disconnected notifications are always emitted — no subscription required. The room-reconnected notification requires subscribing to the room-connection group.

Room Connected

{
  "notification": "room-connected",
  "data": {
    "room_name": "John's Room",
    "conf_num": "SESSION_ID"
  }
}

Room Not Connected

{
  "notification": "room-not-connected",
  "data": {}
}

Room Disconnected

{
  "notification": "room-disconnected",
  "data": {
    "message": "Reason for disconnection"
  }
}

Possible disconnection reasons include:

• Session expired
• Room access denied
• Failed to reconnect
• Disconnected by Moderator
• Unexpected disconnection
• Normal disconnect

Room Reconnected

Requires subscription to the room-connection group.

{
  "notification": "room-reconnected"
}

User Connection Notifications

Fired when any participant joins or leaves the room. Requires subscription to the user-connection group.

User Connected

{
  "notification": "user-connected",
  "data": {
    "clientId": "UNIQUE_CLIENT_ID",
    "name": "Alice",
    "role": "participant"
  }
}

User Disconnected

{
  "notification": "user-disconnected",
  "data": {
    "clientId": "UNIQUE_CLIENT_ID",
    "name": "Alice",
    "role": "participant"
  }
}

Stream Update Notifications

Fired when the local user's audio or video track changes state. Requires subscription to the stream-updates group.

{ "notification": "video-muted" }
{ "notification": "video-unmuted" }
{ "notification": "audio-muted" }
{ "notification": "audio-unmuted" }

Live Streaming Notifications

Requires subscription to the live-streaming group.

Live Streaming Started

{
  "notification": "live-streaming-started",
  "data": {
    "name": "YouTube",
    "rtmp_endpoint": "rtmp://a.rtmp.youtube.com/live2",
    "rtmp_key": "YOUR_STREAM_KEY"
  }
}

Live Streaming Stopped

{
  "notification": "live-streaming-stopped",
  "data": {}
}

Media Access Notifications

These notifications are always emitted — no subscription required. They report whether the embed was able to access the user's camera and microphone.

Media Access Denied

// Room did not connect due to media access being denied
{
  "notification": "media-access-denied",
  "data": {
    "message": "Media access denied. Room not connected."
  }
}

// Room connected but without camera/mic access
{
  "notification": "media-access-denied",
  "data": {
    "message": "Mic and Camera access denied"
  }
}

Camera Access

{ "notification": "camera-access-allowed", "data": {} }
{ "notification": "camera-access-denied",  "data": {} }

Microphone Access

{ "notification": "mic-access-allowed", "data": {} }
{ "notification": "mic-access-denied",  "data": {} }

Custom Signal Received

Fired when the embed receives a custom signal broadcast from another participant. Requires subscription to the messaging group.

{
  "notification": "signal-received",
  "data": {
    /* Your custom data structure, as sent by the broadcaster */
  }
}