Web Terminal

\n \n \n \n\n",[18,89],"207ea958-56a7-11f1-bca4-ee650bb23af1",["D",1779541122909],"\n",[18,95],"207ea638-56a7-11f1-bca4-ee650bb23af1",["D",1779541122909],[18,100],"pulls","branches","forks","envVars",{"_96":26,"_231":26},"connections",{"_96":26,"_230":26},"unfilledCount","emptyCount",{"_34":197,"_13":18,"_75":110,"_44":-5,"_36":37,"_198":41,"_199":24,"_38":275,"_40":26,"_78":101,"_201":-5,"_80":30,"_202":-5,"_246":276,"_17":277},{"_34":220,"_13":100,"_75":99,"_44":110,"_36":37,"_198":41,"_199":24,"_38":272,"_40":26,"_78":101,"_201":-5,"_80":30,"_202":-5,"_246":273,"_17":274},{"_34":265,"_13":266,"_75":267,"_44":99,"_36":37,"_198":97,"_199":24,"_38":268,"_40":41,"_78":79,"_201":269,"_80":30,"_202":-5,"_246":270,"_17":271},{"_34":216,"_13":95,"_75":94,"_44":110,"_36":37,"_198":41,"_199":24,"_38":262,"_40":26,"_78":21,"_201":218,"_80":30,"_202":-5,"_246":263,"_17":264},{"_34":212,"_13":89,"_75":88,"_44":110,"_36":37,"_198":104,"_199":24,"_38":259,"_40":41,"_78":21,"_201":214,"_80":30,"_202":-5,"_246":260,"_17":261},{"_34":208,"_13":77,"_75":76,"_44":110,"_36":37,"_198":41,"_199":24,"_38":256,"_40":26,"_78":79,"_201":210,"_80":30,"_202":-5,"_246":257,"_17":258},{"_34":249,"_13":250,"_75":251,"_44":-5,"_36":37,"_198":146,"_199":24,"_38":252,"_40":41,"_78":21,"_201":253,"_80":30,"_202":-5,"_246":254,"_17":255},{"_34":240,"_13":241,"_75":122,"_44":-5,"_36":37,"_198":242,"_199":24,"_38":243,"_40":41,"_78":244,"_201":245,"_80":30,"_202":-5,"_246":247,"_17":248},"31239354-56a7-11f1-83ab-ee650bb23af1","index.ts",3,["D",1779541150902],"http","import { parseVal, serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { Hono } from \"npm:hono\";\n\nconst app = new Hono();\n\napp.get(\"/\", () => serveFile(\"/frontend/index.html\"));\napp.get(\"/frontend/**/*\", (c) => serveFile(c.req.path));\napp.get(\"/source\", (c) => c.redirect(parseVal().links.self.val));\n\n// API: execute terminal commands\napp.post(\"/api/exec\", async (c) => {\n const { command } = await c.req.json();\n if (!command || typeof command !== \"string\") {\n return c.json({ error: \"No command provided\" });\n }\n\n const trimmed = command.trim();\n const parts = trimmed.split(/\\s+/);\n const cmd = parts[0]?.toLowerCase();\n\n try {\n switch (cmd) {\n case \"help\": {\n return c.json({\n output: `Available commands:\n fetch - GET request, show response body\n post [json] - POST request with optional JSON body\n head - Show response headers\n status - Show HTTP status code\n dns - DNS lookup (via DoH)\n ping - Check if a URL is reachable\n time - Show current UTC time\n echo - Echo back text\n base64e - Base64 encode\n base64d - Base64 decode\n urlencode - URL encode\n urldecode - URL decode\n ip - Show your public IP\n clear - Clear terminal\n help - Show this help`,\n });\n }\n\n case \"fetch\": {\n const url = ensureUrl(parts[1]);\n if (!url) return c.json({ error: \"Usage: fetch \" });\n const res = await fetch(url);\n const contentType = res.headers.get(\"content-type\") || \"\";\n let body: string;\n if (contentType.includes(\"json\")) {\n body = JSON.stringify(await res.json(), null, 2);\n } else {\n body = await res.text();\n if (body.length > 5000) body = body.slice(0, 5000) + \"\\n... (truncated)\";\n }\n return c.json({ output: `HTTP ${res.status} ${res.statusText}\\n\\n${body}` });\n }\n\n case \"post\": {\n const url = ensureUrl(parts[1]);\n if (!url) return c.json({ error: \"Usage: post [json]\" });\n const jsonStr = parts.slice(2).join(\" \") || \"{}\";\n let body: any;\n try {\n body = JSON.parse(jsonStr);\n } catch {\n return c.json({ error: \"Invalid JSON body\" });\n }\n const res = await fetch(url, {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify(body),\n });\n const contentType = res.headers.get(\"content-type\") || \"\";\n let resBody: string;\n if (contentType.includes(\"json\")) {\n resBody = JSON.stringify(await res.json(), null, 2);\n } else {\n resBody = await res.text();\n if (resBody.length > 5000) resBody = resBody.slice(0, 5000) + \"\\n... (truncated)\";\n }\n return c.json({ output: `HTTP ${res.status} ${res.statusText}\\n\\n${resBody}` });\n }\n\n case \"head\":\n case \"headers\": {\n const url = ensureUrl(parts[1]);\n if (!url) return c.json({ error: \"Usage: head \" });\n const res = await fetch(url, { method: \"HEAD\" });\n const headers = Array.from(res.headers.entries())\n .map(([k, v]) => ` ${k}: ${v}`)\n .join(\"\\n\");\n return c.json({ output: `HTTP ${res.status} ${res.statusText}\\n\\nHeaders:\\n${headers}` });\n }\n\n case \"status\": {\n const url = ensureUrl(parts[1]);\n if (!url) return c.json({ error: \"Usage: status \" });\n const res = await fetch(url, { method: \"HEAD\" });\n return c.json({ output: `${res.status} ${res.statusText}` });\n }\n\n case \"dns\": {\n const domain = parts[1];\n if (!domain) return c.json({ error: \"Usage: dns \" });\n const res = await fetch(`https://dns.google/resolve?name=${encodeURIComponent(domain)}&type=A`);\n const data = await res.json();\n if (!data.Answer || data.Answer.length === 0) {\n return c.json({ output: `No DNS records found for ${domain}` });\n }\n const records = data.Answer.map(\n (r: any) => ` ${r.name} ${r.type === 1 ? \"A\" : r.type === 28 ? \"AAAA\" : r.type} ${r.data} TTL:${r.TTL}`,\n ).join(\"\\n\");\n return c.json({ output: `DNS records for ${domain}:\\n${records}` });\n }\n\n case \"ping\": {\n const url = ensureUrl(parts[1]);\n if (!url) return c.json({ error: \"Usage: ping \" });\n const start = Date.now();\n try {\n const res = await fetch(url, { method: \"HEAD\" });\n const ms = Date.now() - start;\n return c.json({ output: `✅ ${url} is reachable\\n Status: ${res.status}\\n Time: ${ms}ms` });\n } catch (e: any) {\n const ms = Date.now() - start;\n return c.json({ output: `❌ ${url} is unreachable\\n Error: ${e.message}\\n Time: ${ms}ms` });\n }\n }\n\n case \"time\": {\n return c.json({ output: new Date().toISOString() });\n }\n\n case \"echo\": {\n return c.json({ output: parts.slice(1).join(\" \") });\n }\n\n case \"base64e\": {\n const text = parts.slice(1).join(\" \");\n if (!text) return c.json({ error: \"Usage: base64e \" });\n return c.json({ output: btoa(text) });\n }\n\n case \"base64d\": {\n const text = parts[1];\n if (!text) return c.json({ error: \"Usage: base64d \" });\n try {\n return c.json({ output: atob(text) });\n } catch {\n return c.json({ error: \"Invalid base64 string\" });\n }\n }\n\n case \"urlencode\": {\n const text = parts.slice(1).join(\" \");\n if (!text) return c.json({ error: \"Usage: urlencode \" });\n return c.json({ output: encodeURIComponent(text) });\n }\n\n case \"urldecode\": {\n const text = parts[1];\n if (!text) return c.json({ error: \"Usage: urldecode \" });\n try {\n return c.json({ output: decodeURIComponent(text) });\n } catch {\n return c.json({ error: \"Invalid encoded string\" });\n }\n }\n\n case \"ip\": {\n const res = await fetch(\"https://httpbin.org/ip\");\n const data = await res.json();\n return c.json({ output: `Public IP: ${data.origin}` });\n }\n\n case \"clear\": {\n return c.json({ clear: true });\n }\n\n default: {\n return c.json({\n error: `Unknown command: ${cmd}\\nType 'help' for available commands.`,\n });\n }\n }\n } catch (e: any) {\n return c.json({ error: `Error: ${e.message}` });\n }\n});\n\nfunction ensureUrl(url?: string): string | null {\n if (!url) return null;\n if (!url.startsWith(\"http://\") && !url.startsWith(\"https://\")) {\n return \"https://\" + url;\n }\n return url;\n}\n\napp.onError((err) => Promise.reject(err));\nexport default app.fetch;\n","children",[],[241],"479b555e-56a7-11f1-a150-ee650bb23af1","README.md","019e54ea-9f9c-71e9-a735-fdbf4d258d38",["D",1779541188540],"# 🌐 Web Terminal\n\nA web-based network terminal that lets you make HTTP requests, DNS lookups, and more — all from your browser.\n\n## Commands\n\n| Command | Description |\n|---------|-------------|\n| `fetch ` | GET request, show response |\n| `post [json]` | POST with optional JSON body |\n| `head ` | Show response headers |\n| `status ` | Show HTTP status code |\n| `dns ` | DNS lookup |\n| `ping ` | Check if URL is reachable |\n| `ip` | Show public IP |\n| `time` | Current UTC time |\n| `base64e / base64d` | Base64 encode/decode |\n| `urlencode / urldecode` | URL encode/decode |\n| `echo ` | Echo text |\n| `clear` | Clear screen |\n| `help` | Show help |\n",[],[250],["D",1779541122909],[],[18,77],["D",1779541127904],[],[18,89],["D",1779541122909],[],[18,95],"3e000918-56a7-11f1-bca4-ee650bb23af1","App.tsx","019e54ea-9f9c-71e9-a735-e367c8457e0c",["D",1779541172478],"/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { useState, useRef, useEffect, useCallback } from \"https://esm.sh/react@18.2.0\";\n\ninterface Line {\n type: \"input\" | \"output\" | \"error\" | \"system\";\n text: string;\n}\n\nexport function App() {\n const [lines, setLines] = useState([\n { type: \"system\", text: \"╔══════════════════════════════════════════╗\" },\n { type: \"system\", text: \"║ 🌐 Web Terminal v1.0 ║\" },\n { type: \"system\", text: \"║ Network tools powered by Val Town ║\" },\n { type: \"system\", text: \"╚══════════════════════════════════════════╝\" },\n { type: \"system\", text: \"\" },\n { type: \"system\", text: \"Type 'help' for available commands.\" },\n { type: \"system\", text: \"\" },\n ]);\n const [input, setInput] = useState(\"\");\n const [loading, setLoading] = useState(false);\n const [history, setHistory] = useState([]);\n const [historyIdx, setHistoryIdx] = useState(-1);\n const inputRef = useRef(null);\n const bottomRef = useRef(null);\n\n useEffect(() => {\n bottomRef.current?.scrollIntoView({ behavior: \"smooth\" });\n }, [lines]);\n\n useEffect(() => {\n inputRef.current?.focus();\n }, []);\n\n const exec = useCallback(async (command: string) => {\n if (!command.trim()) return;\n\n setLines((prev) => [...prev, { type: \"input\", text: `$ ${command}` }]);\n setHistory((prev) => [...prev, command]);\n setHistoryIdx(-1);\n setInput(\"\");\n\n if (command.trim().toLowerCase() === \"clear\") {\n setLines([]);\n return;\n }\n\n setLoading(true);\n try {\n const res = await fetch(\"/api/exec\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\" },\n body: JSON.stringify({ command }),\n });\n const data = await res.json();\n\n if (data.clear) {\n setLines([]);\n } else if (data.error) {\n setLines((prev) => [...prev, { type: \"error\", text: data.error }]);\n } else if (data.output !== undefined) {\n setLines((prev) => [...prev, { type: \"output\", text: data.output }]);\n }\n } catch (e: any) {\n setLines((prev) => [...prev, { type: \"error\", text: `Network error: ${e.message}` }]);\n } finally {\n setLoading(false);\n setLines((prev) => [...prev, { type: \"system\", text: \"\" }]);\n }\n }, []);\n\n const handleKeyDown = (e: React.KeyboardEvent) => {\n if (e.key === \"Enter\" && !loading) {\n exec(input);\n } else if (e.key === \"ArrowUp\") {\n e.preventDefault();\n if (history.length > 0) {\n const newIdx = historyIdx === -1 ? history.length - 1 : Math.max(0, historyIdx - 1);\n setHistoryIdx(newIdx);\n setInput(history[newIdx]);\n }\n } else if (e.key === \"ArrowDown\") {\n e.preventDefault();\n if (historyIdx !== -1) {\n const newIdx = historyIdx + 1;\n if (newIdx >= history.length) {\n setHistoryIdx(-1);\n setInput(\"\");\n } else {\n setHistoryIdx(newIdx);\n setInput(history[newIdx]);\n }\n }\n }\n };\n\n const colorClass = (type: Line[\"type\"]) => {\n switch (type) {\n case \"input\": return \"text-cyan-400\";\n case \"output\": return \"text-green-300\";\n case \"error\": return \"text-red-400\";\n case \"system\": return \"text-gray-400\";\n }\n };\n\n return (\n inputRef.current?.focus()}\n >\n {/* Title bar */}\n

\n 🌐 Web Terminal\n \n view source\n \n

\n\n {/* Terminal body */}\n

\n {lines.map((line, i) => (\n

{line.text}

\n ))}\n\n {/* Input line */}\n

\n $\n setInput((e.target as HTMLInputElement).value)}\n onKeyDown={handleKeyDown}\n disabled={loading}\n class=\"flex-1 bg-transparent border-none outline-none text-green-400 font-mono text-sm caret-green-400\"\n placeholder={loading ? \"executing...\" : \"type a command...\"}\n autoFocus\n spellCheck={false}\n autoComplete=\"off\"\n />\n {loading && ⏳}\n

\n );\n}\n",[],[18,100,266],["D",1779541122909],[234],[18,100],["D",1779541122909],[233,235,236,237],[18],["D",1779541122909],{"_11":12,"_162":83},{"_11":12,"_158":83,"_82":83,"_31":81,"_159":160,"_161":30},{"_40":146,"_13":16,"_34":37,"_147":112,"_148":72,"_149":150,"_151":116,"_152":153,"_154":155,"_156":14,"_157":12},"ctx",{"_53":-5,"_183":315,"_316":317,"_318":319,"_320":30,"_321":30,"_322":30,"_323":24,"_324":-5,"_325":-7,"_326":-7,"_327":26,"_328":30,"_329":30,"_330":-5,"_331":30,"_332":30,"_333":30,"_334":-5},"ENV",{"_286":287,"_288":289,"_290":16,"_291":292,"_293":294,"_295":296,"_297":298,"_299":300,"_301":302,"_303":304,"_305":306,"_307":308,"_309":310,"_311":312,"_313":314},"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"]

History · frontend