Expand my Community achievements bar.

Radically easy to access on brand approved content for distribution and omnichannel performant delivery. AEM Assets Content Hub and Dynamic Media with OpenAPI capabilities is now GA.

Putting two webcams on the same page

Avatar

Level 1

Hi there,

For a two-person video chat room, what does it take to place two webcam objects where one shows the webcam that displays the person you're talking to and the other webcam displays yourself?  It's like Skype where there are two cameras showing the person you're talking to and also yourself.

Thanks,

Kevin (newbie to AFCS)

2 Replies

Avatar

Employee

Hi,

Checkout the sampleApp that is provided with the LCCS SDK for code references.

You can use the WebCamera (com.adobe.rtc.pods)pod straight out of the box, or use WebcamPublisher and WebcamSubscriber components to build your own customized webCamera app. By default, we show all streams of every user that is publishing camera to every one else. You can take any camera example like WebCamera or  DefaultPods to see how you can use these components.

Thanks
Arun

Avatar

Former Community Member

Hi Kevin,

All you need is two Webcamsubscribers and a WebcamPublisher object. WebcamSubscriber shows the video streams . By default, it shows all user video streams in a grid structure. But if you set publisherIDs property( by default its null) to the userIDs of the selected user videos you want to show , it will show only those user videos.

For your case, lets say you want to see yourself in a small window and other person in a large window. You can have one webcamsubscriber have publisherIDs property set your user ID and the other one has publisherIDs set to the other person's userID. Then you can make the size and placement of both these websubscribers as per what layout you want e.g. the one showing you is small and in one corner, while the other one takes the full screen.

The example WebCamera in sampleApps folder illustrates the use of multiple webcamsubscribers to have one such layout. Please go through that example and also read the API doc for publisherIDs. Please let us know about any issues you have.

Hope this helps

Thanks

Hironmay Basu