From fb836b3113a273175fabe61e6d56226377e37b5a Mon Sep 17 00:00:00 2001 From: Berack96 Date: Mon, 16 Feb 2026 23:22:49 +0100 Subject: [PATCH] fix api --- .../11_API/01_get_singolo_utente/script.js | 2 +- javascript/11_API/05_todo_app_crud/script.js | 51 ++++++++++++++----- javascript/11_API/tutorial/script.js | 5 +- 3 files changed, 42 insertions(+), 16 deletions(-) diff --git a/javascript/11_API/01_get_singolo_utente/script.js b/javascript/11_API/01_get_singolo_utente/script.js index 0c1091d..aa5108a 100644 --- a/javascript/11_API/01_get_singolo_utente/script.js +++ b/javascript/11_API/01_get_singolo_utente/script.js @@ -84,7 +84,7 @@ function handleError(message) { * 5. Fai una fetch GET a /users/{id} * 6. Se la risposta non è OK, usa handleError() per mostrare un messaggio e return * 7. Converti la risposta in JSON - * 8. Mostra i dati dell'utente chiamando createUserCard(user) + * 8. Mostra i dati dell'utente chiamando creaCardUtente(user) * 9. Nascondi lo spinner di caricamento (aggiungi la classe nascosto) */ async function fetchUser() { diff --git a/javascript/11_API/05_todo_app_crud/script.js b/javascript/11_API/05_todo_app_crud/script.js index 069e101..65d6fc1 100644 --- a/javascript/11_API/05_todo_app_crud/script.js +++ b/javascript/11_API/05_todo_app_crud/script.js @@ -13,17 +13,11 @@ const loading = document.querySelector('#loading'); const counter = document.querySelector('#counter'); -// ===== VARIABILE DI STATO ===== -// Tiene traccia dell'ID utente attualmente caricato -// Viene usata per sapere a quale utente associare i nuovi TODO -// DA COMPLETARE: Carica questa variabile dal localStorage (se presente) -let currentUserId = null; - /** * FUNZIONE: Crea la card HTML per tutti i TODO passati come parametro */ -function creaCardTodos(todoList) { +function creaCardsTodos(todoList) { allTodos = todoList.map((todo) => `
@@ -67,8 +61,18 @@ function handleError(message) { * 2. addTodo() - POST /todos (CREATE) * 3. toggleTodo() - PUT /todos/{id} (UPDATE) * 4. deleteTodo() - DELETE /todos/{id} (DELETE) + * + * BONUS (OPZIONALE): Persistenza con localStorage + * Se hai completato tutte le funzioni, puoi aggiungere la persistenza dell'utente: + * - Quando carichi i TODO, salva l'ID utente nel localStorage + * - Al caricamento della pagina, recupera l'ID dal localStorage + * - Pre-compila l'input e carica automaticamente i TODO se presente */ +// ===== VARIABILE DI STATO ===== +let currentUserId = null; // Variabile globale per tenere traccia dell'ID utente corrente + + /** * FUNZIONE 1️⃣: Carica TODO (GET) * @@ -82,7 +86,7 @@ function handleError(message) { * 7. Converti la risposta in JSON * 8. Chiama displayTodos() per visualizzare * 9. Nascondi lo spinner e mostra addTodoSection - * 10. Salva l'ID utente in currentUserId (e localStorage) + * 10. Salva l'ID utente in currentUserId */ async function fetchTodosUtente() { // TODO Rimuovi questa riga e completa la funzione @@ -94,7 +98,8 @@ async function fetchTodosUtente() { * FUNZIONE 2️⃣: Aggiungi TODO (POST) * * Passi: - * 1. Verifica che un utente sia stato caricato (currentUserId) + * 1. Verifica che un utente sia stato caricato (currentUserId !== null) + * Altrimenti, mostra errore "Carica prima un utente!" e return * 2. Leggi il testo dal campo di input del nuovo TODO * 3. Valida con trim che non sia vuoto * 4. Mostra lo spinner di caricamento @@ -135,6 +140,30 @@ async function deleteTodo(id) { } +/** + * ========================================== + * BONUS: PERSISTENZA CON LOCALSTORAGE + * ========================================== + * + * Il localStorage permette di salvare dati nel browser che persistono + * anche dopo il refresh della pagina. + * + * OBIETTIVO: Ricordare quale utente era stato caricato l'ultima volta + * + * PASSI DA IMPLEMENTARE: + * + * 1️⃣ SALVATAGGIO (in fetchTodosUtente, al passo 10): Salva l'ID come stringa + * 2️⃣ CARICAMENTO ALL'AVVIO (aggiungi DOPO gli event listener): + * - Recupera l'ID dal localStorage + * - Se esiste, pre-compila l'input e chiama fetchTodosUtente() automaticamente + * + * NOTA: localStorage salva solo stringhe, quindi: + * - Salvare: localStorage.setItem('key', valore) + * - Recuperare: localStorage.getItem('key') + * - Se serve un numero intero: parseInt(localStorage.getItem('key')) + */ + + /** * FUNZIONE: Visualizza i TODO * Funzione già fatta - non modificare @@ -159,9 +188,7 @@ function displayTodos(todos) { `; counter.classList.remove('nascosto'); - // CREA CARD TODO - const todosHTML = todos.map(todo => creaCardTodos(todo)).join(''); - todosContainer.innerHTML = todosHTML; + creaCardsTodos(todos); } // ===== COLLEGA GLI EVENTI ===== diff --git a/javascript/11_API/tutorial/script.js b/javascript/11_API/tutorial/script.js index ccc6a1f..dd07482 100644 --- a/javascript/11_API/tutorial/script.js +++ b/javascript/11_API/tutorial/script.js @@ -14,7 +14,7 @@ async function eseguiTutorial() { * La keyword 'await' serve a dire "Fermati qui finché l'operazione non finisce". */ // Questa funzione simula un server che ci mette 1 secondo a rispondere - // TODO: Aggiungi 'await' prima di wait(2000) per far funzionare l'attesa. + // TODO: Aggiungi 'await' prima di wait(1000) per far funzionare l'attesa. wait(1000); mostraOutput(1, "Operazione completata!"); @@ -93,7 +93,6 @@ async function eseguiTutorial() { const listaUtenti = await responseUtenti.json(); // TODO: Usa .map() o un ciclo for per creare un array contenente SOLO i nomi degli utenti. - // Esempio: const nomi = listaUtenti.map(u => u.name); const soloNomi = []; mostraOutput(6, soloNomi); @@ -123,7 +122,7 @@ async function eseguiTutorial() { // Aggiungi method: 'POST' // Aggiungi headers: { 'Content-Type': 'application/json' } // Aggiungi body: JSON.stringify(nuovoUtente) - const rispInvio = await fetch(`${urlBase}/posts`, { + const rispInvio = await fetch(`${urlBase}/users`, { });