adding scheduler

web/index.html

@@ -57,6 +57,12 @@
   </header>
 
   <main class="container">
+    <div class="app-tabs" role="tablist" aria-label="Views">
+      <button type="button" id="tab-torrents" class="app-tab active" role="tab" aria-selected="true" aria-controls="panel-torrents" tabindex="0">Torrents</button>
+      <button type="button" id="tab-scheduler" class="app-tab" role="tab" aria-selected="false" aria-controls="panel-scheduler" tabindex="-1">Scheduler</button>
+    </div>
+
+    <section id="panel-torrents" role="tabpanel" aria-labelledby="tab-torrents">
     <div class="toolbar">
       <input type="search" id="filter" class="filter-input" placeholder="Filter torrents…" autocomplete="off" />
       <div class="sort-group" role="group" aria-label="Sort torrents">
@@ -103,6 +109,35 @@
       <p class="error-sub" id="error-msg">Could not reach the Transmission daemon.</p>
       <p class="error-hint" id="error-hint">Retrying in 3s…</p>
     </div>
+    </section>
+
+    <section id="panel-scheduler" role="tabpanel" aria-labelledby="tab-scheduler" hidden>
+      <div class="scheduler-heading">
+        <div>
+          <h2>Seed scheduler</h2>
+          <p>Completed torrents take turns when a scheduled seed has not uploaded for one hour.</p>
+        </div>
+        <form id="scheduler-settings" class="scheduler-settings">
+          <label for="scheduler-slots">Seed slots</label>
+          <input id="scheduler-slots" type="number" min="1" max="100" value="1" required />
+          <button type="submit" class="scheduler-button">Save</button>
+        </form>
+      </div>
+      <p id="scheduler-error" class="scheduler-error hidden" role="alert"></p>
+      <p id="scheduler-feedback" class="scheduler-feedback" role="status"></p>
+      <div class="scheduler-section-heading">
+        <h3>Completed torrents</h3>
+        <span id="scheduler-count"></span>
+      </div>
+      <div id="scheduler-torrents" class="scheduler-torrents"></div>
+      <p id="scheduler-empty" class="scheduler-empty hidden">No completed torrents are available for scheduling.</p>
+      <div class="scheduler-section-heading scheduler-history-heading">
+        <h3>Cycle history</h3>
+      </div>
+      <ol id="scheduler-history" class="scheduler-history"></ol>
+      <p id="scheduler-history-empty" class="scheduler-empty hidden">No cycles recorded yet.</p>
+      <button type="button" id="scheduler-history-more" class="scheduler-button secondary hidden">Load more</button>
+    </section>
   </main>
 
   <footer class="app-footer">