SNOTEL Data Viewer

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_212":213,"_214":215},"routes/_app.x.$handle.$name",{"_96":95,"_32":46,"_104":86,"_27":105,"_13":14,"_106":-5,"_11":107,"_108":109,"_110":111,"_112":113,"_114":115,"_20":-5,"_116":-5,"_117":-5,"_118":25,"_119":120,"_121":58,"_122":-5,"_123":-5,"_124":125},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":-5,"_18":-5},"project",{"_44":45,"_32":46,"_39":47,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":-5,"_54":-5,"_18":55,"_56":31,"_57":58,"_59":58,"_60":-5,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":-5,"_68":-5,"_69":70,"_71":70,"_72":73,"_74":73,"_75":73,"_76":70,"_77":70,"_78":79,"_80":81,"_82":83,"_84":25},"version",7,"changes",[19],"aiChatInfo","userId",{"_20":21,"_22":23,"_24":25,"_26":25,"_27":28,"_29":28},"file",{"_30":31,"_32":33,"_34":35,"_36":38,"_39":40,"_41":14,"_42":43,"_24":25},"previous",{"_30":31,"_32":33,"_34":35,"_36":37},"deleted",false,"deletedHere","path","backend/index.ts","latestPath","fileId","d86c726c-47cf-11f0-b27b-76b3cceeab13","name","index.ts","fileType","http","content","import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport type { SnotelSite, SnotelData, ApiResponse } from \"../shared/types.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\n});\n\n// Serve static files\napp.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Main page\napp.get(\"/\", async c => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\n// API endpoint to get SNOTEL sites\napp.get(\"/api/sites\", async c => {\n try {\n // Fetch sites from AWDB API - using Colorado SNOTEL sites\n const response = await fetch(\n \"https://wcc.sc.egov.usda.gov/awdbRestApi/services/v1/stations?stateCds=CO&networkCds=SNTL&elementCds=SNWD,WTEQ,TOBS&logicalAnd=true\"\n );\n \n if (!response.ok) {\n throw new Error(`API request failed: ${response.status}`);\n }\n \n const data = await response.json();\n \n // Take first 10 stations for demo\n const limitedData = data.slice(0, 10);\n \n // Transform the data to our format\n const sites: SnotelSite[] = limitedData.map((station: any) => ({\n stationId: station.stationId,\n name: station.name,\n state: station.state,\n latitude: station.latitude,\n longitude: station.longitude,\n elevation: station.elevation,\n county: station.countyName,\n huc: station.huc\n }));\n \n const apiResponse: ApiResponse = {\n success: true,\n data: sites\n };\n \n return c.json(apiResponse);\n } catch (error) {\n console.error(\"Error fetching sites:\", error);\n const apiResponse: ApiResponse = {\n success: false,\n error: error instanceof Error ? error.message : \"Unknown error\"\n };\n return c.json(apiResponse, 500);\n }\n});\n\n// API endpoint to get latest data for stations\napp.get(\"/api/data\", async c => {\n try {\n // Get current date and 7 days ago for recent data\n const endDate = new Date();\n const startDate = new Date();\n startDate.setDate(startDate.getDate() - 7);\n \n const formatDate = (date: Date) => date.toISOString().split('T')[0];\n \n // Fetch recent data for sample stations\n const response = await fetch(\n `https://wcc.sc.egov.usda.gov/awdbRestApi/v1/data?stationIds=335:CO:SNTL,415:CO:SNTL,505:CO:SNTL,551:CO:SNTL,713:CO:SNTL&elementCds=SNWD,WTEQ,TOBS,PREC&ordinal=1&duration=DAILY&getFlags=false&alwaysReturnDailyFeb29=false&format=json&beginDate=${formatDate(startDate)}&endDate=${formatDate(endDate)}`\n );\n \n if (!response.ok) {\n throw new Error(`API request failed: ${response.status}`);\n }\n \n const data = await response.json();\n \n // Process and group data by station\n const stationData: { [key: string]: SnotelData } = {};\n \n data.forEach((record: any) => {\n const stationId = record.stationId;\n \n if (!stationData[stationId]) {\n stationData[stationId] = {\n stationId: stationId,\n name: record.stationName,\n date: record.date,\n snowDepth: undefined,\n snowWaterEquivalent: undefined,\n temperature: undefined,\n precipitation: undefined\n };\n }\n \n // Update with latest date data\n if (record.date >= stationData[stationId].date) {\n stationData[stationId].date = record.date;\n \n // Map element codes to our data structure\n switch (record.elementCd) {\n case 'SNWD':\n stationData[stationId].snowDepth = record.value;\n break;\n case 'WTEQ':\n stationData[stationId].snowWaterEquivalent = record.value;\n break;\n case 'TOBS':\n stationData[stationId].temperature = record.value;\n break;\n case 'PREC':\n stationData[stationId].precipitation = record.value;\n break;\n }\n }\n });\n \n const apiResponse: ApiResponse = {\n success: true,\n data: Object.values(stationData)\n };\n \n return c.json(apiResponse);\n } catch (error) {\n console.error(\"Error fetching data:\", error);\n const apiResponse: ApiResponse = {\n success: false,\n error: error instanceof Error ? error.message : \"Unknown error\"\n };\n return c.json(apiResponse, 500);\n }\n});\n\nexport default app.fetch;","import { Hono } from \"https://esm.sh/hono@3.11.7\";\nimport { readFile, serveFile } from \"https://esm.town/v/std/utils@85-main/index.ts\";\nimport type { SnotelSite, SnotelData, ApiResponse } from \"../shared/types.ts\";\n\nconst app = new Hono();\n\n// Unwrap Hono errors to see original error details\napp.onError((err, c) => {\n throw err;\n});\n\n// Serve static files\napp.get(\"/frontend/*\", c => serveFile(c.req.path, import.meta.url));\napp.get(\"/shared/*\", c => serveFile(c.req.path, import.meta.url));\n\n// Main page\napp.get(\"/\", async c => {\n let html = await readFile(\"/frontend/index.html\", import.meta.url);\n return c.html(html);\n});\n\n// API endpoint to get SNOTEL sites\napp.get(\"/api/sites\", async c => {\n try {\n // Fetch sites from AWDB API - using Colorado SNOTEL sites\n const response = await fetch(\n \"https://wcc.sc.egov.usda.gov/awdbRestApi/services/v1/stations?stateCds=CO&networkCds=SNTL&elementCds=SNWD,WTEQ,TOBS&logicalAnd=true\"\n );\n \n if (!response.ok) {\n throw new Error(`API request failed: ${response.status}`);\n }\n \n const data = await response.json();\n \n // Take first 10 stations for demo\n const limitedData = data.slice(0, 10);\n \n // Transform the data to our format\n const sites: SnotelSite[] = limitedData.map((station: any) => ({\n stationId: station.stationId,\n name: station.name,\n state: station.state,\n latitude: station.latitude,\n longitude: station.longitude,\n elevation: station.elevation,\n county: station.countyName,\n huc: station.huc\n }));\n \n const apiResponse: ApiResponse = {\n success: true,\n data: sites\n };\n \n return c.json(apiResponse);\n } catch (error) {\n console.error(\"Error fetching sites:\", error);\n const apiResponse: ApiResponse = {\n success: false,\n error: error instanceof Error ? error.message : \"Unknown error\"\n };\n return c.json(apiResponse, 500);\n }\n});\n\n// API endpoint to get latest data for stations\napp.get(\"/api/data\", async c => {\n try {\n // Get current date and 30 days ago for recent data\n const endDate = new Date();\n const startDate = new Date();\n startDate.setDate(startDate.getDate() - 30);\n \n const formatDate = (date: Date) => date.toISOString().split('T')[0];\n \n // First get a list of Colorado SNOTEL stations\n const stationsResponse = await fetch(\n \"https://wcc.sc.egov.usda.gov/awdbRestApi/services/v1/stations?stateCds=CO&networkCds=SNTL&elementCds=SNWD,WTEQ,TOBS&logicalAnd=true\"\n );\n \n if (!stationsResponse.ok) {\n throw new Error(`Stations API request failed: ${stationsResponse.status}`);\n }\n \n const stations = await stationsResponse.json();\n const limitedStations = stations.slice(0, 10); // Limit to first 10 for demo\n \n // Get station IDs\n const stationIds = limitedStations.map((s: any) => s.stationId).join(',');\n \n // Fetch recent data for these stations\n const dataResponse = await fetch(\n `https://wcc.sc.egov.usda.gov/awdbRestApi/services/v1/data?stationIds=${stationIds}&elementCds=SNWD,WTEQ,TOBS&ordinal=1&duration=DAILY&getFlags=false&alwaysReturnDailyFeb29=false&format=json&beginDate=${formatDate(startDate)}&endDate=${formatDate(endDate)}`\n );\n \n if (!dataResponse.ok) {\n throw new Error(`Data API request failed: ${dataResponse.status}`);\n }\n \n const data = await dataResponse.json();\n \n // Process and group data by station, getting the most recent values\n const stationData: { [key: string]: SnotelData } = {};\n \n data.forEach((record: any) => {\n const stationId = record.stationId;\n \n if (!stationData[stationId]) {\n stationData[stationId] = {\n stationId: stationId,\n name: record.stationName,\n date: record.date,\n snowDepth: undefined,\n snowWaterEquivalent: undefined,\n temperature: undefined,\n precipitation: undefined\n };\n }\n \n // Update with latest date data\n if (record.date >= stationData[stationId].date) {\n stationData[stationId].date = record.date;\n \n // Map element codes to our data structure\n switch (record.elementCd) {\n case 'SNWD':\n stationData[stationId].snowDepth = record.value;\n break;\n case 'WTEQ':\n stationData[stationId].snowWaterEquivalent = record.value;\n break;\n case 'TOBS':\n stationData[stationId].temperature = record.value;\n break;\n case 'PREC':\n stationData[stationId].precipitation = record.value;\n break;\n }\n }\n });\n \n const apiResponse: ApiResponse = {\n success: true,\n data: Object.values(stationData)\n };\n \n return c.json(apiResponse);\n } catch (error) {\n console.error(\"Error fetching data:\", error);\n const apiResponse: ApiResponse = {\n success: false,\n error: error instanceof Error ? error.message : \"Unknown error\"\n };\n return c.json(apiResponse, 500);\n }\n});\n\nexport default app.fetch;","createdAt",["D",1749761926663],"branchVersion","branchId","9376be60-47cf-11f0-a966-76b3cceeab13","id","9376734c-47cf-11f0-a966-76b3cceeab13","Snotel-Analyzer",["D",1749761730628],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","imageUrl","1ddd50bc-c8b7-4894-bbd7-afc2cc6750cb","pinnedFileId","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","71771b1e-8da0-406a-9fa3-c5006b9de404","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_96":95,"_103":99},"org",{"_96":95,"_97":-5,"_98":99,"_18":55,"_100":101,"_102":25},"branch",{"_13":85,"_32":86,"_44":43,"_87":45,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":46,"_94":95},"isOwned",11,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","bjtitus","handle","displayName","avatar","https://img.clerk.com/eyJ0eXBlIjoicHJveHkiLCJzcmMiOiJodHRwczovL2ltYWdlcy5jbGVyay5kZXYvb2F1dGhfZ2l0aHViL2ltZ18yZDNockZZOGtmYnMwRjhwdWx1QVYyNXNrVVcifQ","tier","free","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_44":45,"_32":46,"_39":208,"_48":-5,"_49":25,"_50":51,"_52":51,"_53":-5,"_54":-5,"_18":55,"_56":31,"_57":58,"_59":58,"_60":-5,"_61":62,"_63":64,"_65":-5,"_66":-5,"_67":-5,"_68":-5,"_69":70,"_71":70,"_72":73,"_74":73,"_75":73,"_76":70,"_77":70,"_78":209,"_80":210,"_82":211,"_84":25},"tree",[169,171,173,175],"files",[169,170,171,172,173,174,175],"counts",{"_159":62,"_160":134,"_161":62,"_162":163,"_164":165},"contents",[126,127,128,129],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_44":153,"_32":154,"_30":155,"_133":-5,"_42":43,"_41":156,"_135":58,"_39":157,"_13":62,"_34":145,"_36":-5,"_24":25,"_138":-5,"_27":158},{"_44":147,"_32":148,"_30":149,"_133":-5,"_42":43,"_41":150,"_135":58,"_39":151,"_13":62,"_34":145,"_36":-5,"_24":25,"_138":-5,"_27":152},{"_44":140,"_32":141,"_30":142,"_133":-5,"_42":43,"_41":143,"_135":58,"_39":144,"_13":62,"_34":145,"_36":-5,"_24":25,"_138":-5,"_27":146},{"_44":130,"_32":131,"_30":132,"_133":-5,"_42":43,"_41":134,"_135":58,"_39":136,"_13":62,"_34":20,"_36":137,"_24":25,"_138":-5,"_27":139},"c67bef4c-47cf-11f0-a860-76b3cceeab13","README.md","c67bf000-47cf-11f0-a860-76b3cceeab13","parentId",1,"latest",["D",1749761816224],"# SNOTEL Data Viewer\n\nA web application that displays the latest SNOTEL (Snow Telemetry) data from USDA's AWDB REST API.\n\n## Features\n\n- Displays latest snow and weather data from SNOTEL sites\n- Interactive table with site information\n- Real-time data fetching from USDA AWDB API\n\n## Project Structure\n\n- `backend/index.ts` - Main Hono server with API endpoints\n- `frontend/index.html` - Main HTML template\n- `frontend/index.tsx` - React frontend application\n- `shared/types.ts` - Shared TypeScript types\n\n## API Endpoints\n\n- `GET /` - Serves the main application\n- `GET /api/sites` - Fetches SNOTEL site data\n- `GET /api/data/:stationId` - Fetches latest data for a specific station\n\n## Usage\n\nThe application automatically loads and displays SNOTEL data in a table format showing:\n- Station information (name, location, elevation)\n- Latest snow depth measurements\n- Temperature data\n- Precipitation data","label",[131],"c9879bd2-47cf-11f0-bb69-76b3cceeab13","shared","a9959294-c98a-4ec3-87a4-b9edb70b06b5",2,["D",1749761821332],"directory",[141],"ea7dd892-47cf-11f0-a3a1-76b3cceeab13","frontend","01f6a4ee-92ab-4a24-9934-1b7142f73fbe",4,["D",1749761876621],[148],"d86c8220-47cf-11f0-b27b-76b3cceeab13","backend","0e802053-2348-490e-9328-85fc195abd99",3,["D",1749761846319],[154],"pulls","branches","forks","envVars",{"_166":62,"_168":62},"connections",{"_166":62,"_167":62},"count","unfilledCount","emptyCount",{"_44":153,"_32":154,"_30":155,"_133":-5,"_42":43,"_41":156,"_135":58,"_39":205,"_13":62,"_34":145,"_36":-5,"_24":25,"_138":-5,"_177":206,"_27":207},{"_44":201,"_32":33,"_30":31,"_133":155,"_42":43,"_41":14,"_135":25,"_39":202,"_13":156,"_34":35,"_36":38,"_24":25,"_138":-5,"_177":203,"_27":204},{"_44":147,"_32":148,"_30":149,"_133":-5,"_42":43,"_41":150,"_135":58,"_39":198,"_13":62,"_34":145,"_36":-5,"_24":25,"_138":-5,"_177":199,"_27":200},{"_44":191,"_32":192,"_30":193,"_133":149,"_42":43,"_41":150,"_135":58,"_39":194,"_13":62,"_34":20,"_36":195,"_24":25,"_138":-5,"_177":196,"_27":197},{"_44":140,"_32":141,"_30":142,"_133":-5,"_42":43,"_41":143,"_135":58,"_39":188,"_13":62,"_34":145,"_36":-5,"_24":25,"_138":-5,"_177":189,"_27":190},{"_44":180,"_32":181,"_30":182,"_133":142,"_42":43,"_41":143,"_135":58,"_39":183,"_13":62,"_34":184,"_36":185,"_24":25,"_138":-5,"_177":186,"_27":187},{"_44":130,"_32":131,"_30":132,"_133":-5,"_42":43,"_41":134,"_135":58,"_39":176,"_13":62,"_34":20,"_36":137,"_24":25,"_138":-5,"_177":178,"_27":179},["D",1749761816224],"children",[],[131],"c9879240-47cf-11f0-bb69-76b3cceeab13","types.ts","c9879308-47cf-11f0-bb69-76b3cceeab13",["D",1749761821332],"script","// Shared types for SNOTEL data\n\nexport interface SnotelSite {\n stationId: string;\n name: string;\n state: string;\n latitude: number;\n longitude: number;\n elevation: number;\n county?: string;\n huc?: string;\n}\n\nexport interface SnotelData {\n stationId: string;\n name: string;\n date: string;\n snowDepth?: number;\n snowWaterEquivalent?: number;\n temperature?: number;\n precipitation?: number;\n windSpeed?: number;\n windDirection?: number;\n}\n\nexport interface ApiResponse {\n success: boolean;\n data?: T;\n error?: string;\n}",[],[141,181],["D",1749761821332],[174],[141],"ea7dbfa6-47cf-11f0-a3a1-76b3cceeab13","index.html","ea7dc06e-47cf-11f0-a3a1-76b3cceeab13",["D",1749761876621],"\n\n\n \n \n SNOTEL Data Viewer\n \n \n \n\n\n

\n \n \n\n",[],[148,192],["D",1749761876621],[172],[148],"08507d48-47d0-11f0-a3eb-76b3cceeab13",["D",1749761926663],[],[154,33],["D",1749761846319],[170],[154],["D",1749761730628],{"_96":95,"_103":99},{"_96":95,"_97":-5,"_98":99,"_18":55,"_100":101,"_102":25},{"_13":85,"_32":86,"_44":43,"_87":45,"_88":-5,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":46,"_94":95},"ctx",{"_78":-5,"_123":245,"_246":247,"_248":249,"_250":25,"_251":25,"_252":25,"_253":58,"_254":-5,"_255":-7,"_256":-7,"_257":62,"_258":25,"_259":25,"_260":-5,"_261":25,"_262":25,"_263":25,"_264":-5},"ENV",{"_216":217,"_218":219,"_220":86,"_221":222,"_223":224,"_225":226,"_227":228,"_229":230,"_231":232,"_233":234,"_235":236,"_237":238,"_239":240,"_241":242,"_243":244},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","71c1b20804b3232a7e513be260cfffc1932a9e97","RENDER_GIT_BRANCH","POSTHOG_API_TOKEN","phc_nmoyuAkStEZuUp69rYlg1DZgrIt19Gx0Y4Hwf8tGgJP","POSTHOG_API_HOST","https://wart.val.town","WEB_API_TEMPLATE","https://{val}.web.val.run","APP_URL","https://www.val.town","MODULE_URL","https://esm.town","VANITY_WEB_API_TEMPLATE","https://{label}.val.run/","DENOLS_URL","https://lsp.val.town","NODE_ENV","production","CLOUDFLARE_TURNSTILE_SITE_KEY","0x4AAAAAACtaIZJH7s9rBMZ6","GOOGLE_CLIENT_ID","875989696899-jtsqkhlbdv5jrlsk8631p7ipjg3c6o62.apps.googleusercontent.com","STRIPE_PUBLISHABLE_KEY","pk_live_51N2zvWEpZTTLipIkVEwXrUG9AT0yeOOEYxszarZT1jpsZV58Ly6wlg3SltZpHN26CUalOBmUSY7adQRQiSkCZz2500qSXNkf8Y","API_URL","https://api.val.town",[],"preferencesKeybindings","default","preferencesTheme","light","preferencesFixers","preferencesCopilot","preferencesSelectionAi","preferencesCloseBrackets","preferencesChatPanelState","preferencesDprint","preferencesDenofmt","notificationCount","flagDenols","isBusinessOrgMember","businessOrgHandle","isBusinessOrgAdmin","isHigherTownieTier","navCollapsed","currentOrgId"]

Diff · v7