update 11.*

added new es. moved all the others fixed some problems added db entries
2026-02-11 22:58:42 +01:00
parent ed35f3cfd7
commit 1e3ff291ce
14 changed files with 802 additions and 163 deletions
--- a/API/04_ricerca_post/script.js
+++ b/API/04_ricerca_post/script.js
@@ -0,0 +1,115 @@
+// ⚠️ COMPILARE E CONTROLLARE PRIMA DI INIZIARE ⚠️
+const BASE_URL = 'http://localhost:3000/api';
+const keyword = document.querySelector('#keyword');
+const loading = document.querySelector('#loading');
+const resultsContainer = document.querySelector('#resultsContainer');
+const btnSearch = document.querySelector('#btnSearch');
+
+
+/**
+ * FUNZIONE: Crea la card HTML per un autore e i suoi post trovati
+ * 
+ * Funzione già fatta - non modificare
+ */
+function createAuthorCard(author, posts) {
+    const postsHTML = posts.map(post => `
+        <div class="post-item">
+            <div class="post-title">${post.titolo}</div>
+            <div class="post-preview">${post.contenuto}</div>
+            <div class="post-meta">
+                <span>📅 ${post.data}</span>
+                <span>❤️ ${post.likes} likes</span>
+            </div>
+        </div>
+    `).join('');
+
+    return `
+        <div class="author-section">
+            <div class="author-header">
+                <img src="${author.avatar}" alt="Avatar" class="author-avatar">
+                <div class="author-info">
+                    <h3>${author.nome} ${author.cognome}</h3>
+                    <p>📧 ${author.email}</p>
+                </div>
+            </div>
+            <div class="posts-list">
+                <div style="font-weight: 600; margin-bottom: 10px; color: #333;">
+                    Post trovati (${posts.length})
+                </div>
+                ${postsHTML}
+            </div>
+        </div>
+    `;
+}
+
+
+/**
+ * FUNZIONE: Gestione errori
+ * 
+ * Mostra un messaggio di errore e logga in console
+ * Funzione già fatta - non modificare
+ */
+function handleError(message) {
+    resultsContainer.innerHTML = `
+        <div class="error">
+            <strong>❌ ${message}</strong>
+        </div>
+    `;
+    console.error('Errore:', message);
+}
+
+
+/**
+ * FUNZIONE: Visualizza i risultati della ricerca
+ * 
+ * Raggruppa i post per autore e mostra le card
+ * Funzione già fatta - non modificare
+ */
+function displayResults(results) {
+    if (results.length === 0) {
+        resultsContainer.innerHTML = `
+            <div class="empty">
+                Nessun post trovato con la parola chiave
+            </div>
+        `;
+        return;
+    }
+
+    const cardsHTML = results.map(item => 
+        createAuthorCard(item.author, item.posts)
+    ).join('');
+
+    resultsContainer.innerHTML = cardsHTML;
+}
+
+
+/**
+ * ESERCIZIO 5: Ricerca Post con Autori
+ * 
+ * Devi completare questa funzione:
+ * 1. Leggi la parola chiave dall'input
+ * 2. Valida che non sia vuota (usa trim)
+ * 3. Mostra lo spinner di caricamento
+ * 4. Apri un blocco try/catch
+ * 5. Fai una GET a /posts
+ * 6. Filtra i post dove titolo O contenuto contiene la keyword (case-insensitive)
+ * 7. Se nessun post trovato, usa handleError() e return
+ * 8. Estrai gli ID univoci degli utenti che hanno scritto questi post
+ * 9. Fai una GET a /users
+ * 10. Crea un array di risultati: [{author: userObj, posts: [...]}, ...]
+ *    dove posts sono solo quelli trovati per quell'autore
+ * 11. Chiama displayResults(results)
+ * 12. Gestisci gli errori con handleError()
+ * 13. Nascondi lo spinner di caricamento
+ */
+async function fetchPostsByKeyword() {
+}
+
+
+// COLLEGA IL BOTTONE
+btnSearch.addEventListener('click', fetchPostsByKeyword);
+
+// PERMETTI ENTER
+keyword.addEventListener('keypress', (e) => {
+    if (e.key === 'Enter') fetchPostsByKeyword();
+});