document.addEventListener("DOMContentLoaded", function () {
let players = [];
window.onYouTubeIframeAPIReady = function() {
initializePlayers();
};
function initializePlayers() {
// Initialize the large video player
initializePlayer(0, 'youtube-video-0', 'text-container'); // Scroll to the text container after large video
// Initialize players for the video grid
for (let i = 1; i <= 6; i++) {
let playerId = 'youtube-video-' + i;
let iframe = document.getElementById(playerId);
if (iframe) {
initializePlayer(i, playerId, 'scroll-target-' + (i + 1));
}
}
}
function initializePlayer(index, playerId, scrollTarget) {
let player = new YT.Player(playerId, {
events: {
'onReady': onPlayerReady,
'onStateChange': function(event) {
onPlayerStateChange(index, event, scrollTarget);
}
}
});
players.push(player);
}
function onPlayerReady(event) {
// You can add any specific actions here when the player is ready
}
function onPlayerStateChange(playerIndex, event, scrollTarget) {
if (event.data == YT.PlayerState.PLAYING) {
// Pause all other players
pauseOtherPlayers(playerIndex);
}
if (event.data == YT.PlayerState.ENDED) {
// Video has ended, scroll to the target
let targetElement = document.getElementById(scrollTarget);
if (targetElement) {
if (window.elementorFrontend) {
elementorFrontend.waypoint(targetElement, function(direction) {
if ('down' === direction) {
window.scrollTo({
top: targetElement.offsetTop,
behavior: 'smooth'
});
}
});
} else {
window.scrollTo({
top: targetElement.offsetTop,
behavior: 'smooth'
});
}
}
}
}
function pauseOtherPlayers(currentPlayerIndex) {
players.forEach(function(player, index) {
if (index !== currentPlayerIndex) {
player.pauseVideo();
}
});
}
});
