I have the following code:
index.html
<!DOCTYPE html>
<html>
<head>
<title>Custom modal example</title>
</head>
<body>
<video-js id="myPlayerID"
data-video-id="5185914204002"
data-account="1752604059001"
data-player="Hyv669PDZ"
data-embed="default"
data-application-id
class="video-js"
controls
width="560" height="315"></video-js>
<script src="https://players.brightcove.net/1752604059001/Hyv669PDZ_default/index.min.js"></script>
<script type="text/javascript">
(function () {
if (typeof videojs == 'undefined') {
return false;
}
videojs.getPlayer('myPlayerID').ready(function () {
var player = this;
var modalContent = document.createElement("div");
modalContent.innerHTML = 'Custom message';
var ModalDialog = videojs.getComponent("ModalDialog");
var modal = new ModalDialog(player, {content: modalContent, uncloseable: true});
player.addChild(modal);
player.on('error', function () {
player.errorDisplay.hide();
modal.open();
});
});
})();
</script>
</body>
</html>
I am displaying custom message in modal if there is some video error. It is working correctly in Chrome, but in Firefox it only shows up for the first time, and after refreshing the page it shows default error.