File size: 2,853 Bytes
b15f6bf
 
7c31000
b15f6bf
 
7c31000
b15f6bf
 
7c31000
 
b15f6bf
 
 
 
7c31000
b15f6bf
 
 
 
 
 
 
7c31000
b15f6bf
 
 
 
 
 
 
 
 
 
 
 
7c31000
b15f6bf
 
 
 
 
 
 
 
 
7c31000
b15f6bf
 
 
 
 
7c31000
b15f6bf
 
 
 
 
 
 
 
 
 
 
 
 
7c31000
b15f6bf
 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
<!-- static/index.html  –  FULL FILE -->
<!doctype html><html lang="en">
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width,initial-scale=1">
  <title>AnyCoder AI Code Generator</title>
  <meta name="description" content="Generate, modify & understand code with advanced AI models.">
  <link rel="stylesheet" href="/static/style.css">
</head>
<body>
<header>
  <h1>🚀 AnyCoder AI</h1>
  <p>Your AI partner for generating, modifying & understanding code.</p>
</header>

<main>
  <!-- 1 Model -->
  <section>
    <h2>1. Select Model</h2>
    <label class="visually-hidden" for="model">AI Model</label>
    <select id="model"></select>
  </section>

  <!-- 2 Context -->
  <section>
    <h2>2. Provide Context</h2>
    <div class="tabs" role="tablist">
      <button role="tab" aria-selected="true" id="tab-prompt"  aria-controls="p-prompt">Prompt</button>
      <button role="tab" aria-selected="false"id="tab-file"    aria-controls="p-file">File</button>
      <button role="tab" aria-selected="false"id="tab-website" aria-controls="p-web">Website</button>
    </div>
    <div id="p-prompt"  role="tabpanel"><textarea id="prompt" placeholder="Describe what you want to build…"></textarea></div>
    <div id="p-file"    role="tabpanel" hidden><input type="file" id="reference-file" accept=".pdf,.docx,.txt"></div>
    <div id="p-web"     role="tabpanel" hidden><input type="url"  id="website-url" placeholder="https://example.com"></div>
  </section>

  <!-- 3 Output -->
  <section>
    <h2>3. Configure Output</h2>
    <label for="language">Target Language</label>
    <select id="language"></select>
    <div class="search-toggle">
      <input type="checkbox" id="web-search"><label for="web-search">Enable Web Search</label>
    </div>
  </section>

  <!-- actions -->
  <section class="actions">
    <button id="clear"   type="button">Clear Session</button>
    <button id="generate"type="button">Generate Code</button>
  </section>

  <!-- output -->
  <section>
    <h2 class="visually-hidden">Output</h2>
    <div class="tabs" role="tablist">
      <button role="tab" aria-selected="true" id="tab-code"    aria-controls="o-code">Code</button>
      <button role="tab" aria-selected="false"id="tab-preview" aria-controls="o-prev">Live Preview</button>
      <button role="tab" aria-selected="false"id="tab-history" aria-controls="o-hist">History</button>
    </div>
    <div id="o-code"  role="tabpanel"><pre><code id="code-output" class="language-text"></code></pre></div>
    <div id="o-prev"  role="tabpanel" hidden><iframe id="preview" sandbox="allow-scripts allow-same-origin"></iframe></div>
    <div id="o-hist"  role="tabpanel" hidden><ul id="history-list" aria-live="polite"></ul></div>
  </section>
</main>

<script type="module" src="/static/index.js"></script>
</body></html>