Error: {error}

;\n if (!weatherData) return

;\n\n const densityAltitude = calculateDensityAltitude(\n weatherData.elevation,\n weatherData.temperature,\n weatherData.pressure,\n );\n\n return (\n

Current Weather - {weatherData.stationName}

Conditions

\n Temperature:\n {weatherData.temperature}\n °F\n Humidity:\n {weatherData.humidity}\n %\n Dewpoint:\n {weatherData.dewpoint}\n °F\n Pressure:\n {weatherData.pressure}\n inHg\n

Wind

\n Wind Speed:\n {weatherData.windSpeed}\n mph\n Direction:\n {weatherData.windDirection}\n °\n Wind Gust:\n {weatherData.windGust}\n mph\n

Rain

\n Daily:\n {weatherData.rainDaily}\n in\n Month:\n {weatherData.rainMonthly}\n in\n Rainfall Rate:\n {weatherData.rainRate}\n in/hr\n

Altitude

\n Station Elevation:\n {weatherData.elevation.toLocaleString()}\n ft\n Density Altitude:\n {densityAltitude.toLocaleString()}\n ft\n

Last Updated: {weatherData.observationTime}

Last Checked: {lastChecked.toLocaleString()}

\n View Source\n

\n );\n}\n\nfunction client() {\n createRoot(document.getElementById(\"root\")).render();\n}\n\nif (typeof document !== \"undefined\") { client(); }\n\nasync function server(request: Request): Promise {\n const url = new URL(request.url);\n const stationId = url.searchParams.get(\"stationId\");\n\n if (!stationId) {\n return new Response(\n `\n \n \n Weather Station ID Required\n \n \n \n \n

Weather Station ID Required

Please provide a Weather Underground station ID in the URL.

Example: ${url.origin}/?stationId=KCASANFR49

You can find station IDs on the Weather Underground WunderMap.

\n \n \n `,\n {\n headers: { \"Content-Type\": \"text/html\" },\n },\n );\n }\n\n if (url.pathname === \"/api/weather\") {\n try {\n const wundergroundResponse = await fetch(\n `https://api.weather.com/v2/pws/observations/current?stationId=${stationId}&format=json&units=e&apiKey=e1f10a1e78da46f5b10a1e78da96f525`,\n );\n const wundergroundData = await wundergroundResponse.json();\n\n if (!wundergroundData.observations || wundergroundData.observations.length === 0)\n throw new Error(\"No data available for this station\");\n\n const simplifiedData = {\n temperature: wundergroundData.observations[0].imperial.temp,\n humidity: wundergroundData.observations[0].humidity,\n dewpoint: wundergroundData.observations[0].imperial.dewpt,\n windSpeed: wundergroundData.observations[0].imperial.windSpeed,\n windDirection: wundergroundData.observations[0].winddir,\n windGust: wundergroundData.observations[0].imperial.windGust,\n rainDaily: wundergroundData.observations[0].imperial.precipTotal,\n rainMonthly: wundergroundData.observations[0].imperial.precipTotal,\n rainRate: wundergroundData.observations[0].imperial.precipRate,\n pressure: wundergroundData.observations[0].imperial.pressure,\n elevation: wundergroundData.observations[0].imperial.elev,\n observationTime: new Date(wundergroundData.observations[0].obsTimeLocal).toLocaleString(),\n stationId: stationId,\n stationName: wundergroundData.observations[0].neighborhood || stationId,\n };\n\n return new Response(JSON.stringify(simplifiedData), {\n headers: { \"Content-Type\": \"application/json\" },\n });\n } catch (error) {\n return new Response(JSON.stringify({ error: \"Failed to fetch weather data\" }), {\n status: 400,\n headers: { \"Content-Type\": \"application/json\" },\n });\n }\n }\n\n return new Response(\n `\n \n \n Weather Display\n \n \n \n \n

\n \n \n \n `,\n {\n headers: {\n \"content-type\": \"text/html\",\n },\n },\n );\n}\n\nconst css = `\nbody {\n font-family: Arial, sans-serif;\n display: flex;\n justify-content: center;\n align-items: center;\n min-height: 100vh;\n margin: 0;\n background-color: #333333;\n}\n\n.weather-display {\n background-color: white;\n padding: 20px;\n border-radius: 10px;\n box-shadow: 0 0 10px rgba(0,0,0,0.1);\n text-align: center;\n background-color: #444444;\n}\n\n.weather-tiles {\n display: flex;\n flex-wrap: wrap;\n justify-content: center;\n gap: 20px;\n margin-top: 20px;\n}\n\n.tile {\n background-color: #f8f8f8;\n border-radius: 8px;\n padding: 15px;\n width: 220px;\n box-shadow: 0 2px 4px rgba(0,0,0,0.1);\n}\n\n.tile h2 {\n margin-top: 0;\n margin-bottom: 10px;\n font-size: 1.2em;\n color: #333;\n}\n\n.tile-content {\n display: grid;\n grid-template-columns: 2fr 1fr auto;\n gap: 5px;\n}\n\n.tile-content span:nth-child(3n+1) {\n text-align: left;\n}\n\n.tile-content span:nth-child(3n+2) {\n text-align: right;\n}\n\n.tile-content span:nth-child(3n) {\n text-align: left;\n padding-left: 2px;\n}\n\nh1 {\n color: #333;\n font-size: 1.5em;\n color: #f0f0f0;\n}\n\n.error {\n color: red;\n font-weight: bold;\n text-align: center;\n}\n\np {\n margin: 10px 0;\n}\n\n.update-time, .check-time {\n margin-top: 10px;\n font-style: italic;\n color: #f0f0f0;\n}\n`;\n\nexport default server;",["D",1726101055942],"version",32,"currentUserHasLiked","referenceCount","dependencyCount","commentCount","prCount","mergedPr",{"_96":97,"_101":102},"forkedVal",{"_94":154,"_96":97,"_127":155,"_143":156,"_157":-5},"d8415cb6-708a-11ef-9e63-de64eea55b61","WundergroundStationDisplay",40,"prDisabledHint","interval","description","For reasons I don't fully understand, this doesn't always work properly in the val.town preview, however if you use the endpoint in a browser it should be fine. Wunderground stationId are ALL CAPS.","latestEvaluation","slug","Croniac/WundergroundStationDisplayV2","versions",[166,170,174,178,182,186,190,194,198,202],{"_98":167,"_143":144,"_168":169},["D",1726101055942],"n","1",{"_98":171,"_143":172,"_168":173},["D",1726100950895],31,"2",{"_98":175,"_143":176,"_168":177},["D",1726100877977],30,"3",{"_98":179,"_143":180,"_168":181},["D",1726100766295],29,"4",{"_98":183,"_143":184,"_168":185},["D",1726100618919],28,"5",{"_98":187,"_143":188,"_168":189},["D",1726100537435],27,"6",{"_98":191,"_143":192,"_168":193},["D",1726100478119],26,"7",{"_98":195,"_143":196,"_168":197},["D",1726100375500],25,"8",{"_98":199,"_143":200,"_168":201},["D",1726100281478],24,"9",{"_98":203,"_143":204,"_168":205},["D",1726100278647],23,"10","hasNext","routes/_app","actionData","errors"]