Layout Doesn't Work

[siaw23-retired]

Creating a new issue because I can't reopen #89

In response to your comment on #89, I'm calling the layout method when the first video element of the publisher shows up. And for each time a peer join the call also I call the layout method again. No luck.

---

Hi @aullman. I've played extensively to try to get opentok-layout-js to work like the GIF in the README but have had no luck at all. I'd be happy if you could point out what I could be doing wrong.

First of all, I see this note in the README

This library adds an ot-layout className to elements once they have been layed out.

Now, I don't see any ot-layout class on my elements so this makes me think there's something wrong right off the bat. I can verify I have added the library.

So far my HTML looks something like this:

<div id="layoutContainer">
  <div id="publisherContainer" style="position: absolute; left: 731px; top: 0px; height: 0px;">
    <video autoplay="" id="local-video-undefined"></video>
    <video autoplay="" id=""></video>
  </div>
</div>

And the animation doesn't work. If I move the video element with ID "local-video-undefined" out of the "publisherContainer" div, the animation works but the layout is broken and doesn't fill the screen like in the GIF on the README.

What could I have messed up? Any pointers please?

PS: I'm not using OpenTok. My guess is it doesn't matter as long as I have video elements in a container.

EDIT:

Also I see classes like "OT_bar OT_edge-bar-item OT_mode-auto" in the demo app where are they coming from?