How to implement the universal auto-floor API for KUDO Language Access Widget

February 13, 2024 15:47
Updated

This article explains how to implement KUDO's universal Autofloor API into third-party platforms integrated with the Language Access Widget.

How does the feature work?

This feature automatically mutes/or lowers the floor audio when the attendee chooses a language channel and unmutes/raises the audio if the chosen language is spoken on the floor. Not only does this enhance the overall user experience but enables participants to interact in different languages during virtual events.

In practice this is what happens:

The participant opens the KUDO language selector in the 3rd party platform and selects a language.
If an interpreter is providing interpretation (their mic is active) we send a call to the platform to mute or lower the volume of the original audio.
If an interpreter is NOT providing interpretation (their mic is inactive) we send a call to the platform to unmute or raise the volume of the original audio.
When the participant selects “Original Audio” from the KUDO language selector, we send a call to the platform to unmute or raise the volume of the original audio

Before you start

You will need the following:

A KUDO client account that can schedule meetings with KUDO Language Access (KLA) widget enabled.

Implementation

KUDO uses JavaScript’s Window.postMessage() method to safely enable communication between KUDO iframe and the 3rd party meeting web platform. Based on Interpreter availability for the selected language channel, KUDO posts messages informing the 3rd party platform whether it should mute or unmute the main meeting’s audio.

On the 3rd party platform, the developers need to listen to the dispatched messages with the help of the window.addEventListener method as shown below:

window.addEventListener("message", (event) => {
try {
      const data = JSON.parse(event.data);
      const muteFloor = data['floorMute'];
      if(muteFloor) {
        // perform steps to mute the meeting audio.
} else {
// perform steps to unmute the meeting audio.
      }
    } catch(e) {
      console.log(e)
    } }, false);

References:

https://developer.mozilla.org/en-US/docs/Web/API/Window/postMessage

Notes:

Our KUDO iframe sends the event message data to the one level up parent window. It works in Single-level hierarchy iframe.
Language access meeting should be scheduled with auto-floor disabled.

Knowledge Base

Articles in this section