Events

Some events are only available if the website is authenticated 🔐. See "advanced usage" for more information.

Event listeners

on(type, callback)

Register event listener with a callback.

const meeting = new EyesonIframe(...);
meeting.on('error', (error) => {
    console.error(error);
    meeting.close();
});

info

In the constructor's events options, event names are prefixed with on!

new EyesonIframe('#meeting', {
    accessKey: '...',
    events: {
        onReady: () => {...},
        onError: () => {...},
        onMeetingJoin: () => {...},
        onMeetingLeave: () => {...},
        /* etc. */
    },
});

off(type, callback)

Remove event listener.

meeting.off('ready', onReady); // remove the exact callback
meeting.off('ready'); // remove all callbacks for type "ready"
meeting.off(); // remove all callbacks

ready

Eyeson UI has been loaded, iframe connection channel handshake was successfull. Status will change to ready.

error

Errors that occur during the initialization phase. Status will change to error.

• TypeError 'Invalid access key'
• TypeError 'Invalid guest token'
• TimeoutError 'Loading timeout' (after 10s)
• NotFoundError 'Initialization failed'
• UnknownError 'The operation failed'

meeting.on('error', error => {
  if (error.name === 'TypeError') {
    // ...
  }
});

closed

EyesonIframe instance is destroyed and the injected iframe element is removed. Status will change to closed.

statusChange

Status can be:

• init
• ready
• error
• closed

You can also find the current status on the EyesonIframe instance.

const meeting = new EyesonIframe(...);
console.log(meeting.status);

meeting.on('statusChange', status => {
  console.log('status change', status);
});

authenticated 🔐

Authentication was successfull. Features like present, chat, and snapshot are available now.

See "advanced usage" for more information about authentication.

meeting.on('authenticated', () => {
  console.log('available features', meeting.features);
});

fullscreen 🔐

Eyeson UI changed to fullscreen so the iframe itself is fullscreen. The parameter isFullscreen is a boolean to indicate the current state.

meeting.on('fullscreen', isFullscreen => {
  console.log('fullscreen', isFullscreen);
});

meetingJoin 🔐

The meeting always starts with a preview before the actual join happens. Only after the user has successfully joined the meeting, this event is triggered.

meetingLeave 🔐

The user can leave the meeting only if he has joined before. Leaving the meeting can have many reasons, like:

• reload (UI web page reload)
• exit_room (user leaves meeting)
• end_meeting (meeting stopped)
• meeting_locked (user kicked)
• inactive (in meeting)
• offline

meeting.on('meetingLeave', reason => {
  showError(`User has left the meeting because of "${reason}"`);
});

meetingError

This event is available, even if not authenticated.

If the user can't join the meeting, one of the following reasons can be detected:

• reload (UI web page reload)
• access_denied (accessKey invalid, for example meeting gone)
• session_in_use (same user joins the same meeting 2 times)
• meeting_locked (meeting locked)
• inactive (in preview)

meeting.on('meetingError', reason => {
  showError(`User can't join the meeting because of "${reason}"`);
});

userChange 🔐

Only if accessKey is used, not guest.token!

In rare cases, when the same user tries to join while its previous session was not closed propperly, the "session_in_use" error is raised and the Eyeson UI offers to join as guest instead.

Can be used for example to inform your backend of the new user data.

meeting.on('userChange', user => {
  const { accessKey, id, name } = user;
  console.log('new user', id, name);
  // meeting.accessKey has changed to user.accessKey
});