avelad
commented
3 months ago There are currently 3 ways to have thumbnails in HLS:
- Use player.addThumbnailsTrack to add an external vtt with jpgs. Eg: https://shaka-player-demo.appspot.com/demo/#audiolang=es-ES;textlang=es-ES;uilang=es-ES;asset=https://cdn.bitmovin.com/content/assets/art-of-motion-dash-hls-progressive/m3u8s/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.m3u8;panel=ALL_CONTENT;panelData=THUMBNAILS,HLS;build=uncompiled --> https://cdn.bitmovin.com/content/assets/art-of-motion-dash-hls-progressive/thumbnails/f08e80da-bf1d-4e3d-8899-f0f6155f6efa.vtt
- Use an I-frame-only playlists with the mjpg codec --> https://shaka-player-demo.appspot.com/demo/#audiolang=es-ES;textlang=es-ES;uilang=es-ES;asset=https://devstreaming-cdn.apple.com/videos/streaming/examples/adv_dv_atmos/main.m3u8;panel=ALL_CONTENT;panelData=THUMBNAILS,HLS;build=uncompiled
- Use HLS Image Media Playlist --> Spec: https://github.com/image-media-playlist/spec/blob/master/image_media_playlist_v0_4.pdf
The one recommended by Apple and the HLS spec is the 2nd, the 1st is widely used, the 3rd is a Roku spec that we support but that few streams support.
Has this helped you?
adamsonGert
Have you read the Tutorials? Yes
Have you read the FAQ and checked for duplicate open issues? Yes
If the question is related to FairPlay, have you read the tutorial?
Yes
What version of Shaka Player are you using? 3.0.4
What browser and OS are you using? Safari Version 17.5
Please ask your question I'm trying to figure out how the HLS demo with thumbnails works.
Right now (from my application) the only info about thumbnails I'm getting is the I-Frame playlists info from the m3u8 file, but I believe this is the old way? Based on the feat(UI): Add thumbnails to the UI commit - Is the demo app using the .vtt file and parsing/converting the info somehow? Because from the demo app's network tab, i see that they are using .jpg file that includes all the thumbnails.