diff options
Diffstat (limited to 'web/index.html')
| -rw-r--r-- | web/index.html | 71 |
1 files changed, 59 insertions, 12 deletions
diff --git a/web/index.html b/web/index.html index 7c0b030..0632cd7 100644 --- a/web/index.html +++ b/web/index.html @@ -7,8 +7,24 @@ <meta name="base-path" content="/claudomator"> <link rel="stylesheet" href="style.css" /> <link rel="icon" href="data:,"> + <script> + (function() { + var I = 5 * 60 * 1000; + function b() { return Math.floor(Date.now() / I); } + function u(n) { return "url('https://picsum.photos/1920/1080?random=" + n + "')"; } + function apply(n) { document.body.style.setProperty('--bg-url', u(n)); } + function schedule() { + setTimeout(function() { apply(b()); new Image().src = u(b() + 1); schedule(); }, I - (Date.now() % I)); + } + document.addEventListener('DOMContentLoaded', function() { + apply(b()); + new Image().src = u(b() + 1); + schedule(); + }); + })(); + </script> </head> -<body> +<body class="bg-body"> <header> <h1>Claudomator</h1> <div class="header-actions"> @@ -18,16 +34,18 @@ <option value="gemini">Gemini</option> <option value="local">Local</option> </select> + <button id="btn-notifications" class="btn-secondary" title="Enable push notifications">🔔</button> <button id="btn-start-next" class="btn-secondary">Start Next</button> <button id="btn-new-task" class="btn-primary">New Task</button> </div> </header> <nav class="tab-bar"> + <button class="tab" data-tab="stories" title="Stories">📖</button> <button class="tab active" data-tab="queue" title="Queue">⏳</button> <button class="tab" data-tab="interrupted" title="Interrupted">⚠️<span class="tab-count-badge" hidden></span></button> <button class="tab" data-tab="ready" title="Ready">✅<span class="tab-count-badge" hidden></span></button> <button class="tab" data-tab="running" title="Running">▶️<span class="tab-count-badge" hidden></span></button> - <button class="tab" data-tab="all" title="All">☰<span class="tab-count-badge" hidden></span></button> + <button class="tab" data-tab="drops" title="Drops">📁</button> <button class="tab" data-tab="stats" title="Stats">📊</button> <button class="tab" data-tab="settings" title="Settings">⚙️</button> </nav> @@ -42,14 +60,16 @@ </div> <div data-panel="ready" hidden> <div class="panel-task-list"></div> + <div class="ready-completed-history"></div> </div> <div data-panel="running" hidden> <div class="running-current"></div> <div class="running-history"></div> </div> - <div data-panel="all" hidden> - <div class="all-history"></div> + <div data-panel="drops" hidden> + <div class="drops-panel"></div> </div> + <div data-panel="stories" hidden></div> <div data-panel="stats" hidden></div> <div data-panel="settings" hidden> <p class="task-meta" style="padding:1rem">Settings coming soon.</p> @@ -70,15 +90,12 @@ <p class="elaborate-hint">AI will fill in the form fields below. You can edit before submitting.</p> </div> <hr class="form-divider"> - <label>Project - <select name="project_dir" id="project-select"> - <option value="/workspace/claudomator" selected>/workspace/claudomator</option> - <option value="__new__">Create new project…</option> - </select> + <label>Repository URL + <input name="repository_url" id="repository-url" placeholder="https://github.com/user/repo.git" required> + </label> + <label>Container Image + <input name="container_image" id="container-image" placeholder="claudomator-agent:latest" value="claudomator-agent:latest"> </label> - <div id="new-project-row" hidden> - <label>New Project Path <input id="new-project-input" placeholder="/workspace/my-new-app"></label> - </div> <label>Name <input name="name" required></label> <label>Instructions <textarea name="instructions" rows="6" required></textarea></label> <div class="validate-section"> @@ -125,6 +142,36 @@ </div> </dialog> + <!-- New Story modal --> + <dialog id="story-modal"> + <div class="story-modal-header"> + <h2>New Story</h2> + <button id="btn-close-story-modal" class="btn-close-panel" aria-label="Close">✕</button> + </div> + <div class="story-modal-body"> + <label>Project + <select id="story-project"></select> + </label> + <label>Goal + <textarea id="story-goal" rows="4" placeholder="Describe the feature or change you want to build…"></textarea> + </label> + <button type="button" id="btn-story-elaborate" class="btn-secondary">Elaborate with AI ✦</button> + <div id="story-plan-area" hidden></div> + <div class="form-actions"> + <button type="button" id="btn-story-approve" class="btn-primary" hidden>Approve & Queue</button> + </div> + </div> + </dialog> + + <!-- Story detail modal --> + <dialog id="story-detail-modal"> + <div class="story-modal-header"> + <h2 id="story-detail-name">Story</h2> + <button id="btn-close-story-detail" class="btn-close-panel" aria-label="Close">✕</button> + </div> + <div id="story-detail-body" class="story-detail-body meta-grid"></div> + </dialog> + <script type="module" src="app.js"></script> </body> </html> |