Spaces:
Sleeping
Sleeping
Interior Env
Exposed live Physics engine logic to Frontend Visualizer and upgraded LLM agent prompt
a373fb7 | <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Interior Design AI | Human Flow Simulator</title> | |
| <link rel="stylesheet" href="/static/style.css"> | |
| <link href="https://fonts.googleapis.com/css2?family=Space+Grotesk:wght@400;600&family=JetBrains+Mono:wght@400;700&display=swap" rel="stylesheet"> | |
| </head> | |
| <body> | |
| <div class="background"></div> | |
| <div class="container"> | |
| <header class="glass"> | |
| <h1><span class="highlight">SPATIAL</span>_ENGINE</h1> | |
| <p>Furniture Tetris + A* Pathfinding (OpenEnv V4)</p> | |
| </header> | |
| <main> | |
| <div id="selection-screen" class="glass panel"> | |
| <h2>Select Blueprint</h2> | |
| <div id="task-list" class="task-grid"></div> | |
| </div> | |
| <div id="simulation-screen" class="hidden"> | |
| <div class="status-bar glass"> | |
| <div>TASK: <strong id="lbl-task" class="highlight">---</strong></div> | |
| <div>STEP: <strong id="lbl-step">0</strong>/<span id="lbl-max">0</span></div> | |
| <div>STATUS: <strong id="lbl-status" class="status fail">FAILING</strong></div> | |
| </div> | |
| <div class="main-layout"> | |
| <!-- Left: Inventory & Logs --> | |
| <div class="sidebar"> | |
| <div class="glass panel"> | |
| <h3>Inventory</h3> | |
| <ul id="inventory-list" class="item-list"></ul> | |
| </div> | |
| <div class="glass panel"> | |
| <h3>Simulator Logs</h3> | |
| <div id="logs" class="console"></div> | |
| </div> | |
| <div class="glass panel override"> | |
| <h3>Agent Override</h3> | |
| <div class="controls"> | |
| <select id="action-type"> | |
| <option value="place_item">Place</option> | |
| <option value="remove_item">Remove</option> | |
| </select> | |
| <input type="text" id="action-item" placeholder="Item ID (e.g. bed)"> | |
| <div class="coords"> | |
| <input type="number" id="action-x" placeholder="X"> | |
| <input type="number" id="action-y" placeholder="Y"> | |
| <select id="action-rot"> | |
| <option value="0">0°</option> | |
| <option value="90">90°</option> | |
| </select> | |
| </div> | |
| <button id="btn-submit" class="btn">Execute Step</button> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Right: Blueprint Visualizer --> | |
| <div class="glass panel blueprint-container"> | |
| <div style="display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px;"> | |
| <h3 style="margin: 0;">Live Blueprint (Top-Down)</h3> | |
| <div class="physics-toggles" style="display: flex; gap: 15px; font-size: 14px; color: #a0aec0;"> | |
| <label style="cursor: pointer;"><input type="checkbox" id="toggleSolar" onchange="if(window.currentObs) window.drawCanvas(window.currentObs)"> ☀️ Solar</label> | |
| <label style="cursor: pointer;"><input type="checkbox" id="toggleThermal" onchange="if(window.currentObs) window.drawCanvas(window.currentObs)"> 🌡️ Thermal</label> | |
| </div> | |
| </div> | |
| <div class="canvas-wrapper"> | |
| <canvas id="blueprint" width="600" height="600"></canvas> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <div id="modal-success" class="modal hidden"> | |
| <div class="modal-content glass text-center"> | |
| <h2 class="text-green">DESIGN APPROVED</h2> | |
| <p>Zero collisions. Human flow verified.</p> | |
| <p id="modal-score" class="score">Score: 0.00</p> | |
| <button onclick="location.reload()" class="btn">Restart Simulator</button> | |
| </div> | |
| </div> | |
| </main> | |
| </div> | |
| <script src="/static/app.js"></script> | |
| </body> | |
| </html> | |