+
${post.titolo}
+
${post.contenuto}
+
+ 📅 ${post.data}
+ ❤️ ${post.likes} likes
+
+
+
⏳ Caricamento meteo...
diff --git a/javascript/JS_Esercizi 11 - API/05_meteo/script.js b/javascript/JS_Esercizi 11 - API/extra_meteo/script.js
similarity index 52%
rename from javascript/JS_Esercizi 11 - API/05_meteo/script.js
rename to javascript/JS_Esercizi 11 - API/extra_meteo/script.js
index d16ffa1..6bb08bb 100644
--- a/javascript/JS_Esercizi 11 - API/05_meteo/script.js
+++ b/javascript/JS_Esercizi 11 - API/extra_meteo/script.js
@@ -7,55 +7,101 @@
* API Base: https://api.open-meteo.com/v1/forecast
*/
+// ===== VARIABILI DEL DOM =====
+const latitude = document.getElementById('latitude');
+const longitude = document.getElementById('longitude');
+const btnSearch = document.getElementById('btnSearch');
+const loading = document.getElementById('loading');
+const weatherContainer = document.getElementById('weatherContainer');
+
+
/**
- * Ricerca il meteo per latitudine e longitudine
+ * FUNZIONE: Gestione errori
*
- * Parametri obbligatori:
+ * Mostra un messaggio di errore e logga in console
+ */
+function handleError(message) {
+ weatherContainer.innerHTML = `
+
+ ❌ ${message}
+
+ `;
+ console.error('Errore:', message);
+}
+
+
+/**
+ * FUNZIONE: Ricerca il meteo per latitudine e longitudine
+ *
+ * Parametri obbligatori dell'API:
* - latitude: numero decimale
* - longitude: numero decimale
* - current: variabili da ottenere (separati da virgola)
* - timezone: 'auto' oppure fuso orario specifico
+ *
+ * Passi:
+ * 1. Leggi latitudine e longitudine dagli input
+ * 2. Valida che siano compilati
+ * 3. Mostra lo spinner di caricamento
+ * 4. Costruisci l'URL con i parametri corretti
+ * 5. Fai una GET a https://api.open-meteo.com/v1/forecast
+ * 6. Se non OK, mostra errore e return
+ * 7. Converti in JSON
+ * 8. Estrai data.current
+ * 9. Chiama displayWeather() per visualizzare
+ * 10. Nascondi lo spinner
*/
async function searchWeather() {
- const latitude = document.getElementById('latitude').value;
- const longitude = document.getElementById('longitude').value;
- const loading = document.getElementById('loading');
- const container = document.getElementById('weatherContainer');
+ const lat = latitude.value;
+ const lon = longitude.value;
// VALIDAZIONE
- if (!latitude || !longitude) {
- container.innerHTML = '
❌ Inserisci latitudine e longitudine
';
+ if (!lat || !lon) {
+ handleError('Inserisci latitudine e longitudine');
return;
}
- loading.style.display = 'block';
- container.innerHTML = '';
+ loading.classList.remove('nascosto');
+ weatherContainer.innerHTML = '';
try {
// 👇 SCRIVI QUI IL TUO CODICE 👇
- // Costruisci l'URL con i parametri corretti:
- // const url = 'https://api.open-meteo.com/v1/forecast?latitude=' + ...
+ // 1. Costruisci l'URL con i parametri corretti:
+ // const url = 'https://api.open-meteo.com/v1/forecast' +
+ // '?latitude=' + lat +
+ // '&longitude=' + lon +
+ // '¤t=temperature_2m,relative_humidity_2m,weather_code' +
+ // '&timezone=auto';
+
+ // 2. Fai la fetch
// const response = await fetch(url);
+
+ // 3. Se non OK, mostra errore e return
+ // if (!response.ok) {
+ // throw new Error('Errore nel caricamento dei dati meteo');
+ // }
+
+ // 4. Converti in JSON
// const data = await response.json();
- // displayWeather(data.current, latitude, longitude);
+
+ // 5. Estrai i dati meteo e visualizza
+ // displayWeather(data.current, lat, lon);
throw new Error('Codice non implementato - Completa searchWeather()');
} catch (error) {
- container.innerHTML = `
❌ ${error.message}
`;
- console.error('Errore:', error);
+ handleError(error.message);
} finally {
- loading.style.display = 'none';
+ loading.classList.add('nascosto');
}
}
/**
- * Visualizza i dati meteo
- * (Questa funzione è già fatta)
+ * FUNZIONE: Visualizza i dati meteo
+ * (Questa funzione è già fatta - non modificare)
*/
function displayWeather(current, lat, lon) {
- const container = document.getElementById('weatherContainer');
// Converti codice meteo in descrizione
const weatherDescriptions = {
@@ -95,17 +141,17 @@ function displayWeather(current, lat, lon) {
+
⏳ Cercando Pokémon...
diff --git a/javascript/JS_Esercizi 11 - API/06_pokedex/script.js b/javascript/JS_Esercizi 11 - API/extra_pokedex/script.js
similarity index 58%
rename from javascript/JS_Esercizi 11 - API/06_pokedex/script.js
rename to javascript/JS_Esercizi 11 - API/extra_pokedex/script.js
index dd8bc3d..522fabd 100644
--- a/javascript/JS_Esercizi 11 - API/06_pokedex/script.js
+++ b/javascript/JS_Esercizi 11 - API/extra_pokedex/script.js
@@ -7,60 +7,89 @@
* API Base: https://pokeapi.co/api/v2/
*/
+// ===== VARIABILI DEL DOM =====
+const pokemonInput = document.getElementById('pokemonInput');
+const btnSearch = document.getElementById('btnSearch');
+const loading = document.getElementById('loading');
+const pokemonContainer = document.getElementById('pokemonContainer');
+
+
/**
- * Ricerca un Pokémon per nome o numero
+ * FUNZIONE: Gestione errori
+ *
+ * Mostra un messaggio di errore e logga in console
+ */
+function handleError(message) {
+ pokemonContainer.innerHTML = `
+
+ ❌ ${message}
+
+ `;
+ console.error('Errore:', message);
+}
+
+
+/**
+ * FUNZIONE: Ricerca un Pokémon per nome o numero
*
* Parametri:
* - Accetta nome (in minuscolo) o numero ID
* - Ritorna oggetto con tutte le info del Pokémon
+ *
+ * Passi:
+ * 1. Leggi il valore dall'input
+ * 2. Converti a minuscolo e trim()
+ * 3. Valida che non sia vuoto
+ * 4. Mostra lo spinner di caricamento
+ * 5. Fai una GET a https://pokeapi.co/api/v2/pokemon/{input}
+ * 6. Se la risposta non è OK (404), mostra "Pokémon non trovato" e return
+ * 7. Converti in JSON
+ * 8. Chiama displayPokemon() per visualizzare
+ * 9. Nascondi lo spinner
*/
async function searchPokemon() {
- const input = document.getElementById('pokemonInput').value.trim().toLowerCase();
- const loading = document.getElementById('loading');
- const container = document.getElementById('pokemonContainer');
+ const input = pokemonInput.value.trim().toLowerCase();
// VALIDAZIONE
if (!input) {
- container.innerHTML = '
❌ Inserisci il nome o numero di un Pokémon
';
+ handleError('Inserisci il nome o numero di un Pokémon');
return;
}
- loading.style.display = 'block';
- container.innerHTML = '';
+ loading.classList.remove('nascosto');
+ pokemonContainer.innerHTML = '';
try {
// 👇 SCRIVI QUI IL TUO CODICE 👇
- // Fai una fetch GET a: https://pokeapi.co/api/v2/pokemon/ + input
+ // 1. Fai una fetch GET a: https://pokeapi.co/api/v2/pokemon/ + input
// const response = await fetch('https://pokeapi.co/api/v2/pokemon/' + input);
- // Controlla se la risposta è OK (non 404)
+ // 2. Controlla se la risposta è OK (non 404)
// if (!response.ok) {
// throw new Error('Pokémon non trovato');
// }
- // Converti in JSON
+ // 3. Converti in JSON
// const pokemon = await response.json();
- // Visualizza
+ // 4. Visualizza
// displayPokemon(pokemon);
throw new Error('Codice non implementato - Completa searchPokemon()');
} catch (error) {
- container.innerHTML = `
❌ ${error.message}
`;
- console.error('Errore:', error);
+ handleError(error.message);
} finally {
- loading.style.display = 'none';
+ loading.classList.add('nascosto');
}
}
/**
- * Visualizza le informazioni del Pokémon
- * (Questa funzione è già fatta)
+ * FUNZIONE: Visualizza le informazioni del Pokémon
+ * (Questa funzione è già fatta - non modificare)
*/
function displayPokemon(pokemon) {
- const container = document.getElementById('pokemonContainer');
// ESTRAI I DATI
const name = pokemon.name.charAt(0).toUpperCase() + pokemon.name.slice(1);
@@ -101,14 +130,14 @@ function displayPokemon(pokemon) {
+
+