dodanie warstwy deszczu, cytatow
This commit is contained in:
@ -91,6 +91,7 @@
|
|||||||
<header>
|
<header>
|
||||||
<h1>🌦️ Pogoda Web</h1>
|
<h1>🌦️ Pogoda Web</h1>
|
||||||
<p>Kliknij na mapie lub wyszukaj miasto, aby zobaczyć prognozę pogody</p>
|
<p>Kliknij na mapie lub wyszukaj miasto, aby zobaczyć prognozę pogody</p>
|
||||||
|
<div id="quote" style="margin-top: 1em; font-style: italic; font-size: 1.1em;"></div>
|
||||||
</header>
|
</header>
|
||||||
<main>
|
<main>
|
||||||
<div id="controls">
|
<div id="controls">
|
||||||
@ -105,12 +106,56 @@
|
|||||||
|
|
||||||
<script src="https://unpkg.com/leaflet/dist/leaflet.js" loading="lazy"></script>
|
<script src="https://unpkg.com/leaflet/dist/leaflet.js" loading="lazy"></script>
|
||||||
<script>
|
<script>
|
||||||
|
const weatherQuotes = [
|
||||||
|
"Ale nie do nas należy panowanie nad wszystkimi erami tego świata; my mamy za zadanie zrobić, co w naszej mocy, dla epoki, w której żyjemy, wytrzebić zło ze znanego nam pola, aby przekazać następcom rolę czystą, gotową do uprawy. Jaka im będzie sprzyjała pogoda, to już nie nasza rzecz.",
|
||||||
|
"Czyli do czego to służy? - nadal nie rozumiałam. - Niszczy wszystko, całe życie - złowieszczy głos Zafkiela potoczył się po pomieszczeniu. - TO KATAKLIZM, KATAKLIZM, KATAKLIZM! I oto dowód na to, co się dzieje, kiedy ktoś przez kilka miliardów lat włącza i wyłącza deszcz. Zdecydowanie nie polecam tego zawodu.",
|
||||||
|
"– Jesteś dobrym człowiekiem. – ...na złą pogodę.",
|
||||||
|
"Nie ma złej pogody, jest tylko złe ubranie!",
|
||||||
|
"Pomyślmy. Dziś mamy środę, a że to mój dzień, nazywaj mnie Wednesday, Panem Wednesday. Choć, zważywszy na pogodę, równie dobrze mógłbym nazywać się Thursday.",
|
||||||
|
"Nie jestem ja rządcą pogody i nie jest nim żadna istota dwunożna.",
|
||||||
|
"– (...) Proszę spojrzeć przez okno. I powiedzieć, co pan widzi. – Mgłę — odparł najwyższy kapłan. Vetinari westchnął. Czasami pogoda zupełnie nie miała wyczucia konwencji narracyjnej.",
|
||||||
|
"Czasem kluczem do sukcesu było właśnie cierpliwe wyczekiwanie. Jeśli pogoda ci nie odpowiada, nie pakujesz się w sam środek burzy, tylko czekasz, aż burza minie. Po co niepotrzebnie moknąć?",
|
||||||
|
"Internetowe wyzwiska znikają jak pogoda. Do nienawiści w małżeństwie trzeba się przyłożyć. Jest szczera.",
|
||||||
|
"Zima nie umiera. Nie tak jak umierają ludzie. Trzyma się późnych przymrozków, zapachu jesieni w letnie wieczory, a w czasie upałów ucieka w góry.",
|
||||||
|
"Historia ludzkości to w siedemdziesięciu trzech procentach rozmowy o pogodzie wyrażające prawdziwy strach."
|
||||||
|
];
|
||||||
|
|
||||||
|
|
||||||
|
function getRandomQuote() {
|
||||||
|
const index = Math.floor(Math.random() * weatherQuotes.length);
|
||||||
|
return weatherQuotes[index];
|
||||||
|
}
|
||||||
|
|
||||||
const map = L.map('map').setView([52.237, 21.017], 6);
|
const map = L.map('map').setView([52.237, 21.017], 6);
|
||||||
let marker = null;
|
let marker = null;
|
||||||
let currentPlaceName = null;
|
let currentPlaceName = null;
|
||||||
|
|
||||||
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18 }).addTo(map);
|
L.tileLayer('https://{s}.tile.openstreetmap.org/{z}/{x}/{y}.png', { maxZoom: 18 }).addTo(map);
|
||||||
|
|
||||||
|
const rainLayer = L.tileLayer('', {
|
||||||
|
opacity: 0.6,
|
||||||
|
zIndex: 100,
|
||||||
|
attribution: 'Dane radarowe: RainViewer.com'
|
||||||
|
});
|
||||||
|
|
||||||
|
async function updateRainLayer() {
|
||||||
|
try {
|
||||||
|
const res = await fetch('https://api.rainviewer.com/public/weather-maps.json');
|
||||||
|
const data = await res.json();
|
||||||
|
const timestamps = data.radar.past;
|
||||||
|
if (!timestamps.length) return;
|
||||||
|
|
||||||
|
const latestTime = timestamps[timestamps.length - 1];
|
||||||
|
const tileUrl = `https://tilecache.rainviewer.com/v2/radar/${latestTime}/256/{z}/{x}/{y}/2/1_1.png`;
|
||||||
|
|
||||||
|
rainLayer.setUrl(tileUrl);
|
||||||
|
map.addLayer(rainLayer);
|
||||||
|
} catch (err) {
|
||||||
|
console.error("Błąd pobierania warstwy deszczu:", err);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
|
||||||
async function fetchWithTimeout(resource, options = {}) {
|
async function fetchWithTimeout(resource, options = {}) {
|
||||||
const controller = new AbortController();
|
const controller = new AbortController();
|
||||||
const timeout = setTimeout(() => controller.abort(), 8000);
|
const timeout = setTimeout(() => controller.abort(), 8000);
|
||||||
@ -224,6 +269,8 @@ Czas pomiaru: ${current.time ? new Date(current.time).toLocaleString() : 'brak d
|
|||||||
}
|
}
|
||||||
|
|
||||||
updateResult(resultText.trim());
|
updateResult(resultText.trim());
|
||||||
|
const quote = getRandomQuote();
|
||||||
|
document.getElementById('quote').innerText = `Cytat dnia:\n"${quote}"`;
|
||||||
drawDailyChart(daily);
|
drawDailyChart(daily);
|
||||||
drawHourlyChart(hourly);
|
drawHourlyChart(hourly);
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
@ -350,7 +397,7 @@ Czas pomiaru: ${current.time ? new Date(current.time).toLocaleString() : 'brak d
|
|||||||
window.addEventListener('load', () => {
|
window.addEventListener('load', () => {
|
||||||
getUserLocation();
|
getUserLocation();
|
||||||
});
|
});
|
||||||
|
updateRainLayer();
|
||||||
</script>
|
</script>
|
||||||
</body>
|
</body>
|
||||||
</html>
|
</html>
|
||||||
|
Reference in New Issue
Block a user