Zum Inhalt springen

LabelScan: Unterschied zwischen den Versionen

Aus ADOS Wiki
Keine Bearbeitungszusammenfassung
Keine Bearbeitungszusammenfassung
Zeile 1: Zeile 1:
<div id="ados-labelscan" class="ados-scan">
<div id="ados-labelscan" class="ados-scan">


  <header class="ados-scan__header">
<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>
  <p class="ados-scan__sub">Foto der Front-Label-Seite aufnehmen oder wählen. Die Erkennung läuft lokal im Browser.</p>
  </header>
</header>


  <form id="ados-scan-form" class="ados-scan__form" onsubmit="return false">
<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">
  <!-- Upload / Dropzone -->
      <div class="ados-scan__drop-icon">🖼️</div>
  <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-text">
    <div class="ados-scan__drop-icon">🖼️</div>
        <b>Bild hierher ziehen</b> oder
    <div class="ados-scan__drop-text">
        <button id="ados-scan-bigbtn" type="button" class="btn btn-secondary">Foto aufnehmen / wählen</button>
      <b>Bild hierher ziehen</b> oder
      </div>
      <button id="ados-scan-bigbtn" type="button" class="btn btn-secondary">Foto aufnehmen / wählen</button>
      <input id="ados-scan-file" type="file" accept="image/*" capture="environment" hidden>
    </div>
     </label>
    <input id="ados-scan-file" type="file" accept="image/*" capture="environment" hidden>
  </label>
 
  <!-- Status/Preview -->
  <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 class="ados-scan__statusrow">
  <div id="ados-scan-preview" class="ados-scan__preview" aria-live="polite" aria-atomic="true"></div>
      <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>
  <!-- Actions -->
  <div class="ados-scan__actions">
     <button id="ados-scan-run" type="submit" class="btn btn-primary">🔍 Erkennen &amp; 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>


    <div class="ados-scan__actions">
<section class="ados-scan__resultswrap">
      <button id="ados-scan-run" type="submit" class="btn btn-primary">🔍 Erkennen &amp; suchen</button>
  <h3>Vorschläge</h3>
      <button type="reset" class="btn btn-ghost" onclick="
  <div id="ados-scan-results" class="ados-scan__results"></div>
        const p=document.getElementById('ados-scan-preview'); if(p) p.innerHTML='';
</section>
        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">
<details class="ados-scan__debug">
    <h3>Vorschläge</h3>
  <summary>OCR-Text (Debug)</summary>
    <div id="ados-scan-results" class="ados-scan__results"></div>
  <div id="ados-scan-ocr" style="white-space:pre-wrap; font-size:12px; color:#666;"></div>
  </section>
</details>


  <details class="ados-scan__debug">
<footer class="ados-scan__note">🔒 Das Bild bleibt auf deinem Gerät. Es wird nicht hochgeladen.</footer>
    <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>
</div>

Version vom 5. November 2025, 23:42 Uhr

<header class="ados-scan__header">

📸 Abfüllung scannen

Foto der Front-Label-Seite aufnehmen oder wählen. Die Erkennung läuft lokal im Browser.

</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">
🖼️
     Bild hierher ziehen oder
     <button id="ados-scan-bigbtn" type="button" class="btn btn-secondary">Foto aufnehmen / wählen</button>
   <input id="ados-scan-file" type="file" accept="image/*" capture="environment" hidden>
 </label>
Bereit.
   <progress id="ados-scan-progress" max="1" value="0" class="ados-scan__progress" hidden></progress>
   <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>

</form>

<section class="ados-scan__resultswrap">

Vorschläge

</section>

<details class="ados-scan__debug">

 <summary>OCR-Text (Debug)</summary>

</details>

<footer class="ados-scan__note">🔒 Das Bild bleibt auf deinem Gerät. Es wird nicht hochgeladen.</footer>