index-main/assets/js/hero-video.js

export function playVideo() {
  const playButton = document.querySelector('#hero-play-video');
  if (!playButton) return;

  const playerDiv = document.querySelector('#youtube-player');
  if (!playerDiv) return;

  // Charger l'API YouTube IFrame Player
  const tag = document.createElement('script');
  tag.src = 'https://www.youtube.com/iframe_api';
  document.head.appendChild(tag);

  let ytReady = false;
  window.onYouTubeIframeAPIReady = () => { ytReady = true; };

  playButton.addEventListener('click', function () {
    const extract = document.querySelector('.extract');
    const videoFull = document.querySelector('.video-full');
    const titleSmall = document.querySelector('.page-title-small');

    if (extract) extract.style.display = 'none';
    if (titleSmall) titleSmall.style.display = 'none';

    if (videoFull) {
      videoFull.style.display = 'block';

      function createPlayer() {
        new YT.Player('youtube-player', {
          videoId: playerDiv.dataset.videoId,
          width: '100%',
          height: '100%',
          playerVars: {
            autoplay: 1,
            rel: 0,
          },
          events: {
            onReady: (e) => e.target.playVideo(),
          },
        });
      }

      if (ytReady) {
        createPlayer();
      } else {
        window.onYouTubeIframeAPIReady = createPlayer;
      }
    }
  });
}