diff --git a/index.html b/index.html index c975a59..c1df308 100644 --- a/index.html +++ b/index.html @@ -9,7 +9,7 @@

Lista de libros

- +
@@ -31,6 +31,6 @@

- + diff --git a/script.js b/script.js index 234668b..46a9dd1 100644 --- a/script.js +++ b/script.js @@ -1,14 +1,77 @@ -let libros = [ - { titulo: "El Aleph", anio: 1949, puntaje: 10, autor: "Borges, Jorge Luis" }, - { titulo: "Rayuela", anio: 1963, puntaje: 9 , autor: "Cortázar, Julio" }, - { titulo: "Dailan Kifki", anio: 1966, puntaje: 8, autor: "Walsh, María Elena" }, - { titulo: "La inquietud del rosal", anio: 1916, puntaje: 8, autor: "Alfonsina Storni" }, +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" }, ]; -function mostrarTabla(datos) { - // Escribir esta función para resolver el punto 1. +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; + } -// Invocamos la función al inicio para poblar la tabla con los datos del array -mostrarTabla(libros); + 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 = ""; +}) + +document.getElementById('searchBar').addEventListener('input', (e) => { + const query = e.target.value.toLowerCase(); + + const filtered = books.filter((book) => + book.tittle.toLowerCase().includes(query) || book.author.toLowerCase().includes(query) + ) + + renderTable(filtered); +}) + +renderTable(books); \ No newline at end of file