index.html 1.3 KB
Newer Older
1 2 3 4
<!doctype html>
<html>
  <head>
    <meta charset="utf-8">
5
    <link rel="stylesheet" href="style.css">
6 7 8
  </head>
  <body>
    <script src="https://cdn.jsdelivr.net/npm/hls.js"></script>
9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24
    <div id="header">
      <img src="COLLABORA_01_MONO.png">
    </div>
    <div id="videos">
      <div class="display_container">
        <video id="hls_video" autoplay></video>
        <div>HLS</div>
      </div>
      <div class="display_container">
        <video id="webrtc_video" autoplay></video>
        <div>WebRTC</div>
      </div>
    </div>
    <div id="footer">
      <img src="gStreamer.svg">
    </div>
25

Jakub Adam's avatar
Jakub Adam committed
26 27 28
    <script type="module">
      import * as mss from './mss.js'

29
      if(Hls.isSupported()) {
Jakub Adam's avatar
Jakub Adam committed
30
        var hls_video = document.getElementById('hls_video');
Jakub Adam's avatar
Jakub Adam committed
31 32 33
        var hls = new Hls({
          liveDurationInfinity: true
        });
34 35 36 37 38 39 40 41 42 43 44

        hls.on(Hls.Events.ERROR, (e, data) => {
          if (data.type == "networkError") {
            setTimeout(() => {
              hls.recoverMediaError()
              hls.loadSource('hls/playlist.m3u8')
            }, 1000)
          }
          console.log(data)
        })

Jakub Adam's avatar
Jakub Adam committed
45
        hls.attachMedia(hls_video);
46
        hls.loadSource('hls/playlist.m3u8');
Jakub Adam's avatar
Jakub Adam committed
47 48
      }

Jakub Adam's avatar
Jakub Adam committed
49
      var webrtc = new mss.WebRTCStream(document.getElementById("webrtc_video"))
50 51 52
    </script>
  </body>
</html>