title: Limit playback range of HLS m3u8 playlist
body: <p>Is there an open-source implementation of limiting the playback range of HLS m3u8 playlists?</p>
  <p>I'm able to render the video using the <a href="https://github.com/video-dev/hls.js/" rel="nofollow noreferrer">hls.js</a> library, specify a start time for the video and impose a duration to identify the end time. My goal here is to limit the playback range for the m3u8 playlist, as I will have users that will want to view a specific clip of say 8-15 seconds from a ~3-5 hour video playlist. I don't want my users to have the ability to seek throughout the entirety of the video playlist, simply the prespecified playback range.</p>
  <p>Therefore, as an example, if the clip I have specified begins at 00:02:30 (2 min 30 s) and ends at 00:02:40 (2 min 40 s), thus a 10 s duration, how can I set the video player's playback range to be 00:00:00 to 00:00:10?</p>
  <p><strong>index.html</strong></p>
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;meta charset=&quot;utf-8&quot;&gt;
          &lt;title&gt;HLS Demo&lt;/title&gt;
          &lt;link rel=&quot;stylesheet&quot; href=&quot;https://cdn.plyr.io/1.8.2/plyr.css&quot;&gt;
      &lt;/head&gt;
      &lt;body style=&quot;width: 40%; height: 40%&quot;&gt;
          &lt;video preload=&quot;none&quot; id=&quot;player&quot; autoplay controls crossorigin&gt;&lt;/video&gt;
          
          &lt;script src=&quot;https://cdn.plyr.io/1.8.2/plyr.js&quot;&gt;&lt;/script&gt;
          &lt;script src=&quot;https://cdn.jsdelivr.net/hls.js/latest/hls.js&quot;&gt;&lt;/script&gt;
          &lt;script src=&quot;./script.js&quot;&gt;&lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  <p><strong>myscript.js</strong></p>
  <pre><code>(function () {
      var video = document.querySelector('#player');
  
      if (Hls.isSupported()) {
          // ALL CONFIG OPTIONS HERE: https://github.com/video-dev/hls.js/blob/master/docs/API.md
          var config = {
              autoStartLoad: true,
              startPosition: 150, // 00:02:30 IN SECONDS
              debug: false
          };
  
          var hls = new Hls(config);
          hls.loadSource('https://bitdash-a.akamaihd.net/content/MI201109210084_1/m3u8s/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.m3u8');
          hls.attachMedia(video);
  
          // hls.on(Hls.Events.MEDIA_ATTACHED, function() {
          hls.on(Hls.Events.MANIFEST_PARSED,function() {
              video.muted = true;
              video.play();
  
              setTimeout(function(){ 
                  video.pause();
              }, 10000);
          });
      }
  
      plyr.setup(video);
  })();
  </code></pre>
  <p>CodePen available <a href="https://codepen.io/rick-ahlf/pen/ExNMYBB" rel="nofollow noreferrer">here</a>.</p>
  <p>The functionality I'm aiming to implement is more or less described <a href="https://www.theoplayer.com/blog/frame-accurate-clipping-in-hls" rel="nofollow noreferrer">here</a>, I'm just surprised this isn't more straightforward, unless I'm overlooking something obvious.</p>
  <p>Thanks in advance.</p>