import { getMovies } from './model.js';

const searchInput = document.getElementById('searchInput');
const searchBtn = document.getElementById('searchBtn');
const movieList = document.getElementById('movie-list');

async function search(searchMovie) {
  if (searchMovie.trim() === '') {
    return;
  }
  
  const movies = await getMovies(searchMovie);
  renderMovies(movies);
}

function renderMovies(movies) {
  movieList.innerHTML = '';
  if (movies.length === 0) {
    movieList.innerHTML = '<p>Aucun film trouvé.</p>';
    return;
  }

  movies.forEach(movie => {
    const movieCard = document.createElement('div');
    movieCard.classList.add('movie-card');
    movieCard.innerHTML = `
      <h3>${movie.Title} (${movie.Year})</h3>
      <img src="${movie.Poster !== 'N/A' ? movie.Poster : 'https://via.placeholder.com/200x300.png?text=Pas+d%27image'}" alt="${movie.Title}">
    `;
    movieList.appendChild(movieCard);
  });
}

searchBtn.addEventListener('click', () => {
  search(searchInput.value);
});

searchInput.addEventListener('keydown', (e) => {
  if (e.key === 'Enter') {
    search(searchInput.value);
  }
});