diff --git a/28_openweathermap/index.html b/28_openweathermap/index.html new file mode 100644 index 0000000..434ca1f --- /dev/null +++ b/28_openweathermap/index.html @@ -0,0 +1,20 @@ + + +
+ + +Zadej název města a zjisti aktuální počasí
+ + + + + + + + + + \ No newline at end of file diff --git a/28_openweathermap/script.js b/28_openweathermap/script.js new file mode 100644 index 0000000..762e6c5 --- /dev/null +++ b/28_openweathermap/script.js @@ -0,0 +1,55 @@ +// Api klíč naleznete na https://home.openweathermap.org/api_keys +const API_KLIC = "f70d944f638a7ae77de89435d4d23c01" + +async function zjistiPocasi() { + let mesto = document.getElementById("mestoInput").value.trim(); + if (mesto == ""){ + document.getElementById("chyba").textContent = "Zadej název města!" + return + } + document.getElementById("chyba").textContent = ""; + document.getElementById("vysledek").innerHTML = "Načítám....
"; + try { + await fetchPocasi(mesto); + } catch (error) { + document.getElementById("chyba").textContent = error.message; + document.getElementById("vysledek").innerHTML = ""; + } +} + +async function fetchPocasi(mesto) { + let url = "https://api.openweathermap.org/data/2.5/weather" + + "?q=" + mesto + + "&appid=" + API_KLIC + + "&units=metric" + + "&lang=cz"; + let response = await fetch(url); + if (!response.ok) { + throw new Error("Město nenalezno! Zkontroluj název"); + } + let data = await response.json(); + console.log(data) + zobrazPocasi(data); +} + +function zobrazPocasi(data) { + let vysledek = document.getElementById("vysledek"); + let ikonaURL = "https://openweathermap.org/img/wn/" + + data.weather[0].icon + "@2x.png"; + vysledek.innerHTML = ` +Pocasi: ${data.weather[0].description}
+Teplota: ${data.main.temp}°C
+Pocitová Teplota: ${Math.round(data.main.feels_like)}°C
+Vlhkost: ${data.main.humidity}%
+Vítr: ${data.wind.speed} m/s
+ `; + +} +document.getElementById("btnHledej").addEventListener("click",zjistiPocasi); +document.getElementById("mestoInput").addEventListener("keypress",function(e){ + if(e.key === "Enter"){ + zjistiPocasi(); + } +}); \ No newline at end of file