Web Terminal

\n \n \n \n\n","label",[178,68],"frontend","pulls","branches","forks","envVars",{"_186":26,"_188":26},"connections",{"_186":26,"_187":26},"count","unfilledCount","emptyCount",{"_33":246,"_13":178,"_66":170,"_43":-5,"_35":36,"_171":40,"_172":95,"_37":247,"_39":26,"_69":243,"_174":-5,"_70":24,"_176":-5,"_203":248,"_17":249},{"_33":241,"_13":240,"_66":234,"_43":170,"_35":36,"_171":40,"_172":95,"_37":242,"_39":26,"_69":243,"_174":-5,"_70":24,"_176":-5,"_203":244,"_17":245},{"_33":231,"_13":232,"_66":233,"_43":234,"_35":36,"_171":235,"_172":95,"_37":236,"_39":40,"_69":217,"_174":237,"_70":24,"_176":-5,"_203":238,"_17":239},{"_33":224,"_13":225,"_66":226,"_43":170,"_35":36,"_171":40,"_172":95,"_37":227,"_39":26,"_69":21,"_174":228,"_70":24,"_176":-5,"_203":229,"_17":230},{"_33":169,"_13":68,"_66":67,"_43":170,"_35":36,"_171":76,"_172":95,"_37":221,"_39":40,"_69":21,"_174":175,"_70":24,"_176":-5,"_203":222,"_17":223},{"_33":213,"_13":214,"_66":215,"_43":170,"_35":36,"_171":40,"_172":95,"_37":216,"_39":26,"_69":217,"_174":218,"_70":24,"_176":-5,"_203":219,"_17":220},{"_33":206,"_13":207,"_66":208,"_43":-5,"_35":36,"_171":118,"_172":95,"_37":209,"_39":40,"_69":21,"_174":210,"_70":24,"_176":-5,"_203":211,"_17":212},{"_33":197,"_13":198,"_66":93,"_43":-5,"_35":36,"_171":199,"_172":95,"_37":200,"_39":40,"_69":201,"_174":202,"_70":24,"_176":-5,"_203":204,"_17":205},"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",[],[198],"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",[],[207],"207eb754-56a7-11f1-bca4-ee650bb23af1","index.tsx","019e54ea-9f9c-71e9-a735-f7be92b4f03d",["D",1779541122909],"script","/** @jsxImportSource https://esm.sh/react@18.2.0 */\nimport { createRoot } from \"https://esm.sh/react-dom@18.2.0/client\";\nimport { App } from \"./components/App.tsx\";\n\nconst root = document.getElementById(\"root\");\nif (!root) {\n throw new Error(\"No root element found\");\n}\n\ncreateRoot(root).render();",[],[178,214],["D",1779541127904],[],[178,68],"207ea958-56a7-11f1-bca4-ee650bb23af1","favicon.svg","019e54ea-9f9c-71e9-a735-ec2861986952",["D",1779541122909],"\n",[],[178,225],"3e000918-56a7-11f1-bca4-ee650bb23af1","App.tsx","019e54ea-9f9c-71e9-a735-e367c8457e0c","019e54ea-9f9c-71e9-a735-ebe291c4fc16",4,["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",[],[178,240,232],"components","207ea638-56a7-11f1-bca4-ee650bb23af1",["D",1779541122909],"directory",[191],[178,240],"207ebf88-56a7-11f1-bca4-ee650bb23af1",["D",1779541122909],[190,192,193,194],[178],["D",1779541122909],{"_11":12,"_134":73},{"_11":12,"_130":73,"_72":73,"_30":71,"_131":132,"_133":24},{"_39":118,"_13":16,"_33":36,"_119":83,"_120":63,"_121":122,"_123":87,"_124":125,"_126":127,"_128":14,"_129":12},"ctx",{"_52":-5,"_155":287,"_288":289,"_290":291,"_292":24,"_293":24,"_294":24,"_295":95,"_296":-5,"_297":-7,"_298":-7,"_299":26,"_300":24,"_301":24,"_302":-5,"_303":24,"_304":24,"_305":24,"_306":-5},"ENV",{"_258":259,"_260":261,"_262":16,"_263":264,"_265":266,"_267":268,"_269":270,"_271":272,"_273":274,"_275":276,"_277":278,"_279":280,"_281":282,"_283":284,"_285":286},"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"]

History · index.html