forked from bots-garden/ori
| ✨ Workspace panel, selectors, previews, desktop app, sandbox template, resizable file tree, light/dark theme | 1 | <!DOCTYPE html> |
| 2 | <html lang="en"> | |
| 3 | <head> | |
| 4 | <meta charset="UTF-8"/> | |
| 5 | <meta content="width=device-width, initial-scale=1.0" name="viewport"/> | |
| 6 | <title>ori</title> | |
| 7 | <link href="/main.css" rel="stylesheet"/> | |
| 8 | </head> | |
| 9 | <body> | |
| 10 | <!-- Screen 1: connection. Shown at startup and after "Disconnect". --> | |
| 11 | <section class="screen connect" id="connect-screen"> | |
| 12 | <form class="card" id="connect-form" autocomplete="off"> | |
| 13 | <h1>ori</h1> | |
| 14 | <p class="hint">Address of the ori server (the Go server that serves the web client).</p> | |
| 15 | <label for="server-url">Server URL</label> | |
| 16 | <input id="server-url" type="text" placeholder="http://localhost:8888" spellcheck="false"/> | |
| 17 | <div class="actions"> | |
| 18 | <button type="button" class="secondary" id="check-btn">Check</button> | |
| 19 | <button type="submit" class="primary" id="connect-btn">Connect</button> | |
| 20 | </div> | |
| 21 | <p class="status" id="status" role="status" aria-live="polite"></p> | |
| 22 | <p class="fineprint" id="settings-path"></p> | |
| 23 | </form> | |
| 24 | </section> | |
| 25 | ||
| 26 | <!-- Screen 2: the ori webapp itself, embedded in an iframe served by ori. --> | |
| 27 | <section class="screen viewer" id="viewer-screen" hidden> | |
| 28 | <header class="bar"> | |
| 29 | <span class="dot" aria-hidden="true"></span> | |
| 30 | <span class="url" id="viewer-url"></span> | |
| 31 | <span class="spacer"></span> | |
| 32 | <button type="button" class="ghost" id="reload-btn" title="Reload the ori page">Reload</button> | |
| 33 | <button type="button" class="ghost" id="browser-btn" title="Open in the system browser">Open in browser</button> | |
| 34 | <button type="button" class="ghost" id="disconnect-btn" title="Back to the connection screen">Disconnect</button> | |
| 35 | </header> | |
| 36 | <iframe id="ori-frame" title="ori web client" allow="clipboard-read; clipboard-write"></iframe> | |
| 37 | </section> | |
| 38 | ||
| 39 | <script type="module" src="/main.js"></script> | |
| 40 | </body> | |
| 41 | </html> |