wai/wai-ui becomes wai/wai-app, the library `wai_app`, with no binary and no `cli` feature: `wai`, built with its feature `app`, is its command line and its MCP server. Its served files are named wai-app-* (the WebAssembly package wai_app), the recordings wai-app-*.json. - export.rs gives the files of a starter project for a program and the facts its project file holds (title, summary, `wai dev`'s mode for the app's room, a watch room's file, a show's audience); `wai create --from app.oui` writes them, the project file and the licence. The export no longer writes app.json, room.toml, relay.toml, package.json, check.mjs or serve.mjs: wai.json names the room, `wai dev` runs it and `wai app check` checks the project. Its README and AGENTS.md say so, and the README its licence. - runtime.rs reads a Create runtime by its listing (create/wai-app-runtime.json), checking each file's SHA-256. - bridge.rs keeps the bridge on 127.0.0.1 a coding agent streams a program into the page through, with a stream helper; the stdio server, its tools and the binary's test go (`wai mcp --toolset app` serves them). - The page's Export hands over app.oui, the program in its canonical form, and the command that makes it a project; the ZIP writer and the page's export in WebAssembly go. The page names `wai mcp --toolset app` for the coding agent. - joule-ui/docs/create.md §4 and §5: the export as `wai create --from app.oui`, and the agent's tools app_guide, app_check, app_stream and app_export. Co-Authored-By: Claude Opus 5.5 <[email protected]>
59 lines
3.1 KiB
HTML
59 lines
3.1 KiB
HTML
<!doctype html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="utf-8">
|
|
<meta name="viewport" content="width=device-width, initial-scale=1">
|
|
<title>Create</title>
|
|
<link rel="icon" href="data:,">
|
|
<link rel="stylesheet" href="./ui.css">
|
|
<style>body { margin: 0; padding: 16px; background: var(--wai-bg); } h1 { font: 600 1.3rem system-ui, sans-serif; color: var(--wai-fg); margin: 0 0 12px; }</style>
|
|
</head>
|
|
<body>
|
|
<h1>Create</h1>
|
|
<!-- The Create page, as wai-app serves it for development and its end-to-end test; the WAI
|
|
site's page carries the same element ids. The room service is /room-api on this page's
|
|
origin, the relay /moq. -->
|
|
<div id="create" class="create" data-service="/room-api" data-frame="./room-frame.html" data-runtime="./runtime.json" data-recorded="./recorded/">
|
|
<form id="describe">
|
|
<label for="prompt">Describe your app</label>
|
|
<textarea id="prompt">A show for my channel, with chat and a live poll</textarea>
|
|
<fieldset>
|
|
<legend>The model that writes it</legend>
|
|
<label><input type="radio" name="source" value="own"> Your own model</label>
|
|
<label><input type="radio" name="source" value="agent"> Your coding agent</label>
|
|
<label><input type="radio" name="source" value="replay" checked> A recorded stream</label>
|
|
</fieldset>
|
|
<div id="own" class="source-fields" hidden>
|
|
<label>Its chat/completions address <input id="own-endpoint" type="url" placeholder="http://127.0.0.1:8000/v1/chat/completions" autocomplete="off"></label>
|
|
<label>Model <input id="own-model" autocomplete="off"></label>
|
|
<label>Your key (kept in this tab's memory alone) <input id="own-key" type="password" autocomplete="off"></label>
|
|
</div>
|
|
<div id="agent" class="source-fields" hidden>
|
|
<label>The bridge <code>wai mcp --toolset app</code> printed <input id="agent-bridge" placeholder="http://127.0.0.1:port" autocomplete="off"></label>
|
|
<label>Its pairing code <input id="agent-code" autocomplete="off"></label>
|
|
<span id="agent-state" role="status"></span>
|
|
</div>
|
|
<div id="replay" class="source-fields">
|
|
<label>Recording <select id="recording"><option value="show">A show with chat and a live poll</option><option value="room">A live room with chat</option><option value="watch-refused">A watch party asked for chat (refused lines)</option></select></label>
|
|
</div>
|
|
<div><button id="build" class="wai-btn wai-primary" type="submit">Build it</button></div>
|
|
</form>
|
|
<p id="model-says" role="status" aria-live="polite"></p>
|
|
<div class="create-grid">
|
|
<section id="app-pane" aria-label="Your app"><div id="app" class="wai-app"></div></section>
|
|
<aside>
|
|
<h2>The program, as it arrives</h2>
|
|
<ol id="program"></ol>
|
|
<h2>Problems</h2>
|
|
<ul id="problems"></ul>
|
|
<h2>Export</h2>
|
|
<button id="export" class="wai-btn" type="button" disabled>Export app.oui</button>
|
|
<a id="download" hidden></a>
|
|
<p id="export-status" class="wai-note"></p>
|
|
<pre id="export-command" class="wai-note"></pre>
|
|
</aside>
|
|
</div>
|
|
</div>
|
|
<script type="module" src="./create.js"></script>
|
|
</body>
|
|
</html>
|