If I have a VideoJS player quite happily playing a HLS playlist, that suddenly disapears, it will repeatedly reload that playlist file for eternity, and in the console it will print:
VIDEOJS: WARN: Problem encountered with the current HLS playlist. Trying again since it is the final playlist.
Normally I have an event handler for there being no source available when you first load the page but I'm unsure how to listen for a source vanishes while the video is playing. Is there an event for this?
The trigger I needed was retryplaylist
, used like this in Coffeescript:
player.tech_.on("retryplaylist", ->
blah
)
In case it interests someone, this is what i'm working with:
# Configure player
videojs("stream", {
controlBar: {
playToggle: false
}
hls: {
smoothQualityChange: true
}
}).ready(->
player = this
# Display a modal on error
player.on("error", ->
$('.vjs-modal-dialog-content').remove()
displayError()
)
requestStream = ->
FailCount = 0
# Check if the remote is live
# @formatter:off
$.ajax({
url: __HLS_URI__
# If so add the source to videojs
success: ->
$('.vjs-poster').removeClass('vjs-hidden')
$(".vjs-poster").css({'background-image': 'url("/branding/poster-online.png")'})
$(".vjs-big-play-button").show()
player.src([{src: __HLS_URI__, type: "application/x-mpegURL"}])
player.hlsQualitySelector()
#player.play()
player.volume(0.5)
player.tech_.on("retryplaylist", ->
if FailCount>=5
window.location.reload()
else
FailCount++
console.log(FailCount)
)
# If not display the error
error: ->
displayError()
setTimeout((-> requestStream()), 5000)
})
#@formatter:on
requestStream()
)
# Helper to display errors on the player
displayError = ->
$(".vjs-big-play-button").hide()
$('.vjs-controls-disabled').removeClass('vjs-controls-disabled')
$(".vjs-poster").css({'background-image': 'url("/branding/poster-offline.png")'})
$('.vjs-poster').removeClass('vjs-hidden')
I was trying to find a way to reset VideoJS once the HLS livestream had finished, but eventually I gave up and just forced a page reload instead.