`; grid.appendChild(card); }); updateProgressTrack(0); } function playNextVideo() { const currentIframe = document.getElementById(`iframe-${activeIndex}`); if (currentIframe) { currentIframe.contentWindow.postMessage('{"event":"command","func":"pauseVideo","args":""}', '*'); } activeIndex++; if (activeIndex >= 8) { shuffleBatch(); return; } for (let i = 0; i < 8; i++) { const card = document.getElementById(`card-${i}`); if (card) card.classList.toggle('active', i === activeIndex); } updateProgressTrack(activeIndex); const nextIframe = document.getElementById(`iframe-${activeIndex}`); if (nextIframe) { nextIframe.contentWindow.postMessage('{"event":"command","func":"unMute","args":""}', '*'); nextIframe.contentWindow.postMessage('{"event":"command","func":"playVideo","args":""}', '*'); } } function updateProgressTrack(index) { const dots = document.querySelectorAll('.progress-track .dot'); dots.forEach((dot, i) => { dot.classList.toggle('active', i === index); }); } function shuffleBatch() { buildGallery(); } window.addEventListener('message', function(event) { try { const data = JSON.parse(event.data); if (data.event === 'infoDelivery' && data.info && data.info.playerState === 0) { playNextVideo(); } } catch (e) {} }); window.addEventListener('DOMContentLoaded', loadChannelVideos);