|
|
|
|
|
<!DOCTYPE html> |
|
|
<html lang="en"> |
|
|
<head> |
|
|
<meta charset="UTF-8" /> |
|
|
<meta name="viewport" content="width=device-width,initial-scale=1.0" /> |
|
|
<title>AnyCoder AI Code Generator</title> |
|
|
<meta name="description" |
|
|
content="Generate, modify & understand code with the most advanced AI models." /> |
|
|
<link rel="stylesheet" href="file=/static/style.css" /> |
|
|
</head> |
|
|
<body> |
|
|
<header> |
|
|
<h1>🚀 AnyCoder AI</h1> |
|
|
<p>Your AI partner for generating, modifying & understanding code.</p> |
|
|
</header> |
|
|
|
|
|
<main> |
|
|
|
|
|
<section aria-labelledby="m‑h"> |
|
|
<h2 id="m‑h">1. Select Model</h2> |
|
|
<select id="model" aria-label="AI Model"></select> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section aria-labelledby="c‑h"> |
|
|
<h2 id="c‑h">2. Provide Context</h2> |
|
|
|
|
|
<div class="tabs" role="tablist"> |
|
|
<button role="tab" id="t‑prompt" aria-controls="p‑prompt" aria-selected="true">Prompt</button> |
|
|
<button role="tab" id="t‑file" aria-controls="p‑file" aria-selected="false">File</button> |
|
|
<button role="tab" id="t‑web" aria-controls="p‑web" aria-selected="false">Website</button> |
|
|
</div> |
|
|
|
|
|
<div role="tabpanel" id="p‑prompt"> |
|
|
<textarea id="prompt" placeholder="Describe what you want to build…"></textarea> |
|
|
</div> |
|
|
|
|
|
<div role="tabpanel" id="p‑file" hidden> |
|
|
<label for="file">Reference file</label> |
|
|
<input id="file" type="file" accept=".pdf,.docx,.txt" /> |
|
|
</div> |
|
|
|
|
|
<div role="tabpanel" id="p‑web" hidden> |
|
|
<label for="url">Website URL</label> |
|
|
<input id="url" type="url" placeholder="https://example.com" /> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section aria-labelledby="o‑h"> |
|
|
<h2 id="o‑h">3. Configure Output</h2> |
|
|
<label for="lang">Target language</label> |
|
|
<select id="lang"></select> |
|
|
|
|
|
<div class="search"> |
|
|
<input id="search" type="checkbox" /> |
|
|
<label for="search">Enable web search</label> |
|
|
</div> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section class="actions"> |
|
|
<button id="clear">Clear session</button> |
|
|
<button id="gen">Generate code</button> |
|
|
</section> |
|
|
|
|
|
|
|
|
<section aria-labelledby="out‑h"> |
|
|
<h2 id="out‑h" class="visually‑hidden">Output</h2> |
|
|
|
|
|
<div class="tabs" role="tablist"> |
|
|
<button role="tab" id="t‑code" aria-controls="p‑code" aria-selected="true">Code</button> |
|
|
<button role="tab" id="t‑preview" aria-controls="p‑preview" aria-selected="false">Preview</button> |
|
|
<button role="tab" id="t‑hist" aria-controls="p‑hist" aria-selected="false">History</button> |
|
|
</div> |
|
|
|
|
|
<div role="tabpanel" id="p‑code"> |
|
|
<pre><code id="code"></code></pre> |
|
|
</div> |
|
|
|
|
|
<div role="tabpanel" id="p‑preview" hidden> |
|
|
<iframe id="preview" sandbox="allow-scripts allow-same-origin"></iframe> |
|
|
</div> |
|
|
|
|
|
<div role="tabpanel" id="p‑hist" hidden> |
|
|
<ul id="hist" aria-live="polite"></ul> |
|
|
</div> |
|
|
</section> |
|
|
</main> |
|
|
|
|
|
<script type="module" src="file=/static/index.js"></script> |
|
|
</body> |
|
|
</html> |
|
|
|
