analytics question mark

index.html

@@ -57,7 +57,62 @@
 		<!-- <script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-3415518411898563" crossorigin="anonymous"></script> -->
 		<script>
 			let currentPanic = {key: "", url: ""};
+			const weatherCodeToEmoji = {
+			    0: '☀️',
+						
+			    1: '🌤️',
+			    2: '⛅',
+			    3: '☁️',
+						
+			    45: '🌫️',
+			    48: '🌫️',
+						
+			    51: '🌦️',
+			    53: '🌧️',
+			    55: '🌧️',
+			    56: '🌧️',
+			    57: '🌧️',
+						
+			    61: '🌧️',
+			    63: '🌧️',
+			    65: '🌧️',
+			    66: '🥶🌧️',
+			    67: '🥶🌧️',
+						
+			    71: '❄️',
+			    73: '❄️',
+			    75: '❄️',
+			    77: '🌨️',
+						
+			    80: '🌧️',
+			    81: '🌧️',
+			    82: '🌧️',
+						
+			    85: '🌨️',
+			    86: '🌨️',
+						
+			    95: '⛈️',
+			    96: '⛈️',
+			    99: '⛈️',
+			};
+
+			async function getWeather() {
+				// we do not store this data :)
+            	let locationData = await fetch("https://speed.cloudflare.com/meta")
+            	.then(data => data.json());
+
+            	let weatherData = await fetch(`https://api.open-meteo.com/v1/forecast?latitude=${locationData.latitude}&longitude=${locationData.longitude}&current=temperature_2m,weather_code&temperature_unit=fahrenheit`)
+            	.then(data => data.json());
+
+				document.getElementById("weather").innerText = `${Math.round(weatherData["current"]["temperature_2m"])}°C ${weatherCodeToEmoji[weatherData["current"]["weather_code"]]}`
+			}
+			function updateTime() {
+				document.getElementById("time").innerText = (new Date()).toLocaleTimeString();
+			}
 			document.addEventListener("DOMContentLoaded", async ()=>{
+				getWeather();
+				setInterval(getWeather, 1000 * 60 * 30);
+				setInterval(updateTime, 1000 / 2);
 				let hash = location.hash.substring(1);
 				if(hash) {
 					// location.hash = "";
@@ -191,7 +246,11 @@
         </sidebar>
 		<div id="open-bottom-menu"></div>
 		<div id="bottom-menu">
-			<div class="bottom-item"><p id="online">yap yap yap</p></div>
+			<div class="bottom-item"><p id="online">currently online: --</p></div>
+			<div class="bottom-item"><p>|</p></div>
+			<div class="bottom-item"><p id="weather">--° 🌩️</p></div>
+			<div class="bottom-item"><p>|</p></div>
+			<div class="bottom-item"><p id="time">7:41:21 pm</p></div>
 		</div>
 	</body>
 </html>