Spaces:
Sleeping
Sleeping
| <html> | |
| <head> | |
| <meta charset="utf-8" /> | |
| <meta name="viewport" content="width=device-width, initial-scale=1" /> | |
| <title>Watermark Remover</title> | |
| <link rel="stylesheet" href="/static/style.css" /> | |
| </head> | |
| <body> | |
| <main> | |
| <h1>Watermark Remover</h1> | |
| <form id="form"> | |
| <label>Image <input type="file" name="image" accept="image/*" required></label> | |
| <label>Mask (optional) <input type="file" name="mask" accept="image/*"></label> | |
| <div class="row"> | |
| <label>Engine | |
| <select name="engine"> | |
| <option value="opencv" selected>OpenCV (fast, free)</option> | |
| <option value="lama">LaMa (needs separate server)</option> | |
| </select> | |
| </label> | |
| <label>Method | |
| <select name="method"> | |
| <option value="telea" selected>Telea</option> | |
| <option value="ns">Navier-Stokes</option> | |
| </select> | |
| </label> | |
| <label>Radius <input type="number" name="radius" value="3" min="1" max="50"></label> | |
| <label>Auto Mask <input type="checkbox" name="auto_mask" checked></label> | |
| </div> | |
| <button type="submit">Remove</button> | |
| </form> | |
| <section id="output" class="hidden"> | |
| <h2>Result</h2> | |
| <img id="result-img" alt="result" /> | |
| <a id="download" download="result.png">Download</a> | |
| </section> | |
| </main> | |
| <script> | |
| const form = document.getElementById('form'); | |
| const out = document.getElementById('output'); | |
| const img = document.getElementById('result-img'); | |
| const dl = document.getElementById('download'); | |
| form.addEventListener('submit', async (e) => { | |
| e.preventDefault(); | |
| const data = new FormData(form); | |
| data.set('auto_mask', form.auto_mask.checked ? 1 : 0); | |
| const res = await fetch('/api/remove-watermark', { method: 'POST', body: data }); | |
| if (!res.ok) { alert('Failed: ' + res.status); return; } | |
| const blob = await res.blob(); | |
| const url = URL.createObjectURL(blob); | |
| img.src = url; | |
| dl.href = url; | |
| out.classList.remove('hidden'); | |
| }); | |
| </script> | |
| </body> | |
| </html> | |