I've been experiencing issues with multiple Brightcove videos freezing at :19 seconds when played through Fancybox. Here is an example: https://jsfiddle.net/qrqwy0qt/1/
Steps to reproduce:
- Click the 'Play Video in Fancybox' button
- Watch the video play through correctly
- Refresh the page, or click 'Run' in jsfiddle
- Play the video again in Fancybox, watch it freeze at :19 seconds.
Wait about a minute and the video shows "Could not download the video. Error code: PLAYER_ERR_TIMEOUT" and the following error is shown in the console:
VIDEOJS: ERROR: (CODE:-2 undefined) i {code: -2, type: "PLAYER_ERR_TIMEOUT", message: ""} h @ index.html?videoId=5002405584001&autoplay=1:1300 g.error @ index.html?videoId=5002405584001&autoplay=1:1300 b @ index.html?videoId=5002405584001&autoplay=1:1307 db @ index.html?videoId=5002405584001&autoplay=1:1297 (anonymous function) @ index.html?videoId=5002405584001&autoplay=1:1308
This doesn't appear to happen when the video is embedded on the page normally, which you can also see in the jsfiddle.
Additionally, with certain video players you can even see the issue forming in the buffer progress bar:
You can see the color change on the progress bar right at :19 seconds. The video seems to have issues loading content after this point unless you manually seek beyond that point.
I've also had this issue using other lightboxes such as Brightcove's modal. Can anyone help me find a fix for this?
Update:
It seems the issue only occurs when the video height is over 270px, excluding the "letter-box" of the video player. You can test this with the following CSS properties:
.fancybox-inner{
max-height:270px; // No freezing issue
//min-height:275px; // Results in freezing
}
This isn't really a permanent solution because it prevents responsiveness on larger resolutions, but hopefully this information can bring us closer to a real solution.