ShowerLoop-cc/docker/showerloop/public/js/video-init-fixed.min.js

79 lines
2.5 KiB
JavaScript

// Initialize videos when the DOM is fully loaded
document.addEventListener('DOMContentLoaded', function() {
console.log('[VIDEOJS] Initialization starting...');
if (typeof videojs === 'undefined') {
console.error('[VIDEOJS ERROR] VideoJS is not loaded!');
return;
}
// Helper function to configure and initialize a video player
function initializeVideoPlayer(elementId, options) {
try {
var defaultOptions = {
html5: {
vhs: {
overrideNative: true,
enableLowInitialPlaylist: true,
limitRenditionsByPlayerDimensions: true,
useBandwidthFromLocalStorage: true
},
nativeAudioTracks: false,
nativeVideoTracks: false
},
controlBar: {
pictureInPictureToggle: false
},
playbackRates: [0.75, 1, 1.25, 1.5, 2],
techOrder: ["html5"]
};
// Merge options
var mergedOptions = {};
for (var key in defaultOptions) {
mergedOptions[key] = defaultOptions[key];
}
for (var key in options || {}) {
mergedOptions[key] = options[key];
}
var player = videojs(elementId, mergedOptions);
// Fix MIME type issues in Chromium
var hlsSource = player.el().querySelector('source[type="application/x-mpegurl"], source[type="application/vnd.apple.mpegurl"]');
if (hlsSource) {
// Ensure consistent MIME type
hlsSource.type = 'application/x-mpegurl';
// Force HLS reload to ensure proper initialization
var currentSrc = hlsSource.src;
setTimeout(function() {
// Only reload if player hasn't started yet
if (!player.hasStarted_) {
player.src({
src: currentSrc,
type: 'application/x-mpegurl'
});
}
}, 100);
}
player.on('error', function() {
console.error('[VIDEOJS ERROR] Player "' + elementId + '" error:', player.error());
});
console.log('[VIDEOJS] Player "' + elementId + '" initialized');
return player;
} catch (e) {
console.error('[VIDEOJS ERROR] Failed to initialize player "' + elementId + '":', e);
return null;
}
}
// Initialize all videos
var heroVideo = initializeVideoPlayer('video-hero-1741299175');
var video2 = initializeVideoPlayer('video2');
var video3 = initializeVideoPlayer('video3');
console.log('[VIDEOJS] Initialization completed');
});