Spaces:
Sleeping
Sleeping
| <html lang="en"> | |
| <head> | |
| <meta charset="UTF-8"> | |
| <meta name="viewport" content="width=device-width, initial-scale=1.0"> | |
| <title>Async Web Scraper</title> | |
| <link rel="stylesheet" href="/src/css/style.css"> | |
| </head> | |
| <body> | |
| <div class="container"> | |
| <header> | |
| <h1>Async Web Scraper</h1> | |
| <p>Add URLs one by one and submit when done.</p> | |
| </header> | |
| <main> | |
| <div class="card add-url-card"> | |
| <div class="input-group"> | |
| <input type="url" id="urlInput" placeholder="https://example.com" /> | |
| <button id="addUrlBtn" class="btn btn-secondary">Add URL</button> | |
| </div> | |
| <div class="url-list-container"> | |
| <h3>URLs to Scrape <span id="urlCount" class="badge">0</span></h3> | |
| <ul id="urlList" class="url-list"> | |
| <!-- Dynamically populated --> | |
| </ul> | |
| </div> | |
| <button id="submitBtn" class="btn btn-primary" disabled>Start Extraction</button> | |
| </div> | |
| <div class="card status-card"> | |
| <div class="card-header" style="display: flex; justify-content: space-between; align-items: center;"> | |
| <h2>Active URLs</h2> | |
| <button id="downloadBtn" class="btn btn-secondary btn-sm" style="display: none; padding: 0.5rem 1rem;">Download JSONL</button> | |
| </div> | |
| <div class="table-container" style="overflow-x: auto;"> | |
| <table class="jobs-table" style="width: 100%; border-collapse: collapse; text-align: left; table-layout: fixed;"> | |
| <thead> | |
| <tr style="border-bottom: 1px solid var(--border); color: var(--text-muted);"> | |
| <th style="padding: 0.75rem; width: 50px;">No</th> | |
| <th style="padding: 0.75rem;">URL</th> | |
| <th style="padding: 0.75rem; width: 120px;">Status</th> | |
| </tr> | |
| </thead> | |
| <tbody id="jobsList"> | |
| <!-- Dynamically populated --> | |
| </tbody> | |
| </table> | |
| </div> | |
| </div> | |
| </main> | |
| </div> | |
| <script type="module" src="/src/main.ts"></script> | |
| </body> | |
| </html> | |