Gallery Layout Only Responding to Canvas Dimension Changes

Video SDK Web
1

Description
Hi there, team.
I have noticed, having been working on the Web SDK implementation with ReactTS, for over a year now, that the gallery layout only responds to canvas dimension changes in the implementation.

I understand that this might be the expected working, but it has huge effects on the working of the implementation, knowing the shortcoming of the react useState hook.

This is very much glaring when the camera is kept on while interacting with the SDK. Some of the instances which these effects are notable are:

  1. When you toggle the chats container.
  2. Viewing from the receiver’s end when screensharing is stopped.
  3. When user’s are removed/leave the meeting

Now, we have tried to workaround this by hooking the layout to listen to several events such as:

  1. ‘user-added’
  2. ‘user-removed’
  3. ‘user-updated’
  4. ‘active-share-change’
  5. ‘share-content-dimension-change’

But the issues persist. In fact, only the ‘user-updated’ event seems to really be working. Now when I test with all participants muted. It seems like the application cannot even respond to anything else. But if at least two participants are unmuted, the application begins to respond. If everywhere is in still silence, it also behaves as when all participants were muted - unreactive.

While I know (and had stated already above) that this maybe inherent to the framework, or probably the SDK API, I don’t know where to look anymore and this is really bad for our company because these issues have contributed heavily to delayed delivery of our product.

So I kindly ask, is there a remedy for this? I sincerely don’t know where to look anymore.

Which Web Video SDK version?
1.9.5

2

Hey @godwin.owonam

Thanks for your feedback.

It depends on how you design the layout of the gallery view.

Here are some thoughts for your reference:

  • If there are many participants and you need to paginate the participant list, I suggest listening for the user-added, user-removed, and user-updated events because triggering these events means that participants have performed some actions, such as starting video (which can be determined from the user.bVideoOn property).

  • If you need to simultaneously display shared content and the participant list, I suggest listening for the active-share-change event to determine whether to display the shared content and the layout change.

  • Additionally, changes in the viewport size can also affect the layout of the gallery view. You can use ResizeObserver to bind to the elements you need to monitor and then perform the necessary layout calculations.

Thanks
Vic

3

Thanks @vic.yang for responding.

Do you have any idea why the implementation seems not to be responding when the camera is on and all the users are muted?

Meanwhile, I will try your suggestion.

4

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.