How to load a remote video into the viewer on the top right

Hello, I need to load a remote video into the viewer on the top right.

In order to setup the experiment, please, open 2 tabs on Google Chrome and on both of them, go to:

By doing that, on each tab, there will be just 1 remote participant.

On the main viewer (the big one) will be loaded the video of the remote participant.

Since you are doing an experiment and on both videos you most likely will be seeing your own face, you can differentiate the local and remote videos by whether the image is like a mirror or not. If the image is like a mirror, then that corresponds to the local video. Otherwise, will be the remote video.

If you open the browser Developer Tools Console, you can run commands and get context info:

> window.APP
> window.APP.UI
(with these two above you get lot of values and commands out of the box)

> window.APP.conference.listMembers().length
> window.APP.conference.listMembers()[0]._id
> window.APP.UI.getLargeVideo()
> window.APP.UI.getRemoteVideosCount()

I know the top right viewer is exclusively for local video. But I need to run some instruction on the browser console that let me load some remote video into that viewer on the top right, for example, by doing something like:

// this is just an example, but I would be fine with whatever other way

var remoteId = window.APP.conference.listMembers()[0]._id;

I was trying by modifying the following files and then running the command: make:

but, even thought I was able to create some utility functions and make use of them from the command line, I was not able to load a remote video on that top right viewer.

Any idea on how to achieve this? I’m fine if there is no out of the box approach and I need to modify the source code.