[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_268":269,"_270":271},"routes/_app.x.$handle.$name",{"_104":103,"_38":52,"_112":94,"_33":113,"_13":14,"_114":-5,"_11":115,"_116":117,"_118":119,"_120":121,"_122":123,"_26":-5,"_124":-5,"_125":-5,"_126":31,"_127":128,"_129":66,"_130":-5,"_131":-5,"_132":133},"routes/_app.x.$handle.$name.branch.$branch.version.$version.diff",{"_11":12,"_13":14,"_15":16,"_17":18,"_19":-5},"project",{"_50":51,"_38":52,"_45":53,"_54":-5,"_55":31,"_56":57,"_58":57,"_59":60,"_61":-5,"_19":62,"_63":64,"_65":66,"_67":-5,"_68":-5,"_69":70,"_71":72,"_73":-5,"_74":-5,"_75":-5,"_76":-5,"_77":78,"_79":78,"_80":81,"_82":81,"_83":81,"_84":78,"_85":78,"_86":87,"_88":89,"_90":91,"_92":31},"version",34,"changes",[25],"aiChatInfo",{"_20":21,"_22":-5,"_23":-5,"_24":-5},"userId","aiChatMessageId","d4696b5b-c274-4ed6-ac0e-48654699948d","aiChatThreadId","aiChatThreadUserId","aiChatThreadTitle",{"_26":27,"_28":29,"_30":31,"_32":31,"_33":34,"_35":34},"file",{"_36":37,"_38":39,"_40":41,"_42":44,"_45":46,"_47":14,"_48":49,"_30":31},"previous",{"_36":37,"_38":39,"_40":41,"_42":43},"deleted",false,"deletedHere","path","routes/Player.tsx","latestPath","fileId","d1bf42b0-303a-11f1-90c1-42dde27851f2","name","Player.tsx","fileType","script","content","/** @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 type { Airport } from \"../airports.ts\";\nimport { shuffleTracks } from \"../tracks.ts\";\n\nconst ATC_MAX_RETRIES = 20;\nconst ATC_RETRY_DELAYS = [2000, 3000, 5000, 8000, 15000];\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\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\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 audio.src = t.url;\n audio.load();\n audio.play().catch(() => {});\n setTrackName(`\\u266B ${t.title}`);\n }, []);\n\n const scheduleAtcRetry = useCallback(() => {\n if (!isPlayingRef.current || retryCountRef.current >= ATC_MAX_RETRIES) {\n setStatus(\"error\");\n setStatusText(\"stream unavailable\");\n return;\n }\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 }, []);\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 const proxyUrl = `/proxy-atc?mount=${encodeURIComponent(airport.mount)}&t=${Date.now()}`;\n audio.src = proxyUrl;\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 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 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\n useEffect(() => {\n const audio = musicRef.current;\n if (!audio) return;\n const onEnded = () => {\n trackIndexRef.current = (trackIndexRef.current + 1) % tracksRef.current.length;\n startMusic();\n };\n audio.addEventListener(\"ended\", onEnded);\n return () => audio.removeEventListener(\"ended\", onEnded);\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 {trackName}\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","/** @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 type { Airport } from \"../airports.ts\";\nimport { shuffleTracks } from \"../tracks.ts\";\n\nconst ATC_MAX_RETRIES = 20;\nconst ATC_RETRY_DELAYS = [2000, 3000, 5000, 8000, 15000];\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\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\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 audio.src = t.url;\n audio.load();\n audio.play().catch(() => {});\n setTrackName(`\\u266B ${t.title}`);\n }, []);\n\n const scheduleAtcRetry = useCallback(() => {\n if (!isPlayingRef.current || retryCountRef.current >= ATC_MAX_RETRIES) {\n setStatus(\"error\");\n setStatusText(\"stream unavailable\");\n return;\n }\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 }, []);\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 const proxyUrl = `/proxy-atc?mount=${encodeURIComponent(airport.mount)}&t=${Date.now()}`;\n audio.src = proxyUrl;\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 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 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\n useEffect(() => {\n const audio = musicRef.current;\n if (!audio) return;\n const onEnded = () => {\n trackIndexRef.current = (trackIndexRef.current + 1) % tracksRef.current.length;\n startMusic();\n };\n audio.addEventListener(\"ended\", onEnded);\n return () => audio.removeEventListener(\"ended\", onEnded);\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 {trackName}\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","createdAt",["D",1775317089013],"branchVersion","branchId","49f0fdd4-3034-11f1-9cd7-42dde27851f2","id","49f07076-3034-11f1-9cd7-42dde27851f2","lofiatc",["D",1775313656208],"deletedAt","legacyEnvVars","privacy","public","httpPrivacy","description","Clone of lofiatc.com","imageUrl","a0bf3b31-15a5-4d5c-880e-4b1e22c9bc18","pinnedFileId","de304b02-303a-11f1-90c1-42dde27851f2","pinPreview",true,"pinMigrated","screenshotVersion","likeCount",0,"orgId","e81e7335-6d4c-4764-a902-d0962bbfa9f7","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_104":103,"_111":107},"org",{"_104":103,"_105":-5,"_106":107,"_19":62,"_108":109,"_110":31},"branch",{"_13":93,"_38":94,"_50":49,"_95":51,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":52,"_102":103},"isOwned",83,"main","projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","stevekrouse","handle","displayName","avatar","https://images.clerk.dev/uploaded/img_2PqHa2Gsy93xQrjh2w78Xu0cChW.jpeg","tier","pro","canRestrictVals","profileImageUrl","branchName","","adoptOrgId",{"_50":51,"_38":52,"_45":264,"_54":-5,"_55":31,"_56":57,"_58":57,"_59":60,"_61":-5,"_19":62,"_63":64,"_65":66,"_67":-5,"_68":-5,"_69":70,"_71":72,"_73":-5,"_74":-5,"_75":-5,"_76":-5,"_77":78,"_79":78,"_80":81,"_82":81,"_83":81,"_84":78,"_85":78,"_86":265,"_88":266,"_90":267,"_92":31},"tree",[196,202,203,204,205,206],"files",[196,197,198,199,200,201,202,203,204,205,206],"counts",{"_186":70,"_187":176,"_188":70,"_189":190,"_191":192},"contents",[134,135,136,137,138,139],"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},{"_50":179,"_38":180,"_36":181,"_143":-5,"_48":49,"_47":182,"_145":66,"_45":183,"_13":70,"_40":184,"_42":-5,"_30":31,"_148":-5,"_33":185},{"_50":171,"_38":172,"_36":173,"_143":-5,"_48":49,"_47":174,"_145":66,"_45":175,"_13":176,"_40":26,"_42":177,"_30":31,"_148":-5,"_33":178},{"_50":164,"_38":165,"_36":166,"_143":-5,"_48":49,"_47":167,"_145":66,"_45":168,"_13":70,"_40":41,"_42":169,"_30":31,"_148":-5,"_33":170},{"_50":157,"_38":158,"_36":64,"_143":-5,"_48":49,"_47":159,"_145":31,"_45":160,"_13":70,"_40":161,"_42":162,"_30":31,"_148":-5,"_33":163},{"_50":150,"_38":151,"_36":152,"_143":-5,"_48":49,"_47":153,"_145":66,"_45":154,"_13":70,"_40":41,"_42":155,"_30":31,"_148":-5,"_33":156},{"_50":140,"_38":141,"_36":142,"_143":-5,"_48":49,"_47":144,"_145":31,"_45":146,"_13":70,"_40":41,"_42":147,"_30":31,"_148":-5,"_33":149},"96420362-303a-11f1-a218-42dde27851f2","tracks.ts","96420434-303a-11f1-a218-42dde27851f2","parentId",15,"latest",["D",1775316360984],"export interface Track {\n url: string;\n title: string;\n}\n\nexport const TRACKS: Track[] = [\n { url: \"https://cdn.pixabay.com/audio/2022/05/27/audio_1808fbf07a.mp3\", title: \"Chill Vibes\" },\n { url: \"https://cdn.pixabay.com/audio/2022/01/18/audio_d0a13f69d2.mp3\", title: \"Rainy Afternoon\" },\n { url: \"https://cdn.pixabay.com/audio/2021/11/25/audio_91b32e02f9.mp3\", title: \"Late Night Study\" },\n { url: \"https://cdn.pixabay.com/audio/2022/11/22/audio_febc508520.mp3\", title: \"Coffee Shop\" },\n { url: \"https://cdn.pixabay.com/audio/2022/08/02/audio_884fe92c21.mp3\", title: \"Dreamy Beats\" },\n { url: \"https://cdn.pixabay.com/audio/2022/05/16/audio_460b6ef6a4.mp3\", title: \"Tokyo Midnight\" },\n { url: \"https://cdn.pixabay.com/audio/2023/07/19/audio_e552038bff.mp3\", title: \"Soft Focus\" },\n { url: \"https://cdn.pixabay.com/audio/2023/10/07/audio_4986e3afa1.mp3\", title: \"Gentle Rain\" },\n { url: \"https://cdn.pixabay.com/audio/2022/10/25/audio_3712e1a460.mp3\", title: \"Warm Glow\" },\n { url: \"https://cdn.pixabay.com/audio/2023/04/17/audio_81368aa678.mp3\", title: \"Twilight Walk\" },\n { url: \"https://cdn.pixabay.com/audio/2023/01/16/audio_c8ab528a9f.mp3\", title: \"Rooftop Breeze\" },\n { url: \"https://cdn.pixabay.com/audio/2022/12/22/audio_b4cf34e546.mp3\", title: \"Cozy Blanket\" },\n { url: \"https://cdn.pixabay.com/audio/2023/09/04/audio_98422a5894.mp3\", title: \"Lazy Sunday\" },\n { url: \"https://cdn.pixabay.com/audio/2023/06/07/audio_b97de9df39.mp3\", title: \"Moonlit Pages\" },\n { url: \"https://cdn.pixabay.com/audio/2022/03/10/audio_5765af6738.mp3\", title: \"Cloudy Morning\" },\n];\n\n/** Returns a new shuffled copy of the tracks array */\nexport function shuffleTracks(): Track[] {\n const shuffled = [...TRACKS];\n for (let i = shuffled.length - 1; i > 0; i--) {\n const j = Math.floor(Math.random() * (i + 1));\n [shuffled[i], shuffled[j]] = [shuffled[j], shuffled[i]];\n }\n return shuffled;\n}\n","label",[141],"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",[151],"de304a44-303a-11f1-90c1-42dde27851f2","index.tsx",23,["D",1775316481905],"http","/**\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\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 {\n const streamUrl = `http://d.liveatc.net/${mount}`;\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 c.json({ error: `Stream returned ${resp.status}`, mount }, 502);\n }\n\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 },\n });\n } catch (err) {\n return c.json({ error: (err as Error).message, mount }, 502);\n }\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",[158],"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",[165],"43c12eea-303c-11f1-9d54-42dde27851f2","README.md","f076f1e4-303a-11f1-a218-42dde27851f2",32,["D",1775317081797],1,"# 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",[172],"97e82d40-303a-11f1-8836-42dde27851f2","routes","97e82e08-303a-11f1-8836-42dde27851f2",16,["D",1775316363986],"directory",[180],"pulls","branches","forks","envVars",{"_193":70,"_195":70},"connections",{"_193":70,"_194":70},"count","unfilledCount","emptyCount",{"_50":179,"_38":180,"_36":181,"_143":-5,"_48":49,"_47":182,"_145":66,"_45":261,"_13":70,"_40":184,"_42":-5,"_30":31,"_148":-5,"_208":262,"_33":263},{"_50":253,"_38":254,"_36":255,"_143":181,"_48":49,"_47":256,"_145":66,"_45":257,"_13":70,"_40":41,"_42":258,"_30":31,"_148":-5,"_208":259,"_33":260},{"_50":245,"_38":246,"_36":247,"_143":181,"_48":49,"_47":248,"_145":66,"_45":249,"_13":70,"_40":41,"_42":250,"_30":31,"_148":-5,"_208":251,"_33":252},{"_50":236,"_38":237,"_36":238,"_143":181,"_48":49,"_47":239,"_145":31,"_45":240,"_13":241,"_40":41,"_42":242,"_30":31,"_148":-5,"_208":243,"_33":244},{"_50":228,"_38":229,"_36":230,"_143":181,"_48":49,"_47":231,"_145":66,"_45":232,"_13":70,"_40":41,"_42":233,"_30":31,"_148":-5,"_208":234,"_33":235},{"_50":223,"_38":39,"_36":37,"_143":181,"_48":49,"_47":14,"_145":31,"_45":224,"_13":225,"_40":41,"_42":44,"_30":31,"_148":-5,"_208":226,"_33":227},{"_50":171,"_38":172,"_36":173,"_143":-5,"_48":49,"_47":174,"_145":66,"_45":220,"_13":176,"_40":26,"_42":177,"_30":31,"_148":-5,"_208":221,"_33":222},{"_50":164,"_38":165,"_36":166,"_143":-5,"_48":49,"_47":167,"_145":66,"_45":217,"_13":70,"_40":41,"_42":169,"_30":31,"_148":-5,"_208":218,"_33":219},{"_50":157,"_38":158,"_36":64,"_143":-5,"_48":49,"_47":159,"_145":31,"_45":214,"_13":70,"_40":161,"_42":162,"_30":31,"_148":-5,"_208":215,"_33":216},{"_50":150,"_38":151,"_36":152,"_143":-5,"_48":49,"_47":153,"_145":66,"_45":211,"_13":70,"_40":41,"_42":155,"_30":31,"_148":-5,"_208":212,"_33":213},{"_50":140,"_38":141,"_36":142,"_143":-5,"_48":49,"_47":144,"_145":31,"_45":207,"_13":70,"_40":41,"_42":147,"_30":31,"_148":-5,"_208":209,"_33":210},["D",1775316360984],"children",[],[141],["D",1775316467679],[],[151],["D",1775316481905],[],[158],["D",1775315624259],[],[165],["D",1775317081797],[],[172],"480de0f6-303c-11f1-b980-42dde27851f2",["D",1775317089013],3,[],[180,39],"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",[],[180,229],"cc06cbee-303b-11f1-8601-42dde27851f2","Landing.tsx","ac14af8c-303a-11f1-885f-42dde27851f2",31,["D",1775316880926],5,"/** @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",[],[180,237],"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",[],[180,246],"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",[],[180,254],["D",1775316363986],[197,198,199,200,201],[180],["D",1775313656208],{"_104":103,"_111":107},{"_104":103,"_105":-5,"_106":107,"_19":62,"_108":109,"_110":31},{"_13":93,"_38":94,"_50":49,"_95":51,"_96":-5,"_97":-5,"_98":-5,"_99":-5,"_100":-5,"_101":52,"_102":103},"ctx",{"_86":-5,"_131":301,"_302":303,"_304":305,"_306":31,"_307":31,"_308":31,"_309":66,"_310":-5,"_311":-7,"_312":-7,"_313":70,"_314":31,"_315":31,"_316":-5,"_317":31,"_318":31,"_319":31,"_320":-5},"ENV",{"_272":273,"_274":275,"_276":94,"_277":278,"_279":280,"_281":282,"_283":284,"_285":286,"_287":288,"_289":290,"_291":292,"_293":294,"_295":296,"_297":298,"_299":300},"REACT_APP_SENTRY_DSN","https://586020d86f05489db63a554690acf1e9@o1398359.ingest.sentry.io/6724499","RENDER_GIT_COMMIT","811aa22498c9b0b5a47e8d778de579cdb990f332","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 · v34