|
|
| Zeile 1: |
Zeile 1: |
| <html> | | <html> |
| <div id="ados-labelscan" class="ados-scan"> | | <div> |
| | |
| <header class="ados-scan__header">
| |
| <h2>📸 Abfüllung scannen</h2> | | <h2>📸 Abfüllung scannen</h2> |
| <p class="ados-scan__sub">Foto der Front-Label-Seite aufnehmen oder wählen. Die Erkennung läuft lokal im Browser.</p>
| |
| </header>
| |
|
| |
| <form id="ados-scan-form" class="ados-scan__form" onsubmit="return false">
| |
| <label for="ados-scan-file" class="ados-scan__drop" id="ados-scan-drop" aria-label="Datei wählen oder hier ablegen">
| |
| <div class="ados-scan__drop-icon">🖼️</div>
| |
| <div class="ados-scan__drop-text">
| |
| <b>Bild hierher ziehen</b> oder
| |
| <button id="ados-scan-bigbtn" type="button" class="btn btn-secondary">Foto aufnehmen / wählen</button>
| |
| </div>
| |
| <input id="ados-scan-file" type="file" accept="image/*" capture="environment" hidden>
| |
| </label>
| |
|
| |
| <div class="ados-scan__statusrow">
| |
| <div id="ados-scan-status" class="ados-scan__status">Bereit.</div>
| |
| <progress id="ados-scan-progress" max="1" value="0" class="ados-scan__progress" hidden></progress>
| |
| </div>
| |
|
| |
| <div id="ados-scan-preview" class="ados-scan__preview" aria-live="polite" aria-atomic="true"></div>
| |
|
| |
|
| <div class="ados-scan__actions"> | | <input id="ados-scan-file" type="file" accept="image/*" capture="environment"> |
| <button id="ados-scan-run" type="submit" class="btn btn-primary">🔍 Erkennen & suchen</button>
| |
| <button type="reset" class="btn btn-ghost" onclick="
| |
| const p=document.getElementById('ados-scan-preview'); if(p) p.innerHTML='';
| |
| const f=document.getElementById('ados-scan-file'); if(f) f.value='';
| |
| const s=document.getElementById('ados-scan-status'); if(s) s.textContent='Bereit.';
| |
| ">Zurücksetzen</button>
| |
| </div>
| |
| </form>
| |
|
| |
|
| <section class="ados-scan__resultswrap">
| | <button id="ados-scan-run">🔍 Erkennen & suchen</button> |
| <h3>Vorschläge</h3> | |
| <div id="ados-scan-results" class="ados-scan__results"></div>
| |
| </section>
| |
|
| |
|
| <details class="ados-scan__debug">
| | <div id="ados-scan-status" style="margin-top:6px; font-style:italic;">Bereit.</div> |
| <summary>OCR-Text (Debug)</summary>
| |
| <div id="ados-scan-ocr" style="white-space:pre-wrap; font-size:12px; color:#666;"></div> | |
| </details>
| |
|
| |
|
| <footer class="ados-scan__note">🔒 Das Bild bleibt auf deinem Gerät. Es wird nicht hochgeladen.</footer> | | <div id="ados-scan-preview" style="margin-top:10px;"></div> |
|
| |
|
| | <h3>Treffer:</h3> |
| | <div id="ados-scan-results"></div> |
| </div> | | </div> |
| </html> | | </html> |
