title: how to detect if MUX video embedded in WordPress is streaming or playback of a fixed length video?
body: <p>I've searched here and found some very old answers but I think this question has not been answered. I'm using the MediaCloud plugin in Wordpress to display videos. When I create a page, I can use a short tag to display a video by including this in my HTML markup:</p>
  <pre class="lang-html prettyprint-override"><code>&lt;div id=&quot;my_video&quot;&gt;
  [mux_video id='2926' autoplay='false' loop='false' muted='false' controls='true' inline='false' preload='metadata']
  &lt;/div&gt;
  </code></pre>
  <p>Wordpress will query an internal db for media id=2926 and ends up rendering this HTML markup to display the video (url changed for privacy):</p>
  <pre class="lang-html prettyprint-override"><code>&lt;div id=&quot;my_video&quot;&gt;
    &lt;figure&gt;
      &lt;video class='mux-player video-js'  width=1920 height=1080 poster='https://www.example.com/wp-content/uploads/2021/08/2926--thumb.jpg' controls preload='metadata'&gt;
        &lt;source src='https://stream.mux.com/&lt;-LONG-ENCODED-ID-HERE&gt;.m3u8' type='application/x-mpegURL' /&gt;
      &lt;/video&gt;
    &lt;/figure&gt;
  &lt;/div&gt;
  </code></pre>
  <p>My configuration of MediaCloud uses videojs to display the video but I've been unable to locate any useful function in <a href="https://docs.videojs.com/tutorial-live.html#the-new-user-interface" rel="nofollow noreferrer">the docs</a> which can tell me if the video in question is a livestream or some previously broadcast live stream or uploaded video with a fixed duration (presumably progressive download?). It seems clear that the JS running in the page can tell the difference because a livestream clearly has the <strong>LIVE</strong> indicator visible and the timeline indicator/scrubber removed whereas an old video will have the timeline indicator/scrubber and displays the fixed length of the video.</p>
  <p>I thought at first that I might sniff for the Program Data Time (PDT) and this might be absent for pre-recorded content, but <strong>MUX also provides PDT for old livestreams</strong>.  This code will output the PDT for the currently running video but cannot be used to distinguish livestream from old videos:</p>
  <pre class="lang-js prettyprint-override"><code>const video1 = document.querySelector(&quot;#my_video video&quot;);
  let player1 = videojs(video1);
  window.player1 = player1;
  player1.on('loadeddata', () =&gt; {
          let metadataTrack = Array.prototype.find.call(player1.textTracks(), track =&gt; track.label === 'segment-metadata');
          metadataTrack.on('cuechange', () =&gt; {
                  let pdt = metadataTrack.activeCues[0].value.dateTimeString;
                  document.getElementById('pdt_1').innerHTML = pdt;
          });
  });
  
  </code></pre>
  <p>I also tried checking for the video's duration to see if that might help me distinguish -- was thinking a livestream might have some empty value for duration but that's not the case. So far, <strong>it always shows me some positive integer value</strong> when I do this:</p>
  <pre class="lang-js prettyprint-override"><code>video1.addEventListener('loadedmetadata', (event) =&gt; {
    // duration and dimensions of video are now known
    let dur = Math.round(video1.duration);
    console.log(dur)
  });
  </code></pre>
  <p>Is there some simple JS that I can use to return a true/false value indicating whether the video in question is a livestream or whether it's an old video of fixed duration? Someone suggested querying the MUX API but that's not going to work for me in this case and would gum up my page load times.</p>