Programming WebRTC

Generating Video Structures on the Fly

The peer-to-peer HTML has its own hard-coded values, just like the JavaScript did on $self and $peer. A single <video id="peer"> element worked fine in a peer-to-peer call, but it’s not suited to multipeer. Let’s resume our code-deletion therapy regimen, and remove the peer video-element completely from the HTML. And while we’re in the HTML, let’s beef up the semantics for the self video and structure it in a <figure> element:

<article id="videos">
  <h2 class="preserve-access">Streaming Videos</h2>
  <figure id="self">
    <video
      autoplay
      muted
      playsinline
      poster="img/placeholder.png">
    </video>
    <figcaption>
      You
    </figcaption>
  </figure>
</article>

The video element remains unchanged ...