Who-is-Online

The Who-is-On-line component allows you to see participants who connected to a room.

How to use

To initialize the Who-is-Online component, you can follow our quickstart guide.

Usage

import { WhoIsOnline } from "@superviz/sdk";

const whoIsOnline = new WhoIsOnline();

room.addComponent(whoIsOnline);

Properties

See below the options object to use when initializing the Who-is-Online:

Name	Type	Description
position	string	Specifies the location where the component will be displayed. It can be: top-right, top-left, bottom-right, bottom-left, or an ID of an HTML element. Default value: top-right
styles	string	Optional custom CSS styles to be applied to the component. This allows for customization of the component's appearance.
disablePresenceControls	boolean	If true it won't open any dropdown menu by interacting with the participant profile image. Default value: false
disableGoToParticipant	boolean	Disables the GoTo option when clicking on another participant's avatar. Default value: false
disableFollowParticipant	boolean	Disables the Follow option when clicking on another participant's avatar. Default value: false
disablePrivateMode	boolean	Disables the Private Mode option when clicking on the current participant avatar. Default value: false
disableGatherAll	boolean	Disables the Gather All option. Default value: false
disableFollowMe	boolean	Disables the Follow Me option. Default value: false

GoTo and Follow options

The GoTo and Follow options allow you to navigate to a participant's location or follow their movements. It works automatically in 3D environments, such as the Matterport, ThreeJS, and Autodesk Viewer.

If used with Mouse Pointers, you will need to use a callback function when creating the Mouse Pointer component, like this:

const mousepointers = new MousePointers("#canvasId", {
  onGoToPresence: methodCallback,
});

function methodCallback(coordinates) {
  console.log("X position: " + coordinates.x);
  console.log("Y position: " + coordinates.y);
}