clappr/hlsjs-playback

Clappr HLS Playback based on hls.js

Huge changes in the latest version. See 0.4.0 version changelog for more information

Clappr Monorepo

Look for Clappr and related packages under the /packages directory. Applications like the clappr.io documentation site are under the /apps directory.

Documentation

Visit https://clappr.github.io to view the full documentation.

Run the Development Server

1. Run yarn install to install all dependencies
2. Run yarn dev will start the development server.
3. Visit http://localhost:8080 to view your application.

hlsjs-playback's Issues

update more often with last hlsjs

hi,
That would be great if hls-playback (and so clappr in general) could be up to date with last hlsjs release.
Right now you use 1.2.4 (Oct 1 22) while last is 1.3.5 (2 days ago). There are tons of improvements since...

Thanks

Update hls.js version

Could you please update the Hls.js version to a recent one?

Hls.js v1.5.x has no API changes but brings nice features, like the Managed Media Source Extensions API, which allows using Hls.js on iPhones, which is crucial for our project: P2P video delivery with Clappr.

Ask for integration help.

Hi, thank you for all your efforts.
I was constantly asked for the implementation of custom and standard HlS integration with plyr-react.
Could we get help from your team with our custom integration, I tried on my own for some fit-to-code solutions, but I know that a dedicated team on this idea itself, can be more likely to scale and remain.
I would be happy if we can talk more about possibilities for a custom HLS player from your package integrated with ours to make people happy.

Sorry, I asked it here in issues, I couldn't find the discussion section.

chintan9/plyr-react#688

Exposing hls.js events

Hi,

I would like to create a custom closed caption rendering plugin which works with hls streams. To do so, hls.js offers a property called renderTextTracksNatively which disables native rendering of captions. It also exposes two new events, one of which is called Hls.Events.CUES_PARSED. This event will fire when new captions or subtitle cues are parsed.

Is there a way to expose hls.js event handlers from hlsjs-playback in a similar fashion to how clappr exposes events?

var player = new Clappr.Player({
  source: "http://your.video/here.mp4",
  plugins: [HlsjsPlayback, MyCustomCC],
  playback: {
    hlsjsConfig: { 
      renderTextTracksNatively : false,
    },
  }
});

// inside MyCustomCC plugin
this.listenTo(
  this.core.activePlayback,
  Events.CUES_PARSED,
  this._onCuesParsed
);

Subtitles/ClosedCaptions never loaded for VOD

With the given VOD

https://senvuvod.azureedge.net/pvvodsoc-fl/_definst_/mp4:azrsoc/archives/PV750/2020/2020-06-25/9637_Senate%20sitting%20no.%2027_13-30-41_VL.mp4/playlist.m3u8?audioindex=2

HLSJS.Events.SUBTITLE_TRACK_LOADED is never triggered
HLSJS.Events.SUBTITLE_TRACKS_UPDATED gets triggered

Therefore the closed captions are never loaded. I tried removing this._playbackType === Playback.LIVE from the following code

// Live stream subtitle tracks detection hack (may not immediately available)
if (this._ccTracksUpdated && this._playbackType === Playback.LIVE && this.hasClosedCaptionsTracks)
  this._onSubtitleLoaded()

but the hasClosedCaptionsTrack was still false when it ran. To fix my issue, I added the following to the _onTimeUpdate method

if (this._ccTracksUpdated && this.hasClosedCaptionsTracks)
  this._onSubtitleLoaded();

Is there a better way to do this?

Low latency hls test. (question)

Hi!
To test HLS with low latency, I rebuilt [email protected] using [email protected].
With my ll-hls stream, the delay decreased by almost 30 seconds!
But there is also something strange.
When I compare the latency of my build and the clean one [email protected] or safari hls implementation, my build for some reason loses them 2 seconds.
What do you think in hlsjs-playback could increase the delay?
Any suggestions. Thanks!)

Error: Uncaught TypeError: Cannot read properties of undefined (reading 'call) Vite (FIX)

Using this module in a Vite project causes the above error.

To fix, provide this in your Clappr config:

new Clappr.player({
    ...
    playback: {
        hlsjsConfig: {
            enableWorker: false
        }
    }
})

See video-dev/hls.js#5146