<.script> class CustomVideoGallery { constructor() { this.players = new Map(); this.currentPlaying = null; this.init(); } init() { console.log('🎬 CustomVideoGallery Iniciado'); this.initAllVideos(); this.setupGlobalClick(); this.loadYouTubeAPI(); } initAllVideos() { const videos = document.querySelectorAll('.video-player-wrapper'); console.log(`📹 Encontrados ${videos.length} vídeos`); videos.forEach((player) => { this.setupVideoPlayer(player); }); } setupVideoPlayer(playerElement) { const thumbnail = playerElement.querySelector('.video-thumbnail'); const container = playerElement.querySelector('.video-container'); const iframe = playerElement.querySelector('.youtube-iframe'); // URL DO YOUTUBE SUPER LIMPA - REMOVE TUDO const videoId = playerElement.getAttribute('data-video-id'); const cleanUrl = this.getCleanYouTubeUrl(videoId); iframe.src = cleanUrl; thumbnail.addEventListener('click', () => { this.playVideo(playerElement); }); iframe.onload = () => { this.setupPlayerAPI(iframe, playerElement); }; } getCleanYouTubeUrl(videoId) { // PARÂMETROS QUE REMOVEM TODAS AS INFORMAÇÕES const params = new URLSearchParams({ 'autoplay': '0', 'mute': '1', 'modestbranding': '1', // Remove logo 'rel': '0', // Remove vídeos relacionados 'showinfo': '0', // Remove informações 'controls': '0', // Remove controles (nós controlamos) 'disablekb': '1', // Desativa teclado 'fs': '0', // Remove botão fullscreen 'iv_load_policy': '3', // Remove anotações 'playsinline': '1', // Não entra em fullscreen no mobile 'enablejsapi': '1', 'origin': window.location.origin, 'widget_referrer': window.location.href }); return `https://www.youtube.com/embed/${videoId}?${params.toString()}`; } setupPlayerAPI(iframe, playerElement) { if (!window.YT) return; try { const player = new YT.Player(iframe, { events: { 'onReady': (event) => { this.players.set(playerElement, event.target); event.target.mute(); console.log('✅ Player pronto:', playerElement.getAttribute('data-video-id')); }, 'onStateChange': (event) => { const videoId = playerElement.getAttribute('data-video-id'); if (event.data === YT.PlayerState.PLAYING) { this.onVideoPlay(playerElement); } // PROBLEMA 3: Quando vídeo termina, volta para thumbnail if (event.data === YT.PlayerState.ENDED) { console.log('⏹️ Vídeo terminado:', videoId); this.showThumbnail(playerElement); } } } }); } catch (error) { console.error('❌ Erro na API:', error); } } playVideo(playerElement) { // Pausar vídeo atual if (this.currentPlaying && this.currentPlaying !== playerElement) { this.pauseVideo(this.currentPlaying); } const thumbnail = playerElement.querySelector('.video-thumbnail'); const container = playerElement.querySelector('.video-container'); // Esconder thumbnail, mostrar vídeo thumbnail.style.display = 'none'; container.style.display = 'block'; if (this.players.has(playerElement)) { const player = this.players.get(playerElement); player.unMute(); player.playVideo(); this.currentPlaying = playerElement; } else { // Fallback para primeira reprodução const videoId = playerElement.getAttribute('data-video-id'); const iframe = playerElement.querySelector('.youtube-iframe'); const playUrl = this.getCleanYouTubeUrl(videoId).replace('autoplay=0', 'autoplay=1').replace('mute=1', 'mute=0'); iframe.src = playUrl; this.currentPlaying = playerElement; } } showThumbnail(playerElement) { const thumbnail = playerElement.querySelector('.video-thumbnail'); const container = playerElement.querySelector('.video-container'); if (thumbnail && container) { thumbnail.style.display = 'block'; container.style.display = 'none'; // Reset do iframe para evitar "Assista novamente" const iframe = playerElement.querySelector('.youtube-iframe'); iframe.src = this.getCleanYouTubeUrl(playerElement.getAttribute('data-video-id')); } if (this.currentPlaying === playerElement) { this.currentPlaying = null; } } pauseVideo(playerElement) { this.showThumbnail(playerElement); if (this.players.has(playerElement)) { const player = this.players.get(playerElement); player.pauseVideo(); player.mute(); } } onVideoPlay(playerElement) { this.currentPlaying = playerElement; } setupGlobalClick() { document.addEventListener('click', (e) => { // PROBLEMA 3: Clicar fora pausa e mostra thumbnail if (!e.target.closest('.video-player-wrapper') && this.currentPlaying) { this.pauseVideo(this.currentPlaying); } }); } loadYouTubeAPI() { if (window.YT) return; if (!document.querySelector('script[src*="youtube.com/iframe_api"]')) { const script = document.createElement('script'); script.src = 'https://www.youtube.com/iframe_api'; document.head.appendChild(script); } } } // Inicialização function onYouTubeIframeAPIReady() { window.videoGallery = new CustomVideoGallery(); } if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', () => { if (window.YT) new CustomVideoGallery(); }); } else { if (window.YT) new CustomVideoGallery(); }