بوابة OpenAI — محرك Val Town الأصلي

[{"_1":2,"_3":-5,"_4":-5},"loaderData",{"_5":6,"_7":8,"_9":10},"actionData","errors","root",{"_267":268,"_269":270},"routes/_app.x.$handle.$name",{"_11":12,"_13":14,"_15":16,"_18":19,"_17":-7,"_201":-5,"_20":202,"_22":203,"_204":205,"_206":207,"_26":208,"_24":209,"_210":-5,"_211":-5,"_212":55,"_213":214,"_215":46,"_216":-5,"_217":-5,"_218":219},"routes/_app.x.$handle.$name.branch.$branch.code.$",{"_11":12,"_13":14,"_15":16,"_17":-7,"_18":19,"_20":21,"_22":23,"_24":25,"_26":27,"_28":-5,"_29":-5,"_30":-5,"_31":-5,"_32":-5},"handle","ramyharoon","name","openai-gateway","branchName","main","version","path","lib","project",{"_34":146,"_13":14,"_47":147,"_148":-5,"_149":55,"_150":106,"_151":106,"_152":153,"_154":-5,"_155":156,"_157":82,"_158":46,"_159":-5,"_160":-5,"_161":60,"_162":163,"_164":-5,"_165":-5,"_166":-5,"_167":-5,"_168":169,"_170":169,"_171":172,"_173":172,"_174":172,"_175":169,"_176":169,"_177":178,"_179":180,"_181":182,"_183":55},"tree",[64,65,66,67,68,69],"file",{"_34":58,"_41":42,"_37":40,"_13":19,"_52":-5,"_50":59,"_17":60,"_39":-5,"_47":61,"_43":62,"_56":-5,"_18":63},"contents",[33],"upstream","pull","ahead","behind","envVars",{"_34":35,"_13":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":48,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_18":57},"id","2790bd94-ec1e-4614-a085-ce240493edf3","bridge.ts","fileId","c9e9cd50-a6e9-11f1-8b7e-1607ee4eb77e","parentId","e2a0cbeb-2016-432b-9f07-0defe6ee8dbf","branchId","7bdd8960-6221-4505-900d-d05422b73b8d","branchVersion",45,"latest",true,"createdAt",["D",1788369399905],5,"fileType","script","content","/**\n * lib/bridge.ts — Internal Provider Bridge & Native AI Engine\n *\n * Maps standard OpenAI requests onto Val Town's native AI engine\n * (`std/openai` -> ValTownOpenAI proxy, authenticated via the ambient\n * `valtown` token — no external API key required).\n *\n * Exposes (mounted by main.ts under /api/provider/v1):\n * GET /models -> active native model, OpenAI format, no auth\n * POST /chat/completions -> chat (streaming real SSE or non-streaming)\n *\n * @service the \"port 3040 internal backend service\" of this deployment —\n * no extra process needed: it's a module singleton.\n */\nimport { OpenAI } from \"https://esm.town/v/std/openai/main.ts\";\n\n// ---- Configuration -------------------------------------------------------\n\n/** Native engine is Val Town's proxy; model is configurable. */\nexport const MODEL = (Deno.env.get(\"PROVIDER_MODEL\") || \"gpt-5.4-nano\").trim();\n/** Hard ceiling for output tokens to avoid upstream rejection errors. */\nconst MAX_OUTPUT_TOKENS = 16384;\n\n// ---- Singleton client with auto-healing ----------------------------------\n// If the ambient session token rotates or a transient error occurs, we\n// re-instantiate the client so it re-reads platform credentials.\n\nlet client: OpenAI | null = null;\n\n/** Returns (and lazily creates) the native engine client singleton. */\nexport function getClient(): OpenAI {\n if (!client) client = new OpenAI();\n return client;\n}\n\n/** Force a fresh client on the next call (auto-heal). */\nexport function resetClient(): void {\n client = null;\n}\n\n/**\n * Invoke the engine with an internal rate-limiter and auto-retry on 429.\n * - Throttles to ~9 requests/min so the proxy's ~10/min budget is never\n * exceeded from this gateway, keeping 429s rare.\n * - On a 429 (rate limit) it sleeps with backoff and retries.\n * - Auto-heal: resets the client singleton (re-reading credentials) on error.\n */\nconst MAX_REQ_PER_MIN = 9;\nconst engineTimes: number[] = [];\nfunction sleep(ms: number): Promise {\n return new Promise((r) => setTimeout(r, ms));\n}\nasync function throttleEngine(): Promise {\n const now = Date.now();\n while (engineTimes.length && now - engineTimes[0] >= 60000) engineTimes.shift();\n if (engineTimes.length >= MAX_REQ_PER_MIN) {\n // Wait until the oldest request ages out of the window.\n await sleep(60000 - (now - engineTimes[0]) + 100);\n engineTimes.shift();\n }\n engineTimes.push(Date.now());\n}\n\nasync function callEngine(payload: Record) {\n const attempts = 4;\n for (let i = 0; i < attempts; i++) {\n await throttleEngine();\n try {\n return await getClient().chat.completions.create(payload as never);\n } catch (e) {\n const err = e as { message?: string; status?: number };\n resetClient(); // auto-heal: re-read platform credentials\n // 429 = rate limited: back off and retry.\n if (err.status === 429 && i < attempts - 1) {\n await sleep(2600 * (i + 1));\n continue;\n }\n // One plain retry for transient errors, then surface.\n if (i === 0) continue;\n const status =\n err.status && err.status < 600 && err.status >= 400 ? err.status : 502;\n throw new UpstreamError(err.message || \"native engine failed\", status);\n }\n }\n throw new UpstreamError(\"engine retries exhausted (rate limit)\", 429);\n}\n\nclass UpstreamError extends Error {\n status: number;\n constructor(message: string, status = 502) {\n super(message);\n this.status = status;\n }\n}\n\n// ---- Authentication ------------------------------------------------------\n\n/** The generated gateway key (stored server-side in PROVIDER_API_KEY). */\nexport function apiKey(): string {\n return Deno.env.get(\"PROVIDER_API_KEY\") || \"\";\n}\n\n/** True if the request carries a valid bearer / x-api-key. */\nexport function isAuthed(req: Request): boolean {\n const header = req.headers.get(\"authorization\") || req.headers.get(\"x-api-key\") || \"\";\n const token = header.replace(/^Bearer\\s+/i, \"\").trim();\n return token.length > 0 && token === apiKey();\n}\n\nfunction unauthorized(): Response {\n return Response.json(\n {\n error: {\n message:\n \"Incorrect API key provided. Include `Authorization: Bearer ` or `X-Api-Key: `. Get your key from the gateway UI.\",\n type: \"invalid_request_error\",\n param: null,\n code: \"invalid_api_key\",\n },\n },\n { status: 401 },\n );\n}\n\n// ---- Message sanitization (never throws) ---------------------------------\n\nfunction toText(content: unknown): string {\n try {\n if (content == null) return \"\";\n if (typeof content === \"string\") return content;\n if (Array.isArray(content)) {\n return content\n .map((part) => {\n if (!part || typeof part !== \"object\") return \"\";\n const p = part as { type?: string; text?: string; image_url?: { url?: string } };\n if (p.type === \"text\") return String(p.text ?? \"\");\n if (p.type === \"image_url\") return \"\\[image\\]\";\n return \"\";\n })\n .filter(Boolean)\n .join(\"\\n\");\n }\n return String(content);\n } catch {\n return \"\";\n }\n}\n\n/**\n * Pass through plain system/user/assistant messages; safely flatten\n * tool / function roles and role-object shapes into clean text messages.\n * Guaranteed to never throw.\n */\nexport function sanitizeMessages(messages: unknown): { role: string; content: string }[] {\n try {\n if (!Array.isArray(messages)) return [{ role: \"user\", content: \"Hi\" }];\n const out: { role: string; content: string }[] = [];\n for (const raw of messages) {\n try {\n const msg = (raw ?? {}) as {\n role?: string | { role?: string };\n content?: unknown;\n tool_calls?: { function?: { name?: string } }[];\n name?: string;\n };\n let role = typeof msg.role === \"string\" ? msg.role : \"user\";\n let content = toText(msg.content);\n // Flatten assistant tool_calls into a note so nothing is lost.\n const calls = Array.isArray(msg.tool_calls)\n ? msg.tool_calls.filter(Boolean).map((t) => t?.function?.name || \"tool\")\n : [];\n if (calls.length && !content) {\n content = \"[invoked: \" + calls.join(\", \") + \"]\";\n }\n if (role === \"tool\" || role === \"function\") role = \"user\";\n // Merge adjacent same-role messages so alternating-role rules hold.\n const last = out[out.length - 1];\n if (last && last.role === role) {\n last.content += (last.content ? \"\\n\" : \"\") + content;\n continue;\n }\n out.push({ role, content });\n } catch {\n // drop malformed message\n }\n }\n // Leading assistant messages upset some engines — prepend a user turn.\n if (out.length && out[0].role === \"assistant\") {\n out.unshift({ role: \"user\", content: \"Continue.\" });\n }\n if (!out.length) out.push({ role: \"user\", content: \"Hi\" });\n return out;\n } catch {\n return [{ role: \"user\", content: \"Hi\" }];\n }\n}\n\n// ---- Payload shaping ------------------------------------------------------\n\nfunction clampOutputTokens(v: unknown, fallback = 1024): number {\n let n = Number(v ?? fallback);\n if (!Number.isFinite(n) || n <= 0) n = fallback;\n return Math.min(Math.floor(n), MAX_OUTPUT_TOKENS);\n}\n\nfunction buildPayload(body: Record, model: string) {\n const messages = sanitizeMessages(body.messages);\n const maxTokens = clampOutputTokens(\n body.max_tokens ?? body.max_completion_tokens,\n 2048,\n );\n // Reasoning/thinking models (GPT-5 family, o-series) reject temperature/top_p\n // (only the default (1) is supported) but accept reasoning_effort.\n const isReasoning = /^gpt-5|^o[0-9]|^o[0-9]-mini|reasons/.test(String(model));\n const supportsSampling = !isReasoning && !isClaude;\n // Claude models (via optional Anthropic bridge) also skip sampling params.\n const isClaude = /^claude|^anthropic/.test(String(model));\n\n const payload: Record = {\n model,\n messages,\n max_completion_tokens: maxTokens,\n };\n if (supportsSampling && typeof body.temperature === \"number\") payload.temperature = body.temperature;\n if (supportsSampling && typeof body.top_p === \"number\") payload.top_p = body.top_p;\n if (supportsSampling && typeof body.presence_penalty === \"number\") payload.presence_penalty = body.presence_penalty;\n if (supportsSampling && typeof body.frequency_penalty === \"number\") payload.frequency_penalty = body.frequency_penalty;\n if (!isClaude && typeof body.stop !== \"undefined\") payload.stop = body.stop;\n if (!isClaude && typeof body.user === \"string\") payload.user = body.user;\n if (!isClaude && typeof body.seed === \"number\") payload.seed = body.seed;\n // Reasoning effort is only meaningful (and accepted) on thinking models.\n if (isReasoning && !isClaude) {\n const effort =\n typeof body.reasoning_effort === \"string\" && body.reasoning_effort\n ? body.reasoning_effort\n : typeof body.effort === \"string\" && body.effort\n ? body.effort\n : \"\";\n if (effort) payload.reasoning_effort = effort;\n }\n // Reasoning models burn tokens \"thinking\" before the visible answer — make\n // sure the requested budget leaves room for an actual reply.\n if (isReasoning && maxTokens < 512) payload.max_completion_tokens = 512;\n return { payload, messages, maxTokens, isClaude };\n}\n\n// ---- Handlers -------------------------------------------------------------\n\nexport async function handleModels(): Promise {\n return Response.json({\n object: \"list\",\n data: [\n { id: MODEL, object: \"model\", created: Math.floor(Date.now() / 1000), owned_by: \"val-town\" },\n ],\n });\n}\n\nexport async function handleRootInfo(): Promise {\n const now = Date.now();\n return Response.json({\n service: \"val-town-openai-gateway\",\n status: \"ok\",\n engine: \"std/openai (Val Town native AI)\",\n model: MODEL,\n base_url: \"/api/provider/v1\",\n auth: \"Bearer PROVIDER_API_KEY required on /v1/chat/completions\",\n limits: {\n requests_per_minute: 10,\n max_output_tokens: MAX_OUTPUT_TOKENS,\n expiry: new Date(now).toISOString(),\n },\n endpoints: [\"/health\", \"/v1/models\", \"/v1/chat/completions\"],\n });\n}\n\n/** Public config consumed by the UI (exposes the generated key). */\nexport async function config(): Promise> {\n const key = apiKey();\n return {\n model: MODEL,\n apiKey: key,\n keyRequired: key.length > 0,\n maskedKey: key.length > 6 ? \"sk-\" + key.slice(3, 7) + \"••••\" + key.slice(-4) : key,\n };\n}\n\nexport async function handleChatCompletions(req: Request): Promise {\n if (!isAuthed(req)) return unauthorized();\n\n let body: Record;\n try {\n body = await req.json();\n } catch {\n return Response.json(\n { error: { message: \"Invalid or missing JSON body\", type: \"invalid_request_error\", param: null, code: \"invalid_request\" } },\n { status: 400 },\n );\n }\n if (!Array.isArray(body.messages)) {\n return Response.json(\n { error: { message: \"Field `messages` must be an array\", type: \"invalid_request_error\", param: \"messages\", code: \"invalid_request\" } },\n { status: 400 },\n );\n }\n\n const stream = body.stream === true || body.stream === \"true\";\n const model = typeof body.model === \"string\" && body.model ? String(body.model) : MODEL;\n const { payload, isClaude } = buildPayload(body, model);\n\n if (isClaude) return claudeChat(req, payload, stream);\n if (stream) return streamChat(payload);\n return nonStreamChat(payload);\n}\n\n/**\n * Optional Anthropic bridge: routes claude-* models to Anthropic's\n * OpenAI-compatible endpoint. Requires ANTHROPIC_API_KEY (none provided by\n * the platform — Val Town's native engine only covers OpenAI models).\n */\nasync function claudeChat(req: Request, payload: Record, stream: boolean): Promise {\n const key = Deno.env.get(\"ANTHROPIC_API_KEY\");\n if (!key) {\n return Response.json(\n {\n error: {\n message:\n \"Claude models need the ANTHROPIC_API_KEY environment variable to be set on this gateway before they can run. Add it in the val's env settings to enable Claude.\",\n type: \"invalid_request_error\",\n param: null,\n code: \"missing_anthropic_key\",\n },\n },\n { status: 400 },\n );\n }\n const target = \"https://api.anthropic.com/v1/openai/chat/completions\";\n const outBody: Record = { model: payload.model, messages: payload.messages };\n outBody.max_tokens = payload.max_completion_tokens ?? 2048;\n if (typeof payload.temperature === \"number\") outBody.temperature = payload.temperature;\n if (stream) outBody.stream = true;\n try {\n const upstream = await fetch(target, {\n method: \"POST\",\n headers: { Authorization: `Bearer ${key}`, \"Content-Type\": \"application/json\" },\n body: JSON.stringify(outBody),\n // Propagate client abort to the upstream Anthropic call.\n signal: req.signal,\n });\n const ct = upstream.headers.get(\"content-type\") || \"application/json\";\n return new Response(upstream.body, { status: upstream.status, headers: { \"Content-Type\": ct } });\n } catch (e) {\n const m = e instanceof Error ? e.message : String(e);\n return Response.json(\n { error: { message: \"Claude upstream error: \" + m, type: \"upstream_error\", param: null, code: \"upstream_error\" } },\n { status: 502 },\n );\n }\n}\n\nasync function nonStreamChat(payload: Record): Promise {\n let completion: any;\n try {\n completion = await callEngine(payload);\n } catch (e) {\n const u = e as UpstreamError;\n return Response.json(\n { error: { message: u.message, type: \"upstream_error\", param: null, code: \"upstream_error\" } },\n { status: u.status || 502 },\n );\n }\n const choice = completion?.choices?.[0] ?? {};\n return Response.json({\n id: completion?.id || `chatcmpl-${Date.now()}`,\n object: \"chat.completion\",\n created: completion?.created ?? Math.floor(Date.now() / 1000),\n model: completion?.model || payload.model,\n choices: [\n {\n index: 0,\n message: { role: \"assistant\", content: choice?.message?.content ?? \"\" },\n finish_reason: choice?.finish_reason ?? \"stop\",\n },\n ],\n usage: completion?.usage ?? null,\n });\n}\n\nasync function streamChat(payload: Record): Promise {\n // Start the upstream stream; reset + retry once on transient/token errors.\n // The OpenAI SDK returns an async-iterable stream of chunks for stream:true.\n let upstream: AsyncIterable;\n try {\n upstream = await callEngine({ ...payload, stream: true }) as AsyncIterable;\n } catch (e) {\n const u = e as UpstreamError;\n return Response.json(\n { error: { message: u.message, type: \"upstream_error\", param: null, code: \"upstream_error\" } },\n { status: u.status || 502 },\n );\n }\n\n const encoder = new TextEncoder();\n const sysTime = Math.floor(Date.now() / 1000);\n const model = String(payload.model);\n\n const raw = new ReadableStream({\n async start(controller) {\n try {\n for await (const chunk of upstream) {\n const line = { id: chunk?.id || `chatcmpl-${sysTime}`, object: \"chat.completion.chunk\", created: chunk?.created ?? sysTime, model: chunk?.model || model, choices: chunk?.choices ?? [] };\n controller.enqueue(encoder.encode(\"data: \" + JSON.stringify(line) + \"\\n\\n\"));\n }\n controller.enqueue(encoder.encode(\"data: [DONE]\\n\\n\"));\n } catch (e) {\n const msg = e instanceof Error ? e.message : String(e);\n controller.enqueue(encoder.encode(\"data: \" + JSON.stringify({ error: { message: msg, type: \"stream_error\" } }) + \"\\n\\n\"));\n } finally {\n try { controller.close(); } catch { /* already closed */ }\n }\n },\n cancel() {\n // Client aborted — propagate to upstream if it supports cancellation.\n try { upstream.return?.(undefined); } catch { /* ignore */ }\n },\n });\n\n return new Response(raw, {\n headers: {\n \"Content-Type\": \"text/event-stream\",\n \"Cache-Control\": \"no-cache, no-transform\",\n \"X-Accel-Buffering\": \"no\",\n Connection: \"keep-alive\",\n },\n });\n}\n\n/** Top-level dispatcher for paths mounted under /api/provider/v1. */\nexport async function handleApi(req: Request, sub: string): Promise {\n const method = req.method;\n const path = sub || \"/\";\n\n if (path === \"/\" && method === \"GET\") return handleRootInfo();\n if (path === \"/models\" && method === \"GET\") return handleModels();\n\n if (path === \"/chat/completions\" && method === \"POST\") {\n return handleChatCompletions(req);\n }\n\n return Response.json(\n { error: { message: `No route matched \"${path}\" with method ${method}`, type: \"invalid_request_error\", param: null, code: \"not_found\" } },\n { status: 404 },\n );\n}\n","deleted",false,"label",[19,36],"7b86a1e8-2571-4317-82ca-1d10a6ce8654","directory",0,["D",1788365847017],2,[19],{"_34":58,"_13":19,"_37":40,"_39":-5,"_41":42,"_43":62,"_45":46,"_47":139,"_17":60,"_50":59,"_52":-5,"_54":55,"_56":-5,"_77":140,"_18":141},{"_34":105,"_13":106,"_37":107,"_39":-5,"_41":42,"_43":49,"_45":46,"_47":108,"_17":60,"_50":59,"_52":-5,"_54":55,"_56":-5,"_77":109,"_18":110},{"_34":98,"_13":99,"_37":100,"_39":-5,"_41":42,"_43":101,"_45":46,"_47":102,"_17":60,"_50":59,"_52":-5,"_54":55,"_56":-5,"_77":103,"_18":104},{"_34":90,"_13":91,"_37":92,"_39":-5,"_41":42,"_43":93,"_45":46,"_47":94,"_17":60,"_50":24,"_52":95,"_54":55,"_56":-5,"_77":96,"_18":97},{"_34":80,"_13":81,"_37":82,"_39":-5,"_41":42,"_43":83,"_45":46,"_47":84,"_17":62,"_50":85,"_52":86,"_54":55,"_56":87,"_77":88,"_18":89},{"_34":70,"_13":71,"_37":72,"_39":-5,"_41":42,"_43":73,"_45":46,"_47":74,"_17":75,"_50":24,"_52":76,"_54":55,"_56":-5,"_77":78,"_18":79},"13f84f84-394d-4a64-b360-efcfdfe54539","worklog.md","c9f16d1c-a6e9-11f1-8b7e-1607ee4eb77e",13,["D",1788366028592],1,"# Worklog — OpenAI-Compatible Gateway\n\nNative engine: **Val Town `std/openai`** (ValTownOpenAI proxy, ambient `valtown` token, no external key).\n\n| # | Stage | Status |\n|---|-------|--------|\n| | Environment discovery (native AI, no keys) | ✅ `std/openai` found (`ValTownOpenAI`) |\n| 1 | Generated gateway key, stored `PROVIDER_API_KEY` | ✅ `sk-q7X2mN9vTzQ4rL8pKc3eF6sUa1dB5hYw` |\n| 2 | `lib/bridge.ts` — bridge, sanitizer, clamp, auto-heal, SSE | ✅ |\n| 3 | `main.ts` http router (`/api/provider/v1/*`, config, /health, assets) | ✅ |\n| 4 | Frontend RTL `/` (playground, info, snippets, usage) | ✅ |\n| 5 | curl / fetch — 401 on missing key | ✅ verified |\n| 6 | curl / fetch — 200 + SSE streaming (`data:` → `[DONE]`) | ✅ verified |\n| 7 | Non-streaming 200 + usage | ✅ verified |\n| 8 | Endpoints: `/health`, `/models`, `/config`, `/`, `/app.ts` | ✅ verified |\n| 9 | Subdomain `openai-gateway-city.val.run` | ✅ |\n\n## Verification evidence\n- `GET /health` → `{\"status\":\"ok\",\"service\":\"internal-bridge\"}`\n- `GET /api/provider/v1/models` → OpenAI `object:\"list\"`, `id:\"gpt-5.4-nano\"`\n- `POST /v1/chat/completions` without key → **401** (OpenAI error shape)\n- `POST` with key + `stream:true` → **200** `Content-Type: text/event-stream`, token-by-token `data: {...}` chunks ending `data: [DONE]`\n- `POST` with key + `stream:false` → **200** `{\"content\":\"نعم\",\"usage\":{...}}`\n- `/` serves `lang=\"ar\" dir=\"rtl\"` HTML; `/app.ts` transpiles to `text/javascript`\n","children",[],[71],"af6f56dd-9f96-4384-85bf-726dc62502d3","main.ts","aeb5b076-a6e9-11f1-8b7e-1607ee4eb77e",8,["D",1788365914409],"http","/**\n * main.ts (http) — Router entrypoint for the OpenAI-compatible gateway.\n *\n * Mounts the internal-provider bridge under /api/provider/v1, serves the\n * RTL frontend, static assets, and the service config endpoint.\n */\nimport { serveFile } from \"https://esm.town/v/std/utils/index.ts\";\nimport { handleApi, config } from \"./lib/bridge.ts\";\n\nexport default async function (req: Request): Promise {\n const url = new URL(req.url);\n const p = url.pathname;\n\n // Public config consumed by the UI (model + generated key).\n if (p === \"/api/provider/config\") {\n return Response.json(await config());\n }\n\n // Service health (open, no auth).\n if (p === \"/health\") {\n return Response.json({ status: \"ok\", service: \"internal-bridge\" });\n }\n\n // The OpenAI-compatible gateway (mounted at /api/provider/v1).\n if (p === \"/api/provider/v1\" || p.startsWith(\"/api/provider/v1/\")) {\n const sub = p === \"/api/provider/v1\" ? \"/\" : p.slice(\"/api/provider/v1\".length);\n return handleApi(req, sub);\n }\n\n // Frontend + assets.\n if (p === \"/\") return serveFile(\"/public/index.html\");\n if (p === \"/styles.css\") return serveFile(\"/public/styles.css\");\n if (p === \"/app.ts\") return serveFile(\"/public/app.ts\");\n\n return new Response(\"Not found\", { status: 404 });\n}\n","openai-gateway-city",[],[81],"176b522f-1a0f-4166-988f-f7371feec9a5","README.md","e7f75c0e-a6e9-11f1-9ab5-1607ee4eb77e",7,["D",1788365897439],"# OpenAI-Compatible Gateway on Val Town\n\nA production-ready **OpenAI-compatible API gateway** whose upstream engine is\n**Val Town's native AI** (`std/openai` → the ValTownOpenAI proxy, authenticated\nby the ambient `valtown` token). **No external API key required** — Cline, Roo\nCode, Cursor, the Python OpenAI SDK, or cURL can all connect to this gateway\nand chat through real SSE streaming.\n\n## Quick start\n\n- **Base URL:** `{origin}/api/provider/v1`\n- **Model:** `gpt-5.4-nano` (Val Town native)\n- **API Key:** shown in the UI (stored server-side in `PROVIDER_API_KEY`)\n\n### Cline / Roo Code / Cursor (OpenAI-compatible provider)\n\n```\nbaseUrl = {origin}/api/provider/v1\napiKey = \nmodelId = gpt-5.4-nano\n```\n\n### cURL\n\n```bash\ncurl {origin}/api/provider/v1/chat/completions \\\n -H \"Authorization: Bearer \" \\\n -H \"Content-Type: application/json\" \\\n -d '{\"model\":\"gpt-5.4-nano\",\"stream\":true,\n \"messages\":[{\"role\":\"user\",\"content\":\"مرحباً\"}]}'\n```\n\n## Endpoints\n\n| Method | Path | Auth | Description |\n|--------|------|------|-------------|\n| GET | `/health` | no | `{status:\"ok\", service:\"internal-bridge\"}` |\n| GET | `/api/provider/v1` | no | Service info & limits |\n| GET | `/api/provider/v1/models` | no | Active model, OpenAI format |\n| POST | `/api/provider/v1/chat/completions` | **yes** | Chat (SSE or non-streaming) |\n| GET | `/api/provider/config` | no | `{model, apiKey, keyRequired}` for the UI |\n\n## Architecture\n\n- `main.ts` (http) — router: mounts the gateway under `/api/provider/v1`,\n serves the RTL frontend and assets.\n- `lib/bridge.ts` (script) — the internal provider bridge: `sanitizeMessages`\n (never throws), `max_tokens` clamping, auto-healing singleton that re-reads\n platform credentials, and real SSE streaming via the OpenAI SDK.\n- `public/` — Arabic RTL UI (playground, connection info, integration\n snippets, activity/usage).\n\n## Environment variables\n\n- `PROVIDER_API_KEY` — the gateway bearer key (required on chat completions).\n- `PROVIDER_MODEL` — optional, overrides the default `gpt-5.4-nano`.\n\n## Notes & limits\n\n- Native engine rate limit: ~10 requests/minute (Val Town proxy).\n- Pro users get 10 expensive-model requests per rolling 24h, then bump to nano.\n- `max_tokens` is auto-clamped to the engine ceiling to avoid upstream errors.\n",[],[91],"6f16390d-fc45-4fe5-b99c-552fa840465c","scripts","0bbfaac7-0d86-4181-bfce-759b958dfb7a",24,["D",1788367750585],[],[99],"16e6fe0e-8f62-479a-a6d3-e2c6ec070892","public","18048284-fd8c-4305-8780-d65116878ca7",["D",1788365874885],[111,112,113],[106],{"_34":130,"_13":131,"_37":132,"_39":107,"_41":42,"_43":133,"_45":46,"_47":134,"_17":135,"_50":51,"_52":136,"_54":55,"_56":-5,"_77":137,"_18":138},{"_34":122,"_13":123,"_37":124,"_39":107,"_41":42,"_43":125,"_45":46,"_47":126,"_17":93,"_50":24,"_52":127,"_54":55,"_56":-5,"_77":128,"_18":129},{"_34":114,"_13":115,"_37":116,"_39":107,"_41":42,"_43":117,"_45":46,"_47":118,"_17":62,"_50":24,"_52":119,"_54":55,"_56":-5,"_77":120,"_18":121},"56280400-2c1f-4ad0-946d-974a920ab990","styles.css","e7ee134c-a6e9-11f1-9ab5-1607ee4eb77e",10,["D",1788365914540],":root {\n --bg: #f4f6fb;\n --surface: #ffffff;\n --surface-2: #eef1f8;\n --text: #1a1d29;\n --muted: #5b6478;\n --border: #e2e6f0;\n --accent: #4f46e5;\n --accent-soft: #eef0ff;\n --green: #16a34a;\n --green-soft: #e7f7ee;\n --red: #dc2626;\n --code-bg: #0f1220;\n --code-text: #e6e9ff;\n --shadow: 0 8px 30px rgba(20, 24, 60, 0.08);\n --radius: 14px;\n}\n[data-theme=\"dark\"] {\n --bg: #0b0e17;\n --surface: #141927;\n --surface-2: #1b2133;\n --text: #eef1fb;\n --muted: #9aa3bd;\n --border: #252c44;\n --accent: #818cf8;\n --accent-soft: #1c2140;\n --green: #34d399;\n --green-soft: #0f2b22;\n --red: #f87171;\n --code-bg: #0a0d16;\n --code-text: #dbe4ff;\n --shadow: 0 8px 30px rgba(0, 0, 0, 0.4);\n}\n\n* { box-sizing: border-box; }\nhtml, body { margin: 0; padding: 0; }\nbody {\n font-family: \"Cairo\", system-ui, sans-serif;\n background: var(--bg);\n color: var(--text);\n line-height: 1.7;\n transition: background .25s, color .25s;\n}\n.app-shell { min-height: 100vh; display: flex; flex-direction: column; }\n\n/* Header */\n.site-header {\n display: flex; align-items: center; justify-content: space-between;\n gap: 12px; padding: 14px 22px; flex-wrap: wrap;\n background: var(--surface); border-bottom: 1px solid var(--border);\n position: sticky; top: 0; z-index: 20;\n}\n.brand { display: flex; align-items: center; gap: 12px; min-width: 0; }\n.logo { font-size: 30px; }\n.brand-text h1 { margin: 0; font-size: 20px; font-weight: 800; }\n.tagline { margin: 0; font-size: 12px; color: var(--muted); }\n.header-actions { display: flex; align-items: center; gap: 10px; }\n.icon-btn {\n border: 1px solid var(--border); background: var(--surface); color: var(--text);\n border-radius: 10px; width: 38px; height: 38px; font-size: 18px; cursor: pointer;\n}\n.status-badge {\n display: inline-flex; align-items: center; gap: 8px;\n padding: 7px 12px; border-radius: 999px; font-size: 13px; font-weight: 700;\n border: 1px solid var(--border); background: var(--surface-2);\n}\n.status-badge .dot { width: 9px; height: 9px; border-radius: 50%; background: #9aa3bd; }\n.status-ok { color: var(--green); border-color: var(--green); background: var(--green-soft); }\n.status-ok .dot { background: var(--green); box-shadow: 0 0 0 3px rgba(22,163,74,.18); }\n.status-bad { color: var(--red); border-color: var(--red); background: color-mix(in srgb, var(--red) 8%, transparent); }\n.status-bad .dot { background: var(--red); }\n\n/* Layout */\n.layout {\n flex: 1; width: 100%; max-width: 1280px; margin: 0 auto;\n padding: 22px; display: grid; grid-template-columns: minmax(0, 1fr) 380px; gap: 22px;\n align-items: start;\n}\n.sidebar { display: flex; flex-direction: column; gap: 22px; min-width: 0; }\n\n.card {\n background: var(--surface); border: 1px solid var(--border);\n border-radius: var(--radius); box-shadow: var(--shadow);\n padding: 18px; min-width: 0;\n}\n.card h2 { margin: 0 0 6px; font-size: 17px; }\n.card h3 { margin: 0 0 12px; font-size: 15px; }\n.card h4 { margin: 14px 0 6px; font-size: 13px; }\n\n.metric-row { display: flex; flex-wrap: wrap; gap: 8px; margin: 4px 0 12px; }\n.badge {\n background: var(--accent-soft); color: var(--accent);\n padding: 3px 10px; border-radius: 999px; font-size: 12px; font-weight: 700;\n}\n.badge.ghost { background: var(--surface-2); color: var(--muted); }\n\n/* Messages */\n.messages {\n display: flex; flex-direction: column; gap: 14px;\n max-height: 460px; overflow-y: auto; padding: 4px 2px 8px;\n}\n.msg { display: flex; gap: 10px; align-items: flex-start; min-width: 0; }\n.avatar {\n flex: 0 0 34px; width: 34px; height: 34px; border-radius: 50%;\n display: grid; place-items: center; background: var(--accent-soft); font-size: 17px;\n}\n.bubble {\n background: var(--surface-2); border: 1px solid var(--border);\n border-radius: 14px; padding: 10px 14px; min-width: 0; max-width: 100%;\n}\n.msg-user .bubble { background: var(--accent-soft); }\n.bubble p { margin: 0 0 8px; }\n.bubble p:last-child { margin-bottom: 0; }\n.bubble pre {\n background: var(--code-bg); color: var(--code-text);\n padding: 12px; border-radius: 10px; overflow-x: auto; direction: ltr;\n text-align: left; position: relative; margin: 8px 0;\n}\n.bubble code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 13px; }\n.bubble :not(pre) > code { background: var(--surface-2); padding: 1px 5px; border-radius: 5px; }\n.copy-btn {\n position: absolute; top: 6px; right: 6px; cursor: pointer;\n border: 1px solid #ffffff33; background: #ffffff14; color: #fff;\n border-radius: 6px; font-size: 11px; padding: 2px 8px;\n}\n.caret { display: inline-block; animation: blink 1s steps(2) infinite; color: var(--accent); }\n@keyframes blink { 50% { opacity: 0; } }\n\n/* Presets & chips */\n.presets { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 12px 0; }\n.preset-label { font-size: 12px; color: var(--muted); font-weight: 700; }\n.chip {\n border: 1px solid var(--border); background: var(--surface-2); color: var(--text);\n border-radius: 999px; padding: 5px 12px; font-size: 12px; cursor: pointer; font-family: inherit;\n}\n.chip:hover { border-color: var(--accent); color: var(--accent); }\n\n/* Settings */\n.settings { margin: 6px 0 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-2); }\n.settings summary { cursor: pointer; padding: 10px 14px; font-weight: 700; font-size: 13px; }\n.settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 12px; padding: 0 14px 14px; }\n.settings label { display: flex; flex-direction: column; gap: 4px; font-size: 12px; color: var(--muted); }\n.settings textarea, .settings input {\n background: var(--surface); color: var(--text); border: 1px solid var(--border);\n border-radius: 8px; padding: 8px; font-family: inherit; font-size: 13px;\n}\n\n/* Composer */\n.composer { border: 1px solid var(--border); border-radius: 14px; background: var(--surface-2); padding: 10px; }\n.composer textarea {\n width: 100%; border: none; background: transparent; color: var(--text);\n resize: vertical; font-family: inherit; font-size: 14px; padding: 6px; outline: none;\n}\n.composer-row { display: flex; align-items: center; gap: 8px; margin-top: 6px; flex-wrap: wrap; }\n.composer-tools { display: flex; gap: 8px; align-items: center; position: relative; }\n.primary {\n background: var(--accent); color: #fff; border: none; border-radius: 10px;\n padding: 9px 18px; font-weight: 800; cursor: pointer; font-family: inherit; font-size: 14px;\n}\n.danger {\n background: var(--red); color: #fff; border: none; border-radius: 10px;\n padding: 9px 18px; font-weight: 800; cursor: pointer; font-family: inherit; font-size: 14px;\n}\n.export-menu {\n position: absolute; top: 34px; right: 0; z-index: 30;\n background: var(--surface); border: 1px solid var(--border); border-radius: 10px;\n box-shadow: var(--shadow); display: flex; flex-direction: column; min-width: 130px;\n}\n.export-menu button { background: none; border: none; text-align: right; padding: 8px 12px; cursor: pointer; font-family: inherit; color: var(--text); }\n.export-menu button:hover { background: var(--surface-2); }\n\n.saved-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 12px; }\n.saved-chip { font-size: 11px; }\n\n/* Connection card */\n.conn-row { display: flex; align-items: center; gap: 8px; margin-bottom: 10px; min-width: 0; }\n.conn-row .k { flex: 0 0 74px; font-size: 12px; color: var(--muted); font-weight: 700; }\n.conn-row code {\n flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;\n background: var(--surface-2); border: 1px solid var(--border); border-radius: 8px;\n padding: 5px 8px; font-size: 12px;\n}\n.mini { border: 1px solid var(--border); background: var(--surface); border-radius: 8px; cursor: pointer; padding: 3px 7px; font-size: 13px; }\n.divider { height: 1px; background: var(--border); margin: 12px 0; }\n.steps { margin: 0; padding-right: 18px; font-size: 13px; color: var(--muted); }\n.steps li { margin-bottom: 6px; }\n.steps code { background: var(--surface-2); padding: 1px 5px; border-radius: 5px; font-size: 12px; }\n\n/* Tabs & panes */\n.tabs { display: flex; gap: 6px; flex-wrap: wrap; margin-bottom: 10px; }\n.tab {\n border: 1px solid var(--border); background: var(--surface-2); color: var(--muted);\n border-radius: 8px; padding: 5px 10px; font-size: 12px; cursor: pointer; font-family: inherit; font-weight: 700;\n}\n.tab.active { background: var(--accent); color: #fff; border-color: var(--accent); }\n.pane {\n background: var(--code-bg); color: var(--code-text); padding: 12px;\n border-radius: 10px; overflow-x: auto; direction: ltr; text-align: left;\n font-size: 12px; margin: 0; max-height: 300px; overflow-y: auto;\n}\n.pane code { font-family: ui-monospace, Menlo, monospace; }\n.hidden { display: none !important; }\n\n/* Activity */\n.activity { display: flex; flex-direction: column; gap: 8px; max-height: 260px; overflow-y: auto; }\n.activity .empty { color: var(--muted); font-size: 13px; }\n.log-item {\n background: var(--surface-2); border: 1px solid var(--border);\n border-radius: 8px; padding: 8px 10px; font-size: 12px;\n}\n.log-item .row1 { display: flex; justify-content: space-between; gap: 8px; font-weight: 700; }\n.log-item .ok { color: var(--green); }\n.log-item .err { color: var(--red); }\n.log-item .meta { color: var(--muted); font-size: 11px; margin-top: 2px; }\n\n/* Footer */\n.site-footer {\n margin-top: auto; padding: 14px 22px; text-align: center;\n background: var(--surface); border-top: 1px solid var(--border);\n display: flex; justify-content: space-between; gap: 10px; flex-wrap: wrap; font-size: 12px; color: var(--muted);\n}\n.site-footer code { background: var(--surface-2); padding: 1px 6px; border-radius: 5px; font-size: 11px; }\n\n/* Responsive */\n@media (max-width: 900px) {\n .layout { grid-template-columns: 1fr; }\n}\n@media (max-width: 480px) {\n .layout { padding: 12px; }\n .site-header { padding: 12px; }\n .brand-text h1 { font-size: 17px; }\n}\n",[],[106,115],"39f927d4-80ee-4c2b-a11c-ca08bc1e24a8","index.html","da863176-a6e9-11f1-bcd2-1607ee4eb77e",42,["D",1788368708108],"\n\n\n \n \n بوابة OpenAI — محرك Val Town الأصلي\n ⚡\" />\n \n \n \n \n\n\n

\n \n \n\n

\n \n

🎮 منصّة التجربة المباشرة

\n التحفيز: 0\n الإخراج: 0\n الإجمالي: 0\n —\n

\n\n

🤖

مرحباً! أنا مُشغّل عبر البوابة المتوافقة مع OpenAI، والمحرّك الداخلي هو Val Town. جرّب سؤالاً من الأسئلة المقترحة 👇

\n\n

\n مقترحات:\n \n \n \n \n

\n\n

⚙️ إعدادات متقدمة

\n النظام (System Prompt)\n \n \n درجة الحرارة (Temperature)\n \n \n الحد الأقصى (Max Tokens)\n \n \n النموذج\n \n \n الجهد (Effort — للموديلات التفكيرية)\n \n \n

\n\n

\n \n

\n \n \n \n

\n \n \n

\n\n

\n\n \n

🔌 بيانات الاتصال

\n المفتاح\n …\n \n \n

\n Base URL\n …\n \n

\n النموذج\n …\n \n

إعداد Cline / Roo Code / Cursor

انسخ المفتاح من الأعلى.
عيّن baseUrl = {BASE_URL} في مزوّد OpenAI مخصّص.
الصق المفتاح في حقل API Key.
احفظ كالتالي: v1/chat/completions.

\n\n

📦 مقتطفات التكامل

\n \n \n \n \n \n

# Cline — إعداد OpenAI-متوافق\nopenai-compatible:\n  baseUrl: {BASE_URL}\n  apiKey: {KEY}\n  modelId: {MODEL}

# في إعدادات Cline → OpenAI-متوافق\nOPENAI_BASE_URL={BASE_URL}\nOPENAI_API_KEY={KEY}\nOPENAI_MODEL_ID={MODEL}

curl {BASE_URL}/chat/completions \\\n  -H \"Authorization: Bearer {KEY}\" \\\n  -H \"Content-Type: application/json\" \\\n  -d '{\n    \"model\": \"{MODEL}\",\n    \"stream\": true,\n    \"messages\": [{\"role\":\"user\",\"content\":\"مرحباً\"}]\n  }'

from openai import OpenAI\n\nclient = OpenAI(\n    api_key=\"{KEY}\",\n    base_url=\"{BASE_URL}\",\n)\nresp = client.chat.completions.create(\n    model=\"{MODEL}\",\n    stream=True,\n    messages=[{\"role\":\"user\",\"content\":\"مرحباً\"}],\n)\nfor chunk in resp:\n    print(chunk.choices[0].delta.content or \"\", end=\"\")

import OpenAI from \"openai\";\n\nconst client = new OpenAI({\n  apiKey: \"{KEY}\",\n  baseURL: \"{BASE_URL}\",\n});\nconst stream = await client.chat.completions.create({\n  model: \"{MODEL}\",\n  stream: true,\n  messages: [{ role: \"user\", content: \"مرحباً\" }],\n});\nfor await (const chunk of stream) {\n  process.stdout.write(chunk.choices[0]?.delta?.content ?? \"\");\n}

\n\n

📊 النشاط والاستخدام

لا يوجد نشاط بعد.

\n\n \n

\n\n \n \n\n\n",[],[106,123],"2c10089c-e000-44b1-9f5e-0e106eef04b1","app.ts","0d200346-a6ea-11f1-bb4a-1607ee4eb77e",17,["D",1788366386984],4,"/**\n * public/app.ts — client-side UI for the OpenAI-compatible gateway.\n * Served (transpiled) by main.ts via serveFile.\n */\nimport { marked } from \"https://esm.sh/marked@14.1.3\";\nimport hljs from \"https://esm.sh/highlight.js@11.10.0\";\n\nmarked.setOptions({ gfm: true, breaks: true });\n\ntype Msg = { role: string; content: string };\n\nconst state = {\n apiKey: \"\",\n baseUrl: \"\",\n model: \"gpt-5.4-nano\",\n messages: [] as Msg[],\n controller: null as AbortController | null,\n busy: false,\n t0: 0,\n usage: { prompt: 0, completion: 0 } as { prompt: number; completion: number },\n};\n\nconst $ = (s: string): HTMLElement => document.querySelector(s) as HTMLElement;\nconst $$ = (s: string): NodeListOf => document.querySelectorAll(s);\n\nfunction est(s: string): number {\n if (!s) return 0;\n return Math.max(1, Math.ceil(s.length / 3));\n}\nfunction scrollBottom(el: HTMLElement) {\n el.scrollTop = el.scrollHeight;\n}\nasync function copy(text: string) {\n try {\n await navigator.clipboard.writeText(text);\n } catch {\n const ta = document.createElement(\"textarea\");\n ta.value = text;\n document.body.appendChild(ta);\n ta.select();\n document.execCommand(\"copy\");\n ta.remove();\n }\n}\n\n// ---- Boot -----------------------------------------------------------------\nasync function init() {\n await loadConfig();\n fillSnippets();\n wire();\n renderMessages();\n updateMetrics();\n setInterval(checkHealth, 8000);\n}\n\nasync function loadConfig() {\n state.baseUrl = location.origin + \"/api/provider/v1\";\n try {\n const r = await fetch(\"/api/provider/config\");\n const c = await r.json();\n state.apiKey = c.apiKey || \"\";\n state.model = c.model || \"gpt-5.4-nano\";\n $(\"#key-display\").textContent = (c.maskedKey || state.apiKey);\n $(\"#key-display\").dataset.full = state.apiKey;\n $(\"#key-display\").dataset.masked = c.maskedKey || state.apiKey;\n $(\"#base-url\").textContent = state.baseUrl;\n $(\"#model-display\").textContent = state.model;\n const sel = $(\"#model\") as HTMLSelectElement;\n sel.value = state.model;\n if (!sel.value) {\n const opt = document.createElement(\"option\");\n opt.value = state.model;\n opt.textContent = state.model;\n opt.selected = true;\n sel.insertBefore(opt, sel.firstChild);\n }\n const eff = $(\"#effort\") as HTMLSelectElement;\n if (eff && !eff.value) eff.value = \"medium\";\n } catch (e) {\n $(\"#key-display\").textContent = \"غير متاح\";\n $(\"#base-url\").textContent = state.baseUrl;\n }\n}\n\nfunction fillSnippets() {\n const rep: Record = {\n \"{BASE_URL}\": state.baseUrl,\n \"{KEY}\": state.apiKey,\n \"{MODEL}\": state.model,\n };\n $$(\".pane code\").forEach((el) => {\n let t = el.textContent || \"\";\n for (const k in rep) t = t.split(k).join(rep[k]);\n el.textContent = t;\n });\n}\n\nasync function checkHealth() {\n const badge = $(\"#status-badge\");\n const label = $(\"#status-label\");\n try {\n const r = await fetch(state.baseUrl + \"/models\");\n if (r.ok) {\n badge.className = \"status-badge status-ok\";\n label.textContent = \"المزوّد متصل\";\n } else throw new Error(\"bad\");\n } catch {\n badge.className = \"status-badge status-bad\";\n label.textContent = \"غير متصل\";\n }\n}\n\n// ---- Rendering -------------------------------------------------------------\nfunction renderMessages() {\n const box = $(\"#messages\");\n box.innerHTML = \"\";\n box.appendChild(welcomeMsg());\n for (const m of state.messages) {\n box.appendChild(msgNode(m.role, m.content, false));\n }\n scrollBottom(box);\n}\n\nfunction welcomeMsg(): HTMLElement {\n const div = document.createElement(\"div\");\n div.className = \"msg msg-assistant\";\n div.innerHTML =\n `

🤖

مرحباً! أنا مشغّل عبر البوابة المتوافقة مع OpenAI، والمحرّك الداخلي هو Val Town. جرّب سؤالاً من الأسئلة المقترحة 👇

`;\n return div;\n}\n\nfunction msgNode(role: string, content: string, caret: boolean): HTMLElement {\n const wrap = document.createElement(\"div\");\n wrap.className = \"msg \" + (role === \"user\" ? \"msg-user\" : \"msg-assistant\");\n const avatar = document.createElement(\"div\");\n avatar.className = \"avatar\";\n avatar.textContent = role === \"user\" ? \"🧑\" : \"🤖\";\n const bubble = document.createElement(\"div\");\n bubble.className = \"bubble\";\n wrap.append(avatar, bubble);\n paint(bubble, content, caret);\n return wrap;\n}\n\nfunction paint(bubble: HTMLElement, md: string, caret: boolean) {\n const html = marked.parse(md || \"…\") as string;\n bubble.innerHTML = html + (caret ? '▍' : \"\");\n enhance(bubble);\n}\n\nfunction enhance(container: HTMLElement) {\n container.querySelectorAll(\"pre > code\").forEach((code) => {\n try {\n hljs.highlightElement(code as HTMLElement, { ignoreUnescaped: true });\n } catch { /* keep plain */ }\n const pre = code.parentElement as HTMLElement;\n const btn = document.createElement(\"button\");\n btn.className = \"copy-btn\";\n btn.textContent = \"نسخ\";\n btn.addEventListener(\"click\", async () => {\n await copy((code as HTMLElement).innerText);\n btn.textContent = \"✓\";\n setTimeout(() => (btn.textContent = \"نسخ\"), 1200);\n });\n pre.appendChild(btn);\n });\n}\n\n// ---- Send / stream ----------------------------------------------------------\nfunction addAssistantBubble(): HTMLElement {\n const box = $(\"#messages\");\n const n = msgNode(\"assistant\", \"\", false);\n box.appendChild(n);\n scrollBottom(box);\n return n.querySelector(\".bubble\") as HTMLElement;\n}\n\nasync function send(prompt?: string) {\n if (state.busy) return;\n const input = $(\"#input\") as HTMLTextAreaElement;\n const text = (prompt ?? input.value.trim()).trim();\n if (!text) return;\n input.value = \"\";\n state.messages.push({ role: \"user\", content: text });\n state.usage = { prompt: 0, completion: 0 };\n renderMessages();\n\n const sys = ($(\"#sys-prompt\") as HTMLTextAreaElement).value.trim();\n const temp = parseFloat(($(\"#temperature\") as HTMLInputElement).value);\n const maxTok = parseInt(($(\"#max-tokens\") as HTMLInputElement).value, 10) || 2048;\n const model = ($(\"#model\") as HTMLSelectElement).value || state.model;\n const effort = ($(\"#effort\") as HTMLSelectElement).value;\n\n const messages: Msg[] = [\n ...(sys ? [{ role: \"system\", content: sys }] : []),\n ...state.messages,\n ];\n const body: Record = {\n model,\n messages,\n temperature: Number.isFinite(temp) ? temp : 0.7,\n max_tokens: maxTok,\n stream: true,\n };\n // Pass reasoning effort for thinking models when the user chooses one.\n if (effort) {\n body.reasoning_effort = effort;\n body.effort = effort;\n }\n\n state.controller = new AbortController();\n state.busy = true;\n state.t0 = performance.now();\n const stopBtn = $(\"#stop-btn\");\n ( $(\"#send-btn\") as HTMLButtonElement ).style.display = \"none\";\n stopBtn.classList.remove(\"hidden\");\n\n const bubble = addAssistantBubble();\n let out = \"\";\n let failed = false;\n\n try {\n const res = await fetch(state.baseUrl + \"/chat/completions\", {\n method: \"POST\",\n headers: { \"Content-Type\": \"application/json\", Authorization: `Bearer ${state.apiKey}` },\n body: JSON.stringify(body),\n signal: state.controller.signal,\n });\n if (!res.ok || !res.body) {\n const errText = await res.text().catch(() => \"\");\n failed = true;\n out = `**خطأ (${res.status})**\\n\\n\\`\\`\\`\\n${(errText || res.statusText || \"فشل الطلب\").slice(0, 2000)}\\n\\`\\`\\``;\n paint(bubble, out, false);\n } else {\n const reader = res.body.getReader();\n const dec = new TextDecoder();\n let buf = \"\";\n for (;;) {\n const { done, value } = await reader.read();\n if (done) break;\n buf += dec.decode(value, { stream: true });\n let idx: number;\n while ((idx = buf.indexOf(\"\\n\")) >= 0) {\n const line = buf.slice(0, idx).trim();\n buf = buf.slice(idx + 1);\n if (!line.startsWith(\"data:\")) continue;\n const data = line.slice(5).trim();\n if (data === \"[DONE]\") continue;\n try {\n const json = JSON.parse(data);\n if (json.error) {\n failed = true;\n out = `**خطأ من المحرك:** ${json.error.message || \"\"}`;\n paint(bubble, out, false);\n continue;\n }\n const delta = json.choices?.[0]?.delta?.content;\n if (typeof delta === \"string\") {\n out += delta;\n paint(bubble, out, true);\n }\n if (json.usage) state.usage = json.usage;\n } catch { /* partial/keepalive */ }\n }\n }\n // final paint (no caret)\n const finalNode = bubble;\n const html = marked.parse(out || \"(لا مخرجات)\") as string;\n finalNode.innerHTML = html;\n enhance(finalNode);\n }\n } catch (e) {\n const err = e as Error;\n if (err.name !== \"AbortError\") {\n failed = true;\n out = (out || \"\") + `\\n\\n**خطأ:** ${err.message || \"تعذّر الاتصال\"}`;\n }\n paint(bubble, out || \"(أوقفت الإرسال)\", false);\n } finally {\n state.messages.push({ role: \"assistant\", content: out });\n state.busy = false;\n state.controller = null;\n ( $(\"#send-btn\") as HTMLButtonElement ).style.display = \"\";\n stopBtn.classList.add(\"hidden\");\n state.usage.completion = state.usage.completion || est(out);\n updateMetrics();\n addLog(model, failed, maxTok, state.messages.length);\n renderMessages();\n }\n}\n\nfunction stop() {\n state.controller?.abort();\n}\n\n// ---- Activity + metrics ------------------------------------------------------\nfunction updateMetrics() {\n let prompt = 0;\n let completion = 0;\n for (const m of state.messages) {\n if (m.role === \"assistant\") completion += est(m.content);\n else prompt += est(m.content);\n }\n $(\"#m-prompt\").textContent = \"التحفيز: \" + prompt;\n $(\"#m-completion\").textContent = \"الإخراج: \" + completion;\n $(\"#m-total\").textContent = \"الإجمالي: \" + (prompt + completion);\n const ms = Math.round(performance.now() - state.t0);\n $(\"#m-time\").textContent = ms >= 0 && state.busy === false && state.messages.length > 0\n ? `${ms.toLocaleString(\"ar\")} ms`\n : \"—\";\n}\n\nfunction addLog(model: string, failed: boolean, maxTok: number, n: number) {\n const box = $(\"#activity\");\n const empty = box.querySelector(\".empty\");\n if (empty) empty.remove();\n const item = document.createElement(\"div\");\n item.className = \"log-item\";\n const now = new Date();\n item.innerHTML =\n `

${failed ? \"✖ فشل\" : \"✓ نجاح\"}${model}

` +\n `

SSE stream • max ${maxTok} tok • ${n} رسالة • ${now.toLocaleTimeString(\"ar\")}

`;\n box.prepend(item);\n while (box.children.length > 8) box.lastElementChild?.remove();\n}\n\n// ---- Export & save ------------------------------------------------------------\nfunction buildExport(fmt: string): string {\n const md = state.messages.map((m) => `**${m.role}:**\\n${m.content}`).join(\"\\n\\n---\\n\\n\");\n if (fmt === \"md\") return `# محادثة بوابة OpenAI\\n\\n${md}`;\n if (fmt === \"csv\") {\n const lines = [[\"role\", \"content\"].join(\"\")];\n return state.messages.map((m) => `${m.role},\"${m.content.replace(/\"/g, '\"\"').replace(/\\n/g, \" \")}\"`).join(\"\\n\");\n }\n if (fmt === \"curl\") {\n const msgs = JSON.stringify(state.messages.map((m) => ({ role: m.role, content: m.content })));\n return `curl ${state.baseUrl}/chat/completions -H \"Authorization: Bearer ${state.apiKey}\" -H \"Content-Type: application/json\" -d '{\"model\":\"${state.model}\",\"stream\":true,\"messages\":${msgs}}'`;\n }\n return md;\n}\n\nfunction download(name: string, content: string, type: string) {\n const a = document.createElement(\"a\");\n a.href = URL.createObjectURL(new Blob([content], { type }));\n a.download = name;\n a.click();\n URL.revokeObjectURL(a.href);\n}\n\nfunction saveChat() {\n if (!state.messages.length) return;\n const key = \"saved-chats-\" + location.pathname;\n let list: string[] = [];\n try { list = JSON.parse(localStorage.getItem(key) || \"[]\"); } catch { list = []; }\n const title = (state.messages[0]?.content || \"محادثة\").slice(0, 30);\n list.unshift(JSON.stringify({ title, messages: state.messages }));\n list = list.slice(0, 8);\n localStorage.setItem(key, JSON.stringify(list));\n renderSaved();\n}\n\nfunction renderSaved() {\n const bar = $(\"#saved-bar\");\n bar.innerHTML = \"\";\n const key = \"saved-chats-\" + location.pathname;\n let list: string[] = [];\n try { list = JSON.parse(localStorage.getItem(key) || \"[]\"); } catch { list = []; }\n list.forEach((raw, i) => {\n let t = `محادثة ${i + 1}`;\n try { t = JSON.parse(raw).title as string; } catch { /* ignore */ }\n const b = document.createElement(\"button\");\n b.className = \"chip saved-chip\";\n b.textContent = \"💾 \" + t + \" ⤴\";\n b.addEventListener(\"click\", () => {\n try {\n state.messages = JSON.parse(raw).messages as Msg[];\n renderMessages();\n updateMetrics();\n } catch { /* ignore */ }\n });\n bar.appendChild(b);\n });\n}\n\n// ---- Wiring ----------------------------------------------------------------\nfunction wire() {\n $(\"#theme-toggle\").addEventListener(\"click\", () => {\n const cur = document.documentElement.getAttribute(\"data-theme\");\n const next = cur === \"dark\" ? \"light\" : \"dark\";\n document.documentElement.setAttribute(\"data-theme\", next);\n ($(\"#theme-toggle\") as HTMLButtonElement).textContent = next === \"dark\" ? \"☀️\" : \"🌙\";\n try { localStorage.setItem(\"theme\", next); } catch { /* ignore */ }\n });\n const savedTheme = (() => { try { return localStorage.getItem(\"theme\"); } catch { return null; } })();\n if (savedTheme) {\n document.documentElement.setAttribute(\"data-theme\", savedTheme);\n ($(\"#theme-toggle\") as HTMLButtonElement).textContent = savedTheme === \"dark\" ? \"☀️\" : \"🌙\";\n }\n\n $(\"#send-btn\").addEventListener(\"click\", () => send());\n $(\"#stop-btn\").addEventListener(\"click\", stop);\n const input = $(\"#input\") as HTMLTextAreaElement;\n input.addEventListener(\"keydown\", (e) => {\n if (e.key === \"Enter\" && !e.shiftKey) {\n e.preventDefault();\n send();\n }\n });\n\n $$(\".preset\").forEach((btn) =>\n btn.addEventListener(\"click\", () => send((btn as HTMLButtonElement).dataset.p)));\n\n $(\"#reveal-key\").addEventListener(\"click\", () => {\n const el = $(\"#key-display\");\n const full = el.dataset.full || \"\";\n el.textContent = el.textContent === full ? (el.dataset.masked || full) : full;\n });\n $(\"#copy-key\").addEventListener(\"click\", () => copy(state.apiKey));\n $(\"#copy-url\").addEventListener(\"click\", () => copy(state.baseUrl));\n $(\"#copy-model\").addEventListener(\"click\", () => copy(state.model));\n\n $(\"#save-chat\").addEventListener(\"click\", saveChat);\n renderSaved();\n\n $(\"#export-btn\").addEventListener(\"click\", (e) => {\n e.stopPropagation();\n const m = $(\"#export-menu\");\n m.classList.toggle(\"hidden\");\n });\n document.addEventListener(\"click\", () => $(\"#export-menu\").classList.add(\"hidden\"));\n $$(\"#export-menu button\").forEach((b) =>\n b.addEventListener(\"click\", () => {\n const fmt = (b as HTMLButtonElement).dataset.fmt || \"md\";\n const content = buildExport(fmt);\n download(`chat.${fmt === \"md\" ? \"md\" : fmt === \"csv\" ? \"csv\" : \"sh\"}`, content, \"text/plain\");\n $(\"#export-menu\").classList.add(\"hidden\");\n }));\n\n $$(\".tab\").forEach((t) =>\n t.addEventListener(\"click\", () => {\n $$(\".tab\").forEach((x) => x.classList.remove(\"active\"));\n t.classList.add(\"active\");\n const id = (t as HTMLButtonElement).dataset.t || \"\";\n $$(\".pane\").forEach((p) => p.classList.toggle(\"hidden\", p.id !== id));\n }));\n\n $$(\".conn-row\").forEach(() => { /* noop */ });\n}\n\ninit();\n",[],[106,131],["D",1788365847017],[142],[19],{"_34":35,"_13":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":143,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_77":144,"_18":145},["D",1788369399905],[],[19,36],"c5347651-cad0-468b-999b-ff32cc6090ac",["D",1788365801329],"deletedAt","legacyEnvVars","privacy","httpPrivacy","description","OpenAI-compatible gateway on Val Town native AI, no keys needed","imageUrl","userId","eddd5cb5-78be-4114-98c9-70030a02faea","pinnedFileId","pinPreview","pinMigrated","screenshotVersion","likeCount","orgId","01a062e4-8477-75ba-8a1d-30b57d9fb298","tursoName","tursoHostname","tursoMeasuredAt","pinned","userPerm","r","valPerm","blobPerm","rw","emailPerm","sqlitePerm","projectPerm","telemetryPerm","user",{"_11":12,"_200":196},"org",{"_11":12,"_193":194,"_195":196,"_155":156,"_197":198,"_199":55},"branch",{"_17":184,"_13":16,"_34":42,"_185":146,"_186":-5,"_187":-5,"_188":-5,"_189":-5,"_190":-5,"_191":14,"_192":12},"isOwned",47,"projectId","forkedBranchId","forkedBranchVersion","forkedProjectPrivacy","forkedProjectId","forkedProjectOrgId","projectName","userHandle","displayName","ramy haroon","avatar","https://lh3.googleusercontent.com/a/ACg8ocLJ5VsuqFGypcgPz5AldEDau-BsilRB9eIzAaaz2tVM1ucp3w=s96-c","tier","pro","canRestrictVals","profileImageUrl","adoptOrgId",{"_34":146,"_13":14,"_47":263,"_148":-5,"_149":55,"_150":106,"_151":106,"_152":153,"_154":-5,"_155":156,"_157":82,"_158":46,"_159":-5,"_160":-5,"_161":60,"_162":163,"_164":-5,"_165":-5,"_166":-5,"_167":-5,"_168":169,"_170":169,"_171":172,"_173":172,"_174":172,"_175":169,"_176":169,"_177":264,"_179":265,"_181":266,"_183":55},[233,235,239,240,241,242],"files",[233,234,235,236,237,238,239,240,241,242],"counts",{"_224":60,"_225":75,"_226":60,"_32":227,"_228":229},[222],{"_34":58,"_13":19,"_37":40,"_39":-5,"_41":42,"_43":62,"_45":46,"_47":220,"_17":60,"_50":59,"_52":-5,"_54":55,"_56":-5,"_18":221},"upstreamProject","upstreamBranch","emptyEnvVars","flags",[],"hasHttpFiles","grants","orgs","customDomains",{},["D",1788365847017],[19],{"_34":35,"_13":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":48,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_18":223},[19,36],"pulls","branches","forks",{"_230":75,"_232":60},"connections",{"_230":60,"_231":60},"count","unfilledCount","emptyCount",{"_34":58,"_13":19,"_37":40,"_39":-5,"_41":42,"_43":62,"_45":46,"_47":139,"_17":60,"_50":59,"_52":-5,"_54":55,"_56":-5,"_77":261,"_18":262},{"_34":35,"_13":36,"_37":38,"_39":40,"_41":42,"_43":44,"_45":46,"_47":143,"_17":49,"_50":51,"_52":53,"_54":55,"_56":-5,"_77":259,"_18":260},{"_34":105,"_13":106,"_37":107,"_39":-5,"_41":42,"_43":49,"_45":46,"_47":108,"_17":60,"_50":59,"_52":-5,"_54":55,"_56":-5,"_77":257,"_18":258},{"_34":130,"_13":131,"_37":132,"_39":107,"_41":42,"_43":133,"_45":46,"_47":134,"_17":135,"_50":51,"_52":136,"_54":55,"_56":-5,"_77":255,"_18":256},{"_34":122,"_13":123,"_37":124,"_39":107,"_41":42,"_43":125,"_45":46,"_47":126,"_17":93,"_50":24,"_52":127,"_54":55,"_56":-5,"_77":253,"_18":254},{"_34":114,"_13":115,"_37":116,"_39":107,"_41":42,"_43":117,"_45":46,"_47":118,"_17":62,"_50":24,"_52":119,"_54":55,"_56":-5,"_77":251,"_18":252},{"_34":98,"_13":99,"_37":100,"_39":-5,"_41":42,"_43":101,"_45":46,"_47":102,"_17":60,"_50":59,"_52":-5,"_54":55,"_56":-5,"_77":249,"_18":250},{"_34":90,"_13":91,"_37":92,"_39":-5,"_41":42,"_43":93,"_45":46,"_47":94,"_17":60,"_50":24,"_52":95,"_54":55,"_56":-5,"_77":247,"_18":248},{"_34":80,"_13":81,"_37":82,"_39":-5,"_41":42,"_43":83,"_45":46,"_47":84,"_17":62,"_50":85,"_52":86,"_54":55,"_56":87,"_77":245,"_18":246},{"_34":70,"_13":71,"_37":72,"_39":-5,"_41":42,"_43":73,"_45":46,"_47":74,"_17":75,"_50":24,"_52":76,"_54":55,"_56":-5,"_77":243,"_18":244},[],[71],[],[81],[],[91],[],[99],[],[106,115],[],[106,123],[],[106,131],[236,237,238],[106],[],[19,36],[234],[19],["D",1788365801329],{"_11":12,"_200":196},{"_11":12,"_193":194,"_195":196,"_155":156,"_197":198,"_199":55},{"_17":184,"_13":16,"_34":42,"_185":146,"_186":-5,"_187":-5,"_188":-5,"_189":-5,"_190":-5,"_191":14,"_192":12},"ctx",{"_177":-5,"_217":300,"_301":302,"_303":304,"_305":55,"_306":55,"_307":55,"_308":46,"_309":-5,"_310":-7,"_311":-7,"_312":60,"_313":55,"_314":55,"_315":-5,"_316":55,"_317":55,"_318":55,"_319":-5},"ENV",{"_271":272,"_273":274,"_275":16,"_276":277,"_278":279,"_280":281,"_282":283,"_284":285,"_286":287,"_288":289,"_290":291,"_292":293,"_294":295,"_296":297,"_298":299},"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"]