let books = [
    { tittle: "El Aleph", year: 1949, score: 10, author: "Borges, Jorge Luis" },
    { tittle: "Rayuela", year: 1963, score: 9 , author: "Cortázar, Julio" },
    { tittle: "Dailan Kifki", year: 1966, score: 8, author: "Walsh, María Elena" },
    { tittle: "La inquietud del rosal", year: 1916, score: 8, author: "Alfonsina Storni" },
];

const renderTable = (books) => {
    const tbody = document.getElementById("datos-libros");
    tbody.replaceChildren();

    for (const book of books) {
        const tr = document.createElement('tr');

        const tdTittle = document.createElement('td');
        tdTittle.textContent = book.tittle;

        const tdAuthor = document.createElement('td');
        tdAuthor.textContent = book.author;

        const tdYear = document.createElement('td');
        tdYear.textContent = book.year;

        const tdScore = document.createElement('td');
        tdScore.textContent = book.score;

        tr.appendChild(tdTittle);
        tr.appendChild(tdAuthor);
        tr.appendChild(tdYear);
        tr.appendChild(tdScore);

        tbody.appendChild(tr);
    }    

}
const validateForm = (tittle, author, year, score) => {
    if (!tittle || !author || !year || !score) return false;
    if (year < 0 || score < 0 || score > 10) return false;
    return true;
}

const addBook = (tittle, author, year, score) => {
    if(!validateForm(tittle, author, year, score)) {
        alert('Datos invalidos');
        return;
    }

    books.push({tittle: tittle, year: Number(year), score: Number(score), author: author});
    renderTable(books);
}

document.getElementById('boton-agregar').addEventListener('click', () => {

    const tittle = document.getElementById('titulo').value;
    const author = document.getElementById('autor').value;
    const year = document.getElementById('anio').value;
    const score = document.getElementById('calificacion').value;

    addBook(tittle, author, year, score);

    document.getElementById('titulo').value = "";
    document.getElementById('autor').value = "";
    document.getElementById('anio').value = "";
    document.getElementById('calificacion').value = "";
})


renderTable(books);