Widget:MerlinVideoPlayer

<video id="" poster="https://image.mux.com//thumbnail.png?time=&width=" controls crossorigin></video> <script>

 window.addEventListener('load', (event) => {
   // Initialize HLS
   if (Hls.isSupported()) {
     var video = document.getElementById();
     var hls = new Hls();
     // bind them together
     hls.attachMedia(video);
     hls.on(Hls.Events.MEDIA_ATTACHED, function () {
       hls.loadSource('https://stream.mux.com/.m3u8');
       hls.on(Hls.Events.MANIFEST_PARSED, function (event, data) {
         console.log('manifest loaded, found ' + data.levels.length + ' quality level');
       });
     });

     // Handle errors
     hls.on(Hls.Events.ERROR, function (event, data) {
       if (data.fatal) {
         switch (data.type) {
           case Hls.ErrorTypes.NETWORK_ERROR:
             // try to recover network error
             console.log('fatal network error encountered, try to recover');
             hls.startLoad();
             break;
           case Hls.ErrorTypes.MEDIA_ERROR:
             console.log('fatal media error encountered, try to recover');
             hls.recoverMediaError();
             break;
           default:
             // cannot recover
             hls.destroy();
             break;
         }
       }
     });

     // Initialize Plyr
     const player = new Plyr($("#"), {
         "previewThumbnails": { enabled: true, src: 'https://image.mux.com//storyboard.vtt' }
     });

     // Initialize mux monitoring
     if (typeof mux !== 'undefined') {
         mux.monitor('#', {
             debug: false,
             data: {
                env_key: 'ojbg7i3guecslk149fmaqj2ev', 
                player_init_time: Date.now(),

                video_id: ,
                video_title: ,
                player_name: 'HLS Plyr',
                viewer_user_id: 
             }
         });
      } // if typeof mix
   } // if (Hls.isSupported())
 }); // window.addEventListener

</script>