key: AIzaSyDo5k1vYrhxE1D3IYRQP0fAhFLDlSzj47w
https://console.cloud.google.com/apis/credentials?inv=1&invt=Abp5BA&project=plexiform-ion-451310-k9
email: worthshoot@gmail.com

<!-- 1 playlist intr.un container -->

<br><br>
<div id="video-list" class="cards carousel-container">
  <h3 class="vertical-text">Rezumatul nuntii video</h3>
</div>
<br><br>

<script>
  const apiKey = 'AIzaSyDo5k1vYrhxE1D3IYRQP0fAhFLDlSzj47w';
const playlistId = 'PL8FGpbhGjjHGItsEIM14NtzApLxHMM-mU';
const maxResults = 10; // Numărul de videoclipuri afișate
// afiseaza doar 50 de clipuri per lista 
// vezi mai multe clipuri pe ..
const apiUrl = `https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&maxResults=${maxResults}&playlistId=${playlistId}&key=${apiKey}`;

fetch(apiUrl)
  .then(response => response.json())
  .then(data => {
    const videoContainer = document.getElementById('video-list');
    data.items.forEach(item => {
      const videoId = item.snippet.resourceId.videoId;
      // const videoTitle = item.snippet.title;
      
      const videoElement = document.createElement('div');
      videoElement.classList.add('carousel-item','wider');
      // const videoElement = document.getElementById('video-list');
              // <h3>${videoTitle}</h3>
              // width="560" height="315"
              // &modestbranding=1
              // &rel=0&fs=1
      videoElement.innerHTML = `
        <iframe width="300" height="169" src="https://www.youtube.com/embed/${videoId}?modestbranding=1&rel=0&fs=1" frameborder="0" allowfullscreen></iframe>
      `;
      
      videoContainer.appendChild(videoElement);
    });
  })
  .catch(error => console.error('Eroare:', error));

</script>

<!-- 2 playlisturi intr.un container -->

<br><br>
<div id="video-list" class="cards carousel-container">
  <h3 class="vertical-text">Rezumatul nunții video</h3>
</div>
<br><br>

<script>
  const apiKey = 'AIzaSyDo5k1vYrhxE1D3IYRQP0fAhFLDlSzj47w';
  const playlistIds = [
    'PL8FGpbhGjjHGItsEIM14NtzApLxHMM-mU', // Primul playlist
    'PL9FGpbhGjjHFG8sEIM14NtzApLxHMM-nU'  // Al doilea playlist (exemplu, înlocuiește cu ID-ul real)
  ];
  const maxResults = 5; // Numărul de videoclipuri per playlist
  const videoContainer = document.getElementById('video-list');

  playlistIds.forEach(playlistId => {
    const apiUrl = `https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&maxResults=${maxResults}&playlistId=${playlistId}&key=${apiKey}`;

    fetch(apiUrl)
      .then(response => response.json())
      .then(data => {
        data.items.forEach(item => {
          const videoId = item.snippet.resourceId.videoId;

          const videoElement = document.createElement('div');
          videoElement.classList.add('carousel-item', 'wider');
          videoElement.innerHTML = `
            <iframe width="300" height="169" src="https://www.youtube.com/embed/${videoId}?modestbranding=1&rel=0&fs=1" frameborder="0" allowfullscreen></iframe>
          `;

          videoContainer.appendChild(videoElement);
        });
      })
      .catch(error => console.error('Eroare:', error));
  });
</script>

<!-- 2 playlisturi in 2 containere -->

<br><br>
<div class="carousel-wrapper">
  <div id="video-list-1" class="cards carousel-container">
    <h3 class="vertical-text">Rezumatul Nunții - Playlist 1</h3>
  </div>
</div>

<br><br>

<div class="carousel-wrapper">
  <div id="video-list-2" class="cards carousel-container">
    <h3 class="vertical-text">Rezumatul Nunții - Playlist 2</h3>
  </div>
</div>

<br><br>

<script>
  const apiKey = 'AIzaSyDo5k1vYrhxE1D3IYRQP0fAhFLDlSzj47w';
  const playlists = [
    { id: 'PL8FGpbhGjjHGItsEIM14NtzApLxHMM-mU', container: 'video-list-1' },
    { id: 'PL9FGpbhGjjHFG8sEIM14NtzApLxHMM-nU', container: 'video-list-2' }
  ];
  const maxResults = 5; // Numărul de videoclipuri per playlist

  playlists.forEach(({ id, container }) => {
    const apiUrl = `https://www.googleapis.com/youtube/v3/playlistItems?part=snippet&maxResults=${maxResults}&playlistId=${id}&key=${apiKey}`;

    fetch(apiUrl)
      .then(response => response.json())
      .then(data => {
        const videoContainer = document.getElementById(container);
        data.items.forEach(item => {
          const videoId = item.snippet.resourceId.videoId;

          const videoElement = document.createElement('div');
          videoElement.classList.add('carousel-item', 'wider');
          videoElement.innerHTML = `
            <iframe width="300" height="169" src="https://www.youtube.com/embed/${videoId}?modestbranding=1&rel=0&fs=1" frameborder="0" allowfullscreen></iframe>
          `;

          videoContainer.appendChild(videoElement);
        });
      })
      .catch(error => console.error('Eroare:', error));
  });
</script>