class Song {
  constructor(title, artist) {
    this.songElement = this.createSong(title, artist);
  }

  createSong(titleValue, artistValue) {
    const trackContainer = document.createElement('div');
    const artistElement = document.createElement('h4');
    const titleElement = document.createElement('p');
    const songButtonElement = document.createElement('button');

    trackContainer.classList.add('song');
    artistElement.classList.add('song__artist');
    artistElement.textContent = artistValue;
    titleElement.classList.add('song__title');
    titleElement.textContent = titleValue;
    songButtonElement.classList.add('song__like');

    trackContainer.appendChild(artistElement);
    trackContainer.appendChild(titleElement);
    trackContainer.appendChild(songButtonElement);

    return trackContainer;
  }
}

/* Переменные */

const songsContainer = document.querySelector('.songs-container');
const addButton = document.querySelector('.input__btn_add');
const resetButton = document.querySelector('.input__btn_reset');
const coverHeading = document.querySelector('.cover__heading');
const form = document.forms.add;

/* Функции */

// Перерисовывает блок добавленных песен
function renderAdded() {
  const songs = document.querySelectorAll('.song');
  const noSongsElement = document.querySelector('.no-songs');

  if (songs.length === 0) {
    noSongsElement.classList.remove('no-songs_hidden');
  } else {
    noSongsElement.classList.add('no-songs_hidden');
  }
}

// Создаёт элемент песни и возвращает его
function createSong(titleValue, artistValue) {
  const trackContainer = document.createElement('div');
  const artistElement = document.createElement('h4');
  const titleElement = document.createElement('p');
  const songButtonElement = document.createElement('button');

  trackContainer.classList.add('song');
  artistElement.classList.add('song__artist');
  artistElement.textContent = artistValue;
  titleElement.classList.add('song__title');
  titleElement.textContent = titleValue;
  songButtonElement.classList.add('song__like');

  trackContainer.appendChild(artistElement);
  trackContainer.appendChild(titleElement);
  trackContainer.appendChild(songButtonElement);

  return trackContainer;
}

// Добавляет элемент песни
function addSong() {
  const title = form.elements.title;
  const artist = form.elements.artist;
  const song = createSong(title.value, artist.value);

  songsContainer.appendChild(song);
  renderAdded();
}

// Обработчик клика по кнопке «Очистить плейлист»
function resetPlaylist() {
  songsContainer.innerHTML = '';
  renderAdded();
}

function likeHandler(event) {
  if (event.target.classList.contains('song__like')) {
    event.target.classList.toggle('song__like_active');
  }
}

/* Слушатели событий */

form.addEventListener('submit', function (event) {
  event.preventDefault();

  addSong();

  form.reset();
});

resetButton.addEventListener('click', function () {
  resetPlaylist();
});

songsContainer.addEventListener('click', likeHandler);

/* Вызовы функций */

renderAdded();