📻 Broadcastify Feed Tester

Test live Broadcastify streams via CDN proxy

\n\n Pick a feed\n \n\n Or enter a custom feed ID\n

\n \n \n

\n\n \n\n

Select a feed and press Play

\n\n \n\n`;\n\n return new Response(html, {\n headers: { \"Content-Type\": \"text/html; charset=utf-8\" },\n });\n}\n",[154],"378666d8-3049-11f1-b094-42dde27851f2",["D",1775322644740],2,"testing-12345",[28],"d5b59e0a-303a-11f1-a085-42dde27851f2","routes.tsx","d5b59ec8-303a-11f1-a085-42dde27851f2",22,["D",1775316467679],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { defineRoutes } from \"https://esm.town/v/stevekrouse/vtrr/routes.ts\";\nimport { App } from \"./routes/App.tsx\";\nimport { Landing } from \"./routes/Landing.tsx\";\nimport { Player } from \"./routes/Player.tsx\";\n\nexport const routes = defineRoutes([\n {\n path: \"/\",\n Component: App,\n children: [\n {\n index: true,\n Component: Landing,\n loader: \"./routes/Landing.loader.ts\",\n },\n {\n path: \"landing\",\n Component: Landing,\n },\n {\n path: \":icao\",\n Component: Player,\n loader: \"./routes/Player.loader.ts\",\n },\n ],\n },\n]);\n",[167],"be5e2116-3042-11f1-bb55-42dde27851f2","index.tsx",70,["D",1775319864484],"/**\n * Lofi ATC — listen to live air traffic control radio mixed with lofi hip hop\n *\n * Built with vtrr (Val Town React Router) for SSR + client-side hydration.\n * ATC streams proxied server-side to avoid mixed-content issues.\n */\nimport { createApp } from \"https://esm.town/v/stevekrouse/vtrr/server.ts\";\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\nimport { routes } from \"./routes.tsx\";\n\nexport default createApp({\n routes,\n routesFile: \"./routes.tsx\",\n head: `\n lofi air traffic control\n \n \n \n \n \n `,\n setup: (app) => {\n // ATC stream proxy — tries multiple LiveATC servers to work around rate limits\n app.get(\"/proxy-atc\", async (c) => {\n const mount = c.req.query(\"mount\");\n if (!mount || !/^[a-z0-9_]+$/.test(mount)) {\n return c.json({ error: \"Invalid mount\" }, 400);\n }\n\n // Try multiple LiveATC servers (HTTPS first, then HTTP fallback)\n const servers = [\n `https://s1-bos.liveatc.net/${mount}`,\n `https://s1-fmt2.liveatc.net/${mount}`,\n `https://d.liveatc.net/${mount}`,\n `http://d.liveatc.net/${mount}`,\n ];\n\n for (const streamUrl of servers) {\n try {\n const resp = await fetch(streamUrl, {\n headers: {\n \"User-Agent\": \"Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36\",\n \"Icy-MetaData\": \"0\",\n },\n });\n\n if (resp.ok) {\n return new Response(resp.body, {\n headers: {\n \"Content-Type\": resp.headers.get(\"content-type\") || \"audio/mpeg\",\n \"Cache-Control\": \"no-cache, no-store\",\n \"X-Atc-Mount\": mount,\n \"X-Atc-Server\": streamUrl.split(\"/\")[2],\n },\n });\n }\n // Not OK — cancel body and try next server\n resp.body?.cancel();\n } catch {\n // Connection error — try next server\n }\n }\n\n return c.json({ error: \"All servers unavailable\", mount }, 502);\n });\n\n // Source redirect\n app.get(\"/source\", (c) => {\n return new Response(null, {\n status: 302,\n headers: { Location: parseVal().links.self.val },\n });\n });\n },\n});\n",[174],"defdc93a-3038-11f1-8362-42dde27851f2","airports.ts","defdca02-3038-11f1-8362-42dde27851f2",11,["D",1775315624259],"/**\n * Comprehensive list of airports with LiveATC feed mount points.\n * \n * Mount point naming convention: {icao_lowercase}_{type}\n * Types: twr (tower), app (approach), gnd (ground), dep (departure),\n * app_s (approach south), app_n (approach north), etc.\n * \n * We skip photos — the player uses a blurred gradient background instead.\n * Region tags help with filtering/grouping.\n */\n\nexport interface Airport {\n icao: string;\n name: string;\n city: string;\n country: string;\n region: \"north-america\" | \"europe\" | \"asia\" | \"oceania\" | \"south-america\" | \"africa\" | \"middle-east\";\n mount: string;\n type: string;\n}\n\nexport const AIRPORTS: Airport[] = [\n // ========== NORTH AMERICA — USA ==========\n { icao: \"KJFK\", name: \"John F. Kennedy Intl\", city: \"New York\", country: \"US\", region: \"north-america\", mount: \"kjfk_twr\", type: \"Tower\" },\n { icao: \"KLGA\", name: \"LaGuardia\", city: \"New York\", country: \"US\", region: \"north-america\", mount: \"klga_twr\", type: \"Tower\" },\n { icao: \"KEWR\", name: \"Newark Liberty Intl\", city: \"Newark\", country: \"US\", region: \"north-america\", mount: \"kewr_twr\", type: \"Tower\" },\n { icao: \"KLAX\", name: \"Los Angeles Intl\", city: \"Los Angeles\", country: \"US\", region: \"north-america\", mount: \"klax_twr\", type: \"Tower\" },\n { icao: \"KSFO\", name: \"San Francisco Intl\", city: \"San Francisco\", country: \"US\", region: \"north-america\", mount: \"ksfo_twr\", type: \"Tower\" },\n { icao: \"KORD\", name: \"Chicago O'Hare Intl\", city: \"Chicago\", country: \"US\", region: \"north-america\", mount: \"kord_app_s\", type: \"Approach\" },\n { icao: \"KMDW\", name: \"Chicago Midway\", city: \"Chicago\", country: \"US\", region: \"north-america\", mount: \"kmdw_app\", type: \"Approach\" },\n { icao: \"KATL\", name: \"Hartsfield-Jackson Atlanta Intl\", city: \"Atlanta\", country: \"US\", region: \"north-america\", mount: \"katl_app\", type: \"Approach\" },\n { icao: \"KDFW\", name: \"Dallas/Fort Worth Intl\", city: \"Dallas\", country: \"US\", region: \"north-america\", mount: \"kdfw_twr\", type: \"Tower\" },\n { icao: \"KDEN\", name: \"Denver Intl\", city: \"Denver\", country: \"US\", region: \"north-america\", mount: \"kden_app_s\", type: \"Approach\" },\n { icao: \"KMIA\", name: \"Miami Intl\", city: \"Miami\", country: \"US\", region: \"north-america\", mount: \"kmia_twr\", type: \"Tower\" },\n { icao: \"KBOS\", name: \"Boston Logan Intl\", city: \"Boston\", country: \"US\", region: \"north-america\", mount: \"kbos_twr\", type: \"Tower\" },\n { icao: \"KSEA\", name: \"Seattle-Tacoma Intl\", city: \"Seattle\", country: \"US\", region: \"north-america\", mount: \"ksea_twr\", type: \"Tower\" },\n { icao: \"KLAS\", name: \"Harry Reid Intl\", city: \"Las Vegas\", country: \"US\", region: \"north-america\", mount: \"klas_twr\", type: \"Tower\" },\n { icao: \"KPHX\", name: \"Phoenix Sky Harbor Intl\", city: \"Phoenix\", country: \"US\", region: \"north-america\", mount: \"kphx_twr\", type: \"Tower\" },\n { icao: \"KMSP\", name: \"Minneapolis-St Paul Intl\", city: \"Minneapolis\", country: \"US\", region: \"north-america\", mount: \"kmsp_app\", type: \"Approach\" },\n { icao: \"KDTW\", name: \"Detroit Metropolitan Wayne County\", city: \"Detroit\", country: \"US\", region: \"north-america\", mount: \"kdtw_twr\", type: \"Tower\" },\n { icao: \"KPHL\", name: \"Philadelphia Intl\", city: \"Philadelphia\", country: \"US\", region: \"north-america\", mount: \"kphl_app\", type: \"Approach\" },\n { icao: \"KIAD\", name: \"Washington Dulles Intl\", city: \"Washington D.C.\", country: \"US\", region: \"north-america\", mount: \"kiad_twr\", type: \"Tower\" },\n { icao: \"KDCA\", name: \"Ronald Reagan Washington National\", city: \"Washington D.C.\", country: \"US\", region: \"north-america\", mount: \"kdca_twr\", type: \"Tower\" },\n { icao: \"KBWI\", name: \"Baltimore/Washington Intl\", city: \"Baltimore\", country: \"US\", region: \"north-america\", mount: \"kbwi_twr\", type: \"Tower\" },\n { icao: \"KIAH\", name: \"George Bush Intercontinental\", city: \"Houston\", country: \"US\", region: \"north-america\", mount: \"kiah_twr\", type: \"Tower\" },\n { icao: \"KHOU\", name: \"William P. Hobby\", city: \"Houston\", country: \"US\", region: \"north-america\", mount: \"khou_twr\", type: \"Tower\" },\n { icao: \"KSAN\", name: \"San Diego Intl\", city: \"San Diego\", country: \"US\", region: \"north-america\", mount: \"ksan_twr\", type: \"Tower\" },\n { icao: \"KTPA\", name: \"Tampa Intl\", city: \"Tampa\", country: \"US\", region: \"north-america\", mount: \"ktpa_app\", type: \"Approach\" },\n { icao: \"KMCO\", name: \"Orlando Intl\", city: \"Orlando\", country: \"US\", region: \"north-america\", mount: \"kmco_twr\", type: \"Tower\" },\n { icao: \"KFLL\", name: \"Fort Lauderdale-Hollywood Intl\", city: \"Fort Lauderdale\", country: \"US\", region: \"north-america\", mount: \"kfll_twr\", type: \"Tower\" },\n { icao: \"KPDX\", name: \"Portland Intl\", city: \"Portland\", country: \"US\", region: \"north-america\", mount: \"kpdx_twr\", type: \"Tower\" },\n { icao: \"KCLT\", name: \"Charlotte Douglas Intl\", city: \"Charlotte\", country: \"US\", region: \"north-america\", mount: \"kclt_app\", type: \"Approach\" },\n { icao: \"KSLC\", name: \"Salt Lake City Intl\", city: \"Salt Lake City\", country: \"US\", region: \"north-america\", mount: \"kslc_app\", type: \"Approach\" },\n { icao: \"KRDU\", name: \"Raleigh-Durham Intl\", city: \"Raleigh\", country: \"US\", region: \"north-america\", mount: \"krdu_app\", type: \"Approach\" },\n { icao: \"KSTL\", name: \"St. Louis Lambert Intl\", city: \"St. Louis\", country: \"US\", region: \"north-america\", mount: \"kstl_app\", type: \"Approach\" },\n { icao: \"KMKE\", name: \"General Mitchell Intl\", city: \"Milwaukee\", country: \"US\", region: \"north-america\", mount: \"kmke_app\", type: \"Approach\" },\n { icao: \"KBNA\", name: \"Nashville Intl\", city: \"Nashville\", country: \"US\", region: \"north-america\", mount: \"kbna_twr\", type: \"Tower\" },\n { icao: \"KAUS\", name: \"Austin-Bergstrom Intl\", city: \"Austin\", country: \"US\", region: \"north-america\", mount: \"kaus_twr\", type: \"Tower\" },\n { icao: \"KSAT\", name: \"San Antonio Intl\", city: \"San Antonio\", country: \"US\", region: \"north-america\", mount: \"ksat_app\", type: \"Approach\" },\n { icao: \"KPIT\", name: \"Pittsburgh Intl\", city: \"Pittsburgh\", country: \"US\", region: \"north-america\", mount: \"kpit_app\", type: \"Approach\" },\n { icao: \"KCLE\", name: \"Cleveland Hopkins Intl\", city: \"Cleveland\", country: \"US\", region: \"north-america\", mount: \"kcle_app\", type: \"Approach\" },\n { icao: \"KOAK\", name: \"Oakland Intl\", city: \"Oakland\", country: \"US\", region: \"north-america\", mount: \"koak_twr\", type: \"Tower\" },\n { icao: \"KSJC\", name: \"San José Mineta Intl\", city: \"San José\", country: \"US\", region: \"north-america\", mount: \"ksjc_twr\", type: \"Tower\" },\n { icao: \"KSMF\", name: \"Sacramento Intl\", city: \"Sacramento\", country: \"US\", region: \"north-america\", mount: \"ksmf_twr\", type: \"Tower\" },\n { icao: \"KIND\", name: \"Indianapolis Intl\", city: \"Indianapolis\", country: \"US\", region: \"north-america\", mount: \"kind_app\", type: \"Approach\" },\n { icao: \"KCVG\", name: \"Cincinnati/Northern Kentucky Intl\", city: \"Cincinnati\", country: \"US\", region: \"north-america\", mount: \"kcvg_app\", type: \"Approach\" },\n { icao: \"KMEM\", name: \"Memphis Intl\", city: \"Memphis\", country: \"US\", region: \"north-america\", mount: \"kmem_app\", type: \"Approach\" },\n { icao: \"PANC\", name: \"Ted Stevens Anchorage Intl\", city: \"Anchorage\", country: \"US\", region: \"north-america\", mount: \"panc_app\", type: \"Approach\" },\n { icao: \"PHNL\", name: \"Daniel K. Inouye Intl\", city: \"Honolulu\", country: \"US\", region: \"north-america\", mount: \"phnl_twr\", type: \"Tower\" },\n { icao: \"KABQ\", name: \"Albuquerque Intl Sunport\", city: \"Albuquerque\", country: \"US\", region: \"north-america\", mount: \"kabq_app\", type: \"Approach\" },\n { icao: \"KONT\", name: \"Ontario Intl\", city: \"Ontario\", country: \"US\", region: \"north-america\", mount: \"kont_twr\", type: \"Tower\" },\n { icao: \"KBUR\", name: \"Hollywood Burbank\", city: \"Burbank\", country: \"US\", region: \"north-america\", mount: \"kbur_twr\", type: \"Tower\" },\n { icao: \"KTEB\", name: \"Teterboro\", city: \"Teterboro\", country: \"US\", region: \"north-america\", mount: \"kteb_twr\", type: \"Tower\" },\n { icao: \"KVNY\", name: \"Van Nuys\", city: \"Van Nuys\", country: \"US\", region: \"north-america\", mount: \"kvny_twr\", type: \"Tower\" },\n { icao: \"KPBI\", name: \"Palm Beach Intl\", city: \"West Palm Beach\", country: \"US\", region: \"north-america\", mount: \"kpbi\", type: \"Tower\" },\n { icao: \"KRSW\", name: \"Southwest Florida Intl\", city: \"Fort Myers\", country: \"US\", region: \"north-america\", mount: \"krsw_app\", type: \"Approach\" },\n { icao: \"KJAX\", name: \"Jacksonville Intl\", city: \"Jacksonville\", country: \"US\", region: \"north-america\", mount: \"kjax_app\", type: \"Approach\" },\n { icao: \"KOMA\", name: \"Eppley Airfield\", city: \"Omaha\", country: \"US\", region: \"north-america\", mount: \"koma_app\", type: \"Approach\" },\n { icao: \"KSNA\", name: \"John Wayne Airport\", city: \"Santa Ana\", country: \"US\", region: \"north-america\", mount: \"ksna_twr\", type: \"Tower\" },\n { icao: \"KBDL\", name: \"Bradley Intl\", city: \"Hartford\", country: \"US\", region: \"north-america\", mount: \"kbdl_app\", type: \"Approach\" },\n { icao: \"KBUF\", name: \"Buffalo Niagara Intl\", city: \"Buffalo\", country: \"US\", region: \"north-america\", mount: \"kbuf_app\", type: \"Approach\" },\n { icao: \"KPVD\", name: \"T.F. Green Intl\", city: \"Providence\", country: \"US\", region: \"north-america\", mount: \"kpvd_app\", type: \"Approach\" },\n\n // ========== NORTH AMERICA — CANADA ==========\n { icao: \"CYYZ\", name: \"Toronto Pearson Intl\", city: \"Toronto\", country: \"CA\", region: \"north-america\", mount: \"cyyz_twr\", type: \"Tower\" },\n { icao: \"CYVR\", name: \"Vancouver Intl\", city: \"Vancouver\", country: \"CA\", region: \"north-america\", mount: \"cyvr_twr\", type: \"Tower\" },\n { icao: \"CYUL\", name: \"Montréal-Trudeau Intl\", city: \"Montréal\", country: \"CA\", region: \"north-america\", mount: \"cyul_twr\", type: \"Tower\" },\n { icao: \"CYOW\", name: \"Ottawa Macdonald-Cartier Intl\", city: \"Ottawa\", country: \"CA\", region: \"north-america\", mount: \"cyow_twr\", type: \"Tower\" },\n { icao: \"CYYC\", name: \"Calgary Intl\", city: \"Calgary\", country: \"CA\", region: \"north-america\", mount: \"cyyc_twr\", type: \"Tower\" },\n { icao: \"CYEG\", name: \"Edmonton Intl\", city: \"Edmonton\", country: \"CA\", region: \"north-america\", mount: \"cyeg_twr\", type: \"Tower\" },\n { icao: \"CYWG\", name: \"Winnipeg James Armstrong Richardson Intl\", city: \"Winnipeg\", country: \"CA\", region: \"north-america\", mount: \"cywg_twr\", type: \"Tower\" },\n { icao: \"CYHZ\", name: \"Halifax Stanfield Intl\", city: \"Halifax\", country: \"CA\", region: \"north-america\", mount: \"cyhz_twr\", type: \"Tower\" },\n\n // ========== NORTH AMERICA — MEXICO & CARIBBEAN ==========\n { icao: \"MMMX\", name: \"Mexico City Intl\", city: \"Mexico City\", country: \"MX\", region: \"north-america\", mount: \"mmmx_twr\", type: \"Tower\" },\n { icao: \"MMUN\", name: \"Cancún Intl\", city: \"Cancún\", country: \"MX\", region: \"north-america\", mount: \"mmun_app\", type: \"Approach\" },\n { icao: \"TNCM\", name: \"Princess Juliana Intl\", city: \"Sint Maarten\", country: \"SX\", region: \"north-america\", mount: \"tncm_twr\", type: \"Tower\" },\n { icao: \"MKJP\", name: \"Norman Manley Intl\", city: \"Kingston\", country: \"JM\", region: \"north-america\", mount: \"mkjp_twr\", type: \"Tower\" },\n\n // ========== EUROPE ==========\n { icao: \"EGLL\", name: \"London Heathrow\", city: \"London\", country: \"GB\", region: \"europe\", mount: \"egll_app\", type: \"Approach\" },\n { icao: \"EGKK\", name: \"London Gatwick\", city: \"London\", country: \"GB\", region: \"europe\", mount: \"egkk_app\", type: \"Approach\" },\n { icao: \"EGLC\", name: \"London City\", city: \"London\", country: \"GB\", region: \"europe\", mount: \"eglc_twr\", type: \"Tower\" },\n { icao: \"EGSS\", name: \"London Stansted\", city: \"London\", country: \"GB\", region: \"europe\", mount: \"egss_app\", type: \"Approach\" },\n { icao: \"EGBB\", name: \"Birmingham\", city: \"Birmingham\", country: \"GB\", region: \"europe\", mount: \"egbb_app\", type: \"Approach\" },\n { icao: \"EGCC\", name: \"Manchester\", city: \"Manchester\", country: \"GB\", region: \"europe\", mount: \"egcc_app\", type: \"Approach\" },\n { icao: \"EGPH\", name: \"Edinburgh\", city: \"Edinburgh\", country: \"GB\", region: \"europe\", mount: \"egph_app\", type: \"Approach\" },\n { icao: \"LFPG\", name: \"Paris Charles de Gaulle\", city: \"Paris\", country: \"FR\", region: \"europe\", mount: \"lfpg_app\", type: \"Approach\" },\n { icao: \"LFPO\", name: \"Paris Orly\", city: \"Paris\", country: \"FR\", region: \"europe\", mount: \"lfpo_twr\", type: \"Tower\" },\n { icao: \"EDDF\", name: \"Frankfurt\", city: \"Frankfurt\", country: \"DE\", region: \"europe\", mount: \"eddf_twr\", type: \"Tower\" },\n { icao: \"EDDM\", name: \"Munich\", city: \"Munich\", country: \"DE\", region: \"europe\", mount: \"eddm_twr\", type: \"Tower\" },\n { icao: \"EDDB\", name: \"Berlin Brandenburg\", city: \"Berlin\", country: \"DE\", region: \"europe\", mount: \"eddb_twr\", type: \"Tower\" },\n { icao: \"EDDL\", name: \"Düsseldorf\", city: \"Düsseldorf\", country: \"DE\", region: \"europe\", mount: \"eddl_twr\", type: \"Tower\" },\n { icao: \"EDDH\", name: \"Hamburg\", city: \"Hamburg\", country: \"DE\", region: \"europe\", mount: \"eddh_twr\", type: \"Tower\" },\n { icao: \"EHAM\", name: \"Amsterdam Schiphol\", city: \"Amsterdam\", country: \"NL\", region: \"europe\", mount: \"eham_twr\", type: \"Tower\" },\n { icao: \"EBBR\", name: \"Brussels\", city: \"Brussels\", country: \"BE\", region: \"europe\", mount: \"ebbr_app\", type: \"Approach\" },\n { icao: \"LEMD\", name: \"Madrid Barajas\", city: \"Madrid\", country: \"ES\", region: \"europe\", mount: \"lemd_app\", type: \"Approach\" },\n { icao: \"LEBL\", name: \"Barcelona El Prat\", city: \"Barcelona\", country: \"ES\", region: \"europe\", mount: \"lebl_app\", type: \"Approach\" },\n { icao: \"LPPT\", name: \"Lisbon Portela\", city: \"Lisbon\", country: \"PT\", region: \"europe\", mount: \"lppt_app\", type: \"Approach\" },\n { icao: \"LIRF\", name: \"Rome Fiumicino\", city: \"Rome\", country: \"IT\", region: \"europe\", mount: \"lirf_app\", type: \"Approach\" },\n { icao: \"LIMC\", name: \"Milan Malpensa\", city: \"Milan\", country: \"IT\", region: \"europe\", mount: \"limc_app\", type: \"Approach\" },\n { icao: \"LSZH\", name: \"Zurich\", city: \"Zurich\", country: \"CH\", region: \"europe\", mount: \"lszh_twr\", type: \"Tower\" },\n { icao: \"LOWW\", name: \"Vienna Schwechat\", city: \"Vienna\", country: \"AT\", region: \"europe\", mount: \"loww_app\", type: \"Approach\" },\n { icao: \"EKCH\", name: \"Copenhagen Kastrup\", city: \"Copenhagen\", country: \"DK\", region: \"europe\", mount: \"ekch_app\", type: \"Approach\" },\n { icao: \"ESSA\", name: \"Stockholm Arlanda\", city: \"Stockholm\", country: \"SE\", region: \"europe\", mount: \"essa_twr\", type: \"Tower\" },\n { icao: \"ENGM\", name: \"Oslo Gardermoen\", city: \"Oslo\", country: \"NO\", region: \"europe\", mount: \"engm_twr\", type: \"Tower\" },\n { icao: \"EFHK\", name: \"Helsinki-Vantaa\", city: \"Helsinki\", country: \"FI\", region: \"europe\", mount: \"efhk_app\", type: \"Approach\" },\n { icao: \"EIDW\", name: \"Dublin\", city: \"Dublin\", country: \"IE\", region: \"europe\", mount: \"eidw_app\", type: \"Approach\" },\n { icao: \"EPWA\", name: \"Warsaw Chopin\", city: \"Warsaw\", country: \"PL\", region: \"europe\", mount: \"epwa_app\", type: \"Approach\" },\n { icao: \"LKPR\", name: \"Prague Václav Havel\", city: \"Prague\", country: \"CZ\", region: \"europe\", mount: \"lkpr_app\", type: \"Approach\" },\n { icao: \"LHBP\", name: \"Budapest Ferenc Liszt\", city: \"Budapest\", country: \"HU\", region: \"europe\", mount: \"lhbp_app\", type: \"Approach\" },\n { icao: \"LGAV\", name: \"Athens Eleftherios Venizelos\", city: \"Athens\", country: \"GR\", region: \"europe\", mount: \"lgav_app\", type: \"Approach\" },\n { icao: \"LTFM\", name: \"Istanbul\", city: \"Istanbul\", country: \"TR\", region: \"europe\", mount: \"ltfm_app\", type: \"Approach\" },\n { icao: \"LROP\", name: \"Bucharest Henri Coandă\", city: \"Bucharest\", country: \"RO\", region: \"europe\", mount: \"lrop_app\", type: \"Approach\" },\n { icao: \"BIKF\", name: \"Keflavík Intl\", city: \"Reykjavík\", country: \"IS\", region: \"europe\", mount: \"bikf_app\", type: \"Approach\" },\n\n // ========== ASIA ==========\n { icao: \"RJTT\", name: \"Tokyo Haneda\", city: \"Tokyo\", country: \"JP\", region: \"asia\", mount: \"rjtt_app_dep\", type: \"Approach\" },\n { icao: \"RJAA\", name: \"Tokyo Narita\", city: \"Tokyo\", country: \"JP\", region: \"asia\", mount: \"rjaa_app\", type: \"Approach\" },\n { icao: \"RJBB\", name: \"Osaka Kansai\", city: \"Osaka\", country: \"JP\", region: \"asia\", mount: \"rjbb_app\", type: \"Approach\" },\n { icao: \"VHHH\", name: \"Hong Kong Intl\", city: \"Hong Kong\", country: \"HK\", region: \"asia\", mount: \"vhhh_app\", type: \"Approach\" },\n { icao: \"WSSS\", name: \"Singapore Changi\", city: \"Singapore\", country: \"SG\", region: \"asia\", mount: \"wsss_app\", type: \"Approach\" },\n { icao: \"RKSI\", name: \"Seoul Incheon\", city: \"Seoul\", country: \"KR\", region: \"asia\", mount: \"rksi_app\", type: \"Approach\" },\n { icao: \"VTBS\", name: \"Bangkok Suvarnabhumi\", city: \"Bangkok\", country: \"TH\", region: \"asia\", mount: \"vtbs_app\", type: \"Approach\" },\n { icao: \"RPLL\", name: \"Manila Ninoy Aquino\", city: \"Manila\", country: \"PH\", region: \"asia\", mount: \"rpll_app\", type: \"Approach\" },\n { icao: \"WMKK\", name: \"Kuala Lumpur Intl\", city: \"Kuala Lumpur\", country: \"MY\", region: \"asia\", mount: \"wmkk_app\", type: \"Approach\" },\n { icao: \"VIDP\", name: \"Indira Gandhi Intl\", city: \"New Delhi\", country: \"IN\", region: \"asia\", mount: \"vidp_app\", type: \"Approach\" },\n { icao: \"VABB\", name: \"Chhatrapati Shivaji Maharaj Intl\", city: \"Mumbai\", country: \"IN\", region: \"asia\", mount: \"vabb_app\", type: \"Approach\" },\n { icao: \"VOBL\", name: \"Kempegowda Intl\", city: \"Bangalore\", country: \"IN\", region: \"asia\", mount: \"vobl_app\", type: \"Approach\" },\n { icao: \"RCTP\", name: \"Taiwan Taoyuan Intl\", city: \"Taipei\", country: \"TW\", region: \"asia\", mount: \"rctp_app\", type: \"Approach\" },\n\n // ========== OCEANIA ==========\n { icao: \"YSSY\", name: \"Sydney Kingsford Smith\", city: \"Sydney\", country: \"AU\", region: \"oceania\", mount: \"yssy_app\", type: \"Approach\" },\n { icao: \"YMML\", name: \"Melbourne Tullamarine\", city: \"Melbourne\", country: \"AU\", region: \"oceania\", mount: \"ymml_app\", type: \"Approach\" },\n { icao: \"YBBN\", name: \"Brisbane\", city: \"Brisbane\", country: \"AU\", region: \"oceania\", mount: \"ybbn_app\", type: \"Approach\" },\n { icao: \"YPPH\", name: \"Perth\", city: \"Perth\", country: \"AU\", region: \"oceania\", mount: \"ypph_app\", type: \"Approach\" },\n { icao: \"NZAA\", name: \"Auckland\", city: \"Auckland\", country: \"NZ\", region: \"oceania\", mount: \"nzaa_app\", type: \"Approach\" },\n { icao: \"NZWN\", name: \"Wellington\", city: \"Wellington\", country: \"NZ\", region: \"oceania\", mount: \"nzwn_twr\", type: \"Tower\" },\n { icao: \"NZCH\", name: \"Christchurch\", city: \"Christchurch\", country: \"NZ\", region: \"oceania\", mount: \"nzch_app\", type: \"Approach\" },\n\n // ========== SOUTH AMERICA ==========\n { icao: \"SBGR\", name: \"São Paulo–Guarulhos Intl\", city: \"São Paulo\", country: \"BR\", region: \"south-america\", mount: \"sbgr_app\", type: \"Approach\" },\n { icao: \"SCEL\", name: \"Santiago Arturo Merino Benítez\", city: \"Santiago\", country: \"CL\", region: \"south-america\", mount: \"scel_app\", type: \"Approach\" },\n { icao: \"SKBO\", name: \"El Dorado Intl\", city: \"Bogotá\", country: \"CO\", region: \"south-america\", mount: \"skbo_app\", type: \"Approach\" },\n { icao: \"SPJC\", name: \"Jorge Chávez Intl\", city: \"Lima\", country: \"PE\", region: \"south-america\", mount: \"spjc_app\", type: \"Approach\" },\n { icao: \"SAEZ\", name: \"Buenos Aires Ezeiza\", city: \"Buenos Aires\", country: \"AR\", region: \"south-america\", mount: \"saez_app\", type: \"Approach\" },\n\n // ========== MIDDLE EAST ==========\n { icao: \"OMDB\", name: \"Dubai Intl\", city: \"Dubai\", country: \"AE\", region: \"middle-east\", mount: \"omdb_app\", type: \"Approach\" },\n { icao: \"OEJN\", name: \"King Abdulaziz Intl\", city: \"Jeddah\", country: \"SA\", region: \"middle-east\", mount: \"oejn_app\", type: \"Approach\" },\n { icao: \"OTHH\", name: \"Hamad Intl\", city: \"Doha\", country: \"QA\", region: \"middle-east\", mount: \"othh_app\", type: \"Approach\" },\n { icao: \"LLBG\", name: \"Ben Gurion\", city: \"Tel Aviv\", country: \"IL\", region: \"middle-east\", mount: \"llbg_app\", type: \"Approach\" },\n\n // ========== AFRICA ==========\n { icao: \"FAOR\", name: \"O.R. Tambo Intl\", city: \"Johannesburg\", country: \"ZA\", region: \"africa\", mount: \"faor_app\", type: \"Approach\" },\n { icao: \"FACT\", name: \"Cape Town Intl\", city: \"Cape Town\", country: \"ZA\", region: \"africa\", mount: \"fact_app\", type: \"Approach\" },\n { icao: \"HECA\", name: \"Cairo Intl\", city: \"Cairo\", country: \"EG\", region: \"africa\", mount: \"heca_app\", type: \"Approach\" },\n { icao: \"DNMM\", name: \"Murtala Muhammed Intl\", city: \"Lagos\", country: \"NG\", region: \"africa\", mount: \"dnmm_app\", type: \"Approach\" },\n { icao: \"GMMN\", name: \"Mohammed V Intl\", city: \"Casablanca\", country: \"MA\", region: \"africa\", mount: \"gmmn_app\", type: \"Approach\" },\n];\n\nexport const REGION_LABELS: Record = {\n \"north-america\": \"North America\",\n \"europe\": \"Europe\",\n \"asia\": \"Asia\",\n \"oceania\": \"Oceania\",\n \"south-america\": \"South America\",\n \"middle-east\": \"Middle East\",\n \"africa\": \"Africa\",\n};\n",[180],"43c12eea-303c-11f1-9d54-42dde27851f2","README.md","f076f1e4-303a-11f1-a218-42dde27851f2",32,["D",1775317081797],"# lofi air traffic control\n\nListen to live air traffic control radio mixed with lofi hip hop beats. Inspired by [lofiatc.com](https://www.lofiatc.com).\n\n## Architecture\n\nBuilt with [vtrr](https://www.val.town/x/stevekrouse/vtrr) (Val Town React Router) — SSR + client-side hydration, twind for styling.\n\n```mermaid\ngraph TD\n A[\"index.tsx\"] -->|HTTP entry| B[\"createApp + proxy setup\"]\n A --> C[\"routes.tsx\"]\n C --> D[\"routes/App.tsx - layout\"]\n C --> E[\"/ - Landing.loader.ts - redirect to random\"]\n C --> F[\"/landing - Landing.tsx - search UI\"]\n C --> G[\"/:icao - Player.tsx + Player.loader.ts\"]\n H[\"airports.ts\"] --> F\n H --> G\n I[\"tracks.ts\"] --> G\n```\n\n### File Structure\n\n```\nindex.tsx — HTTP entry, createApp, ATC proxy, /source\nroutes.tsx — React Router route definitions (client-safe)\nairports.ts — 140+ airports with LiveATC mount points\ntracks.ts — Lofi music tracks + shuffle util\nroutes/\n App.tsx — Root layout with gradient background\n Landing.tsx — Airport search + random button\n Landing.loader.ts — Server: redirects / to random airport\n Player.tsx — Player UI (play/stop, volumes, track skip)\n Player.loader.ts — Server: validates ICAO, returns airport data\n```\n\n### Key Features\n\n- **140+ airports worldwide** with LiveATC feeds\n- **Server-side ATC stream proxy** (avoids mixed-content issues)\n- **Auto-reconnect** on stream errors with exponential backoff\n- **Keyboard shortcuts**: space (play), arrows (volume), n (skip), esc (back)\n- **SSR** — pages render on the server, hydrate on the client\n- **Randomized tracks** — lofi playlist shuffled on each session\n",[187],"97e82d40-303a-11f1-8836-42dde27851f2","routes","97e82e08-303a-11f1-8836-42dde27851f2",16,["D",1775316363986],"directory",[194],"pulls","branches","forks","envVars",{"_207":63,"_209":63},"connections",{"_207":63,"_208":63},"count","unfilledCount","emptyCount",{"_43":193,"_32":194,"_30":195,"_138":-5,"_41":42,"_40":196,"_140":59,"_38":291,"_13":63,"_33":198,"_35":-5,"_24":25,"_144":-5,"_225":292,"_27":293},{"_43":283,"_32":284,"_30":285,"_138":195,"_41":42,"_40":286,"_140":59,"_38":287,"_13":63,"_33":34,"_35":288,"_24":25,"_144":-5,"_225":289,"_27":290},{"_43":275,"_32":276,"_30":277,"_138":195,"_41":42,"_40":278,"_140":59,"_38":279,"_13":63,"_33":34,"_35":280,"_24":25,"_144":-5,"_225":281,"_27":282},{"_43":266,"_32":267,"_30":268,"_138":195,"_41":42,"_40":269,"_140":59,"_38":270,"_13":271,"_33":34,"_35":272,"_24":25,"_144":-5,"_225":273,"_27":274},{"_43":258,"_32":259,"_30":260,"_138":195,"_41":42,"_40":261,"_140":59,"_38":262,"_13":63,"_33":34,"_35":263,"_24":25,"_144":-5,"_225":264,"_27":265},{"_43":249,"_32":250,"_30":251,"_138":195,"_41":42,"_40":252,"_140":59,"_38":253,"_13":254,"_33":34,"_35":255,"_24":25,"_144":-5,"_225":256,"_27":257},{"_43":186,"_32":187,"_30":188,"_138":-5,"_41":42,"_40":189,"_140":59,"_38":246,"_13":142,"_33":20,"_35":191,"_24":25,"_144":-5,"_225":247,"_27":248},{"_43":179,"_32":180,"_30":181,"_138":-5,"_41":42,"_40":182,"_140":59,"_38":243,"_13":63,"_33":34,"_35":184,"_24":25,"_144":-5,"_225":244,"_27":245},{"_43":173,"_32":174,"_30":57,"_138":-5,"_41":42,"_40":175,"_140":59,"_38":240,"_13":142,"_33":158,"_35":177,"_24":25,"_144":-5,"_225":241,"_27":242},{"_43":166,"_32":167,"_30":168,"_138":-5,"_41":42,"_40":169,"_140":59,"_38":237,"_13":63,"_33":34,"_35":171,"_24":25,"_144":-5,"_225":238,"_27":239},{"_43":161,"_32":28,"_30":31,"_138":-5,"_41":42,"_40":14,"_140":25,"_38":234,"_13":163,"_33":34,"_35":37,"_24":25,"_144":164,"_225":235,"_27":236},{"_43":153,"_32":154,"_30":155,"_138":-5,"_41":42,"_40":156,"_140":59,"_38":231,"_13":63,"_33":158,"_35":159,"_24":25,"_144":-5,"_225":232,"_27":233},{"_43":146,"_32":147,"_30":148,"_138":-5,"_41":42,"_40":149,"_140":59,"_38":228,"_13":142,"_33":34,"_35":151,"_24":25,"_144":-5,"_225":229,"_27":230},{"_43":135,"_32":136,"_30":137,"_138":-5,"_41":42,"_40":139,"_140":59,"_38":224,"_13":142,"_33":34,"_35":143,"_24":25,"_144":-5,"_225":226,"_27":227},["D",1775319327547],"children",[],[136],["D",1775321653076],[],[147],["D",1775321972693],[],[154],["D",1775322644740],[],[28],["D",1775316467679],[],[167],["D",1775319864484],[],[174],["D",1775315624259],[],[180],["D",1775317081797],[],[187],"d8fa1552-3042-11f1-83b0-42dde27851f2","Player.tsx","d1bf42b0-303a-11f1-90c1-42dde27851f2",75,["D",1775319909054],26,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useEffect, useRef, useCallback } from \"https://esm.sh/react@18.2.0\";\nimport { useLoaderData, useNavigate } from \"https://esm.sh/react-router@7.5.0?deps=react@18.2.0,react-dom@18.2.0\";\nimport { parseVal } from \"https://esm.town/v/std/utils/index.ts\";\nimport { AIRPORTS } from \"../airports.ts\";\nimport type { Airport } from \"../airports.ts\";\nimport { shuffleTracks } from \"../tracks.ts\";\n\nconst ATC_MAX_RETRIES = 3;\nconst ATC_RETRY_DELAYS = [3000, 6000, 12000];\nconst MAX_MUSIC_FAILURES = 5; // if this many tracks fail in a row, show warning\nconst MAX_ATC_AIRPORT_RETRIES = 5; // try up to N different airports before giving up\nconst AIRPORT_SWITCH_DELAYS = [5000, 10000, 15000, 20000, 30000]; // increasing delay between airport switches\n\ntype Status = \"hidden\" | \"live\" | \"error\" | \"connecting\";\n\nexport function Player() {\n const { airport } = useLoaderData() as { airport: Airport };\n const navigate = useNavigate();\n\n const [isPlaying, setIsPlaying] = useState(false);\n const [status, setStatus] = useState(\"hidden\");\n const [statusText, setStatusText] = useState(\"\");\n const [trackName, setTrackName] = useState(\"\\u266B\");\n const [musicMuted, setMusicMuted] = useState(false);\n const [atcMuted, setAtcMuted] = useState(false);\n const [musicError, setMusicError] = useState(\"\");\n\n const musicRef = useRef(null);\n const atcRef = useRef(null);\n const musicVolRef = useRef(null);\n const atcVolRef = useRef(null);\n\n const tracksRef = useRef(shuffleTracks());\n const trackIndexRef = useRef(0);\n const retryCountRef = useRef(0);\n const retryTimerRef = useRef(null);\n const isPlayingRef = useRef(false);\n const musicFailCountRef = useRef(0);\n const atcAirportRetryRef = useRef(0);\n const triedAirportsRef = useRef>(new Set());\n\n // Keep ref in sync\n useEffect(() => {\n isPlayingRef.current = isPlaying;\n }, [isPlaying]);\n\n // Restore saved volumes\n useEffect(() => {\n const sv1 = localStorage.getItem(\"lofi-atc-music-vol\");\n const sv2 = localStorage.getItem(\"lofi-atc-atc-vol\");\n if (sv1 && musicVolRef.current) musicVolRef.current.value = sv1;\n if (sv2 && atcVolRef.current) atcVolRef.current.value = sv2;\n }, []);\n\n const setVolume = useCallback((type: \"music\" | \"atc\", val: number) => {\n const audio = type === \"music\" ? musicRef.current : atcRef.current;\n if (audio) audio.volume = val / 100;\n localStorage.setItem(`lofi-atc-${type}-vol`, String(val));\n }, []);\n\n const clearAtcRetry = useCallback(() => {\n if (retryTimerRef.current) {\n clearTimeout(retryTimerRef.current);\n retryTimerRef.current = null;\n }\n }, []);\n\n const startMusic = useCallback(() => {\n const tracks = tracksRef.current;\n const t = tracks[trackIndexRef.current];\n const audio = musicRef.current;\n if (!audio || !t) return;\n setMusicError(\"\");\n audio.src = t.url;\n audio.load();\n audio.play().catch(() => {});\n setTrackName(`\\u266B ${t.title}`);\n }, []);\n\n const tryDifferentAirport = useCallback(() => {\n if (atcAirportRetryRef.current >= MAX_ATC_AIRPORT_RETRIES) {\n setStatus(\"error\");\n setStatusText(\"no streams available\");\n return;\n }\n triedAirportsRef.current.add(airport.icao);\n const candidates = AIRPORTS.filter((a) => !triedAirportsRef.current.has(a.icao));\n if (candidates.length === 0) {\n setStatus(\"error\");\n setStatusText(\"no streams available\");\n return;\n }\n const next = candidates[Math.floor(Math.random() * candidates.length)];\n const delayIdx = Math.min(atcAirportRetryRef.current, AIRPORT_SWITCH_DELAYS.length - 1);\n const delay = AIRPORT_SWITCH_DELAYS[delayIdx];\n atcAirportRetryRef.current++;\n setStatus(\"connecting\");\n setStatusText(`trying ${next.icao} in ${Math.round(delay / 1000)}s...`);\n retryTimerRef.current = setTimeout(() => {\n if (!isPlayingRef.current) return;\n setStatusText(`trying ${next.icao}...`);\n navigate(`/${next.icao.toLowerCase()}`, { replace: true });\n }, delay) as unknown as number;\n }, [airport.icao, navigate]);\n\n const scheduleAtcRetry = useCallback(() => {\n if (!isPlayingRef.current) return;\n\n if (retryCountRef.current < ATC_MAX_RETRIES) {\n const delayIdx = Math.min(retryCountRef.current, ATC_RETRY_DELAYS.length - 1);\n const delay = ATC_RETRY_DELAYS[delayIdx];\n retryCountRef.current++;\n setStatus(\"connecting\");\n setStatusText(`reconnecting (${retryCountRef.current})...`);\n retryTimerRef.current = setTimeout(() => connectAtc(), delay) as unknown as number;\n return;\n }\n\n // Exhausted all retries — try a different airport\n tryDifferentAirport();\n }, [tryDifferentAirport]);\n\n const connectAtc = useCallback(() => {\n if (!isPlayingRef.current) return;\n const audio = atcRef.current;\n if (!audio) return;\n\n setStatus(\"connecting\");\n setStatusText(\"connecting...\");\n\n // Proxy tries multiple LiveATC servers internally\n const url = `/proxy-atc?mount=${encodeURIComponent(airport.mount)}&t=${Date.now()}`;\n audio.src = url;\n audio.load();\n audio.play().catch(() => {\n scheduleAtcRetry();\n });\n }, [airport.mount, scheduleAtcRetry]);\n\n const startAtc = useCallback(() => {\n clearAtcRetry();\n retryCountRef.current = 0;\n connectAtc();\n }, [clearAtcRetry, connectAtc]);\n\n const skipTrack = useCallback(() => {\n if (!isPlayingRef.current) return;\n trackIndexRef.current = (trackIndexRef.current + 1) % tracksRef.current.length;\n startMusic();\n }, [startMusic]);\n\n const togglePlay = useCallback(() => {\n if (!isPlaying) {\n setIsPlaying(true);\n const mv = musicVolRef.current ? parseInt(musicVolRef.current.value) : 75;\n const av = atcVolRef.current ? parseInt(atcVolRef.current.value) : 35;\n setVolume(\"music\", mv);\n setVolume(\"atc\", av);\n startMusic();\n // startAtc will run via effect\n } else {\n setIsPlaying(false);\n clearAtcRetry();\n setStatus(\"hidden\");\n setStatusText(\"\");\n setTrackName(\"\\u266B\");\n setMusicError(\"\");\n musicFailCountRef.current = 0;\n if (musicRef.current) {\n musicRef.current.pause();\n musicRef.current.src = \"\";\n }\n if (atcRef.current) {\n atcRef.current.pause();\n atcRef.current.src = \"\";\n }\n }\n }, [isPlaying, setVolume, startMusic, clearAtcRetry]);\n\n // Start ATC when isPlaying turns true\n useEffect(() => {\n if (isPlaying) {\n startAtc();\n }\n return () => clearAtcRetry();\n }, [isPlaying, airport.mount]);\n\n // ATC audio event listeners\n useEffect(() => {\n const audio = atcRef.current;\n if (!audio) return;\n\n const onPlaying = () => {\n retryCountRef.current = 0;\n atcAirportRetryRef.current = 0;\n triedAirportsRef.current.clear();\n setStatus(\"live\");\n setStatusText(\"live\");\n };\n const onError = () => {\n if (!isPlayingRef.current) return;\n scheduleAtcRetry();\n };\n const onStalled = () => {\n if (isPlayingRef.current) {\n setStatus(\"connecting\");\n setStatusText(\"buffering...\");\n }\n };\n\n audio.addEventListener(\"playing\", onPlaying);\n audio.addEventListener(\"error\", onError);\n audio.addEventListener(\"stalled\", onStalled);\n audio.addEventListener(\"waiting\", onStalled);\n\n return () => {\n audio.removeEventListener(\"playing\", onPlaying);\n audio.removeEventListener(\"error\", onError);\n audio.removeEventListener(\"stalled\", onStalled);\n audio.removeEventListener(\"waiting\", onStalled);\n };\n }, [scheduleAtcRetry]);\n\n // Music ended → next track; music error → auto-skip\n useEffect(() => {\n const audio = musicRef.current;\n if (!audio) return;\n const onEnded = () => {\n musicFailCountRef.current = 0; // reset on successful play\n trackIndexRef.current = (trackIndexRef.current + 1) % tracksRef.current.length;\n startMusic();\n };\n const onMusicError = () => {\n if (!isPlayingRef.current) return;\n musicFailCountRef.current++;\n if (musicFailCountRef.current >= MAX_MUSIC_FAILURES) {\n setMusicError(\"music tracks unavailable\");\n setTrackName(\"♫ —\");\n return;\n }\n // Auto-skip to next track\n setMusicError(\"skipping…\");\n trackIndexRef.current = (trackIndexRef.current + 1) % tracksRef.current.length;\n setTimeout(() => startMusic(), 500);\n };\n const onCanPlay = () => {\n musicFailCountRef.current = 0;\n setMusicError(\"\");\n };\n audio.addEventListener(\"ended\", onEnded);\n audio.addEventListener(\"error\", onMusicError);\n audio.addEventListener(\"canplay\", onCanPlay);\n return () => {\n audio.removeEventListener(\"ended\", onEnded);\n audio.removeEventListener(\"error\", onMusicError);\n audio.removeEventListener(\"canplay\", onCanPlay);\n };\n }, [startMusic]);\n\n // Keyboard shortcuts\n useEffect(() => {\n const handler = (e: KeyboardEvent) => {\n if ((e.target as HTMLElement).tagName === \"INPUT\") {\n if (e.key === \"Escape\") (e.target as HTMLElement).blur();\n return;\n }\n switch (e.code) {\n case \"Space\":\n e.preventDefault();\n togglePlay();\n break;\n case \"ArrowRight\":\n e.preventDefault();\n nudgeVol(\"atc\", 5);\n break;\n case \"ArrowLeft\":\n e.preventDefault();\n nudgeVol(\"atc\", -5);\n break;\n case \"ArrowUp\":\n e.preventDefault();\n nudgeVol(\"music\", 5);\n break;\n case \"ArrowDown\":\n e.preventDefault();\n nudgeVol(\"music\", -5);\n break;\n case \"KeyN\":\n skipTrack();\n break;\n case \"Escape\":\n navigate(\"/landing\");\n break;\n }\n };\n document.addEventListener(\"keydown\", handler);\n return () => document.removeEventListener(\"keydown\", handler);\n }, [togglePlay, skipTrack, navigate]);\n\n function nudgeVol(type: \"music\" | \"atc\", delta: number) {\n const slider = type === \"music\" ? musicVolRef.current : atcVolRef.current;\n if (!slider) return;\n const newVal = Math.max(0, Math.min(100, parseInt(slider.value) + delta));\n slider.value = String(newVal);\n setVolume(type, newVal);\n }\n\n function toggleMute(type: \"music\" | \"atc\") {\n if (type === \"music\") {\n const next = !musicMuted;\n setMusicMuted(next);\n if (musicRef.current) musicRef.current.muted = next;\n } else {\n const next = !atcMuted;\n setAtcMuted(next);\n if (atcRef.current) atcRef.current.muted = next;\n }\n }\n\n const statusColor =\n status === \"live\"\n ? \"text-[#22c55e]\"\n : status === \"error\"\n ? \"text-[#ef4444]\"\n : status === \"connecting\"\n ? \"text-[#eab308]\"\n : \"invisible\";\n\n const dotColor =\n status === \"live\"\n ? \"bg-[#22c55e] shadow-[0_0_8px_rgba(34,197,94,0.5)]\"\n : status === \"error\"\n ? \"bg-[#ef4444] shadow-[0_0_8px_rgba(239,68,68,0.5)]\"\n : \"bg-[#eab308] shadow-[0_0_8px_rgba(234,179,8,0.5)]\";\n\n return (\n

\n {/* Airport info — click to change */}\n navigate(\"/landing\")}\n title=\"Change airport\"\n >\n

\n {airport.icao}\n

\n {airport.name}\n

\n {airport.city} · {airport.type}\n

\n\n {/* Play button */}\n \n {isPlaying\n ? (\n \n )\n : (\n \n )}\n \n\n {/* Status */}\n

\n {status !== \"hidden\" && (\n <>\n

\n {statusText}\n \n )}\n

\n\n {/* Volume controls */}\n

\n toggleMute(\"music\")}\n >\n music\n \n setVolume(\"music\", parseInt((e.target as HTMLInputElement).value))}\n />\n

\n toggleMute(\"atc\")}\n >\n atc\n \n setVolume(\"atc\", parseInt((e.target as HTMLInputElement).value))}\n />\n

\n\n {/* Track info + skip */}\n

\n \n {musicError || trackName}\n \n \n skip ▸\n \n

\n\n {/* Change airport */}\n navigate(\"/landing\")}\n >\n change airport\n \n\n {/* Keyboard hints */}\n

\n space play · ←\n → atc · ↑\n ↓ music · n skip · esc back\n

\n\n {/* Footer */}\n

\n inspired by{\" \"}\n \n lofiatc.com\n {\" \"}\n · atc from{\" \"}\n \n liveatc.net\n {\" \"}\n ·{\" \"}\n \n view source\n \n

\n\n {/* Audio elements */}\n

\n );\n}\n\nfunction Kbd({ children }: { children: React.ReactNode }) {\n return (\n \n {children}\n \n );\n}\n",[],[194,250],"ae7a48ea-303a-11f1-9a66-42dde27851f2","Player.loader.ts","ae7a49da-303a-11f1-9a66-42dde27851f2",20,["D",1775316401862],"import { AIRPORTS } from \"../airports.ts\";\nimport type { LoaderFunctionArgs } from \"https://esm.sh/react-router@7.5.0?deps=react@18.2.0,react-dom@18.2.0\";\n\nexport function loader({ params }: LoaderFunctionArgs) {\n const icao = (params.icao || \"\").toUpperCase();\n const airport = AIRPORTS.find((a) => a.icao === icao);\n if (!airport) {\n throw new Response(\"Airport not found\", { status: 404 });\n }\n return { airport };\n}\n",[],[194,259],"49176274-303c-11f1-8f77-42dde27851f2","Landing.tsx","ac14af8c-303a-11f1-885f-42dde27851f2",36,["D",1775317090750],7,"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useRef, useEffect } from \"https://esm.sh/react@18.2.0\";\nimport { useNavigate } from \"https://esm.sh/react-router@7.5.0?deps=react@18.2.0,react-dom@18.2.0\";\nimport { AIRPORTS, REGION_LABELS } from \"../airports.ts\";\nimport type { Airport } from \"../airports.ts\";\n\nexport function Landing() {\n const [query, setQuery] = useState(\"\");\n const [showResults, setShowResults] = useState(true);\n const searchBoxRef = useRef(null);\n const inputRef = useRef(null);\n const navigate = useNavigate();\n\n useEffect(() => {\n inputRef.current?.focus();\n const handler = (e: MouseEvent) => {\n if (searchBoxRef.current && !searchBoxRef.current.contains(e.target as Node)) {\n setShowResults(false);\n }\n };\n document.addEventListener(\"click\", handler);\n return () => document.removeEventListener(\"click\", handler);\n }, []);\n\n const matches = query.trim()\n ? AIRPORTS.filter((a) => {\n const q = query.trim().toLowerCase();\n return (\n a.icao.toLowerCase().includes(q)\n || a.name.toLowerCase().includes(q)\n || a.city.toLowerCase().includes(q)\n || a.country.toLowerCase().includes(q)\n );\n }).slice(0, 30)\n : AIRPORTS.slice(0, 30);\n\n const grouped: Record = {};\n for (const a of matches) {\n if (!grouped[a.region]) grouped[a.region] = [];\n grouped[a.region].push(a);\n }\n\n function selectAirport(icao: string) {\n navigate(`/${icao.toLowerCase()}`);\n }\n\n function pickRandom() {\n const a = AIRPORTS[Math.floor(Math.random() * AIRPORTS.length)];\n selectAirport(a.icao);\n }\n\n function handleKeyDown(e: React.KeyboardEvent) {\n if (e.key === \"Enter\") {\n const q = query.trim().toLowerCase();\n const exact = AIRPORTS.find((a) => a.icao.toLowerCase() === q);\n if (exact) {\n selectAirport(exact.icao);\n } else if (matches.length > 0) {\n selectAirport(matches[0].icao);\n }\n }\n }\n\n return (\n

\n lofi air traffic control\n

\n {AIRPORTS.length} airports worldwide\n

\n\n

\n {\n setQuery(e.target.value);\n setShowResults(true);\n }}\n onFocus={() => setShowResults(true)}\n onKeyDown={handleKeyDown}\n />\n\n {showResults && (\n

\n {Object.entries(grouped).map(([region, items]) => (\n

\n {REGION_LABELS[region] || region}\n

\n {items.map((ap) => (\n selectAirport(ap.icao)}\n >\n {ap.icao}\n \n {ap.name}\n \n {ap.city}\n

\n ))}\n

\n )}\n

\n\n

\n\n \n Random airport\n \n \n );\n}\n",[],[194,267],"9efd5a42-303a-11f1-a085-42dde27851f2","Landing.loader.ts","9efd5af6-303a-11f1-a085-42dde27851f2",18,["D",1775316375873],"import { AIRPORTS } from \"../airports.ts\";\nimport { redirect } from \"https://esm.sh/react-router@7.5.0?deps=react@18.2.0,react-dom@18.2.0\";\n\nexport function loader() {\n const airport = AIRPORTS[Math.floor(Math.random() * AIRPORTS.length)];\n return redirect(`/${airport.icao.toLowerCase()}`);\n}\n",[],[194,276],"9c987156-303a-11f1-8836-42dde27851f2","App.tsx","9c98721e-303a-11f1-8836-42dde27851f2",17,["D",1775316371857],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { Outlet } from \"https://esm.sh/react-router@7.5.0?deps=react@18.2.0,react-dom@18.2.0\";\n\nexport function App() {\n return (\n

\n {/* Background gradient */}\n \n

\n \n

\n );\n}\n",[],[194,284],["D",1775316363986],[211,212,213,214,215],[194],["D",1775313656208],{"_97":96,"_104":100},{"_97":96,"_98":-5,"_99":100,"_18":55,"_101":102,"_103":25},{"_13":86,"_32":87,"_43":42,"_88":44,"_89":-5,"_90":-5,"_91":-5,"_92":-5,"_93":-5,"_94":45,"_95":96},"ctx",{"_79":-5,"_123":331,"_332":333,"_334":335,"_336":25,"_337":25,"_338":25,"_339":59,"_340":-5,"_341":-7,"_342":-7,"_343":63,"_344":25,"_345":25,"_346":-5,"_347":25,"_348":25,"_349":25,"_350":-5},"ENV",{"_302":303,"_304":305,"_306":87,"_307":308,"_309":310,"_311":312,"_313":314,"_315":316,"_317":318,"_319":320,"_321":322,"_323":324,"_325":326,"_327":328,"_329":330},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","e87eb04e707cf64e7e532c8e8ec395f209e17f15","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 · v81