assets/index.js (0b11928) - bibweb.git · git.schokokeks.org

Box scannen und Kartongrößen genauer abfragen.

Bernd Wurst commited 0b11928 at 2026-09-02 13:34:15

index.js

Blame History Raw

document.addEventListener('DOMContentLoaded', function() {
    // 1. Alle relevanten Eingabefelder im Formular auswählen
    // Wir verwenden 'input[type="text"]' und 'input[type="tel"]'
    const inputFields = document.querySelectorAll('input[type="text"]');

// 2. Event-Listener zu jedem Eingabefeld hinzufügen
    inputFields.forEach(input => {
        input.addEventListener('focus', function() {
            // Führen Sie einen leichten Timeout ein,
            // um dem Browser Zeit zu geben, die Tastatur einzublenden
            setTimeout(() => {
                // 3. Verwenden Sie scrollIntoView, um das Eingabefeld in den Blick zu bringen
                const rect = this.getBoundingClientRect();
                const viewportHeight = window.innerHeight || document.documentElement.clientHeight;
                const spaceToBottom = viewportHeight - rect.bottom;
                if (spaceToBottom < 100) {
                    this.scrollIntoView({
                        behavior: 'smooth', // Sanfter Scroll-Effekt
                        block: 'start'      // Positioniert das Element am oberen Rand des Viewports
                    });
                }
            }, 300); // 300ms Verzögerung, kann je nach Gerät angepasst werden
        });
    });

// JavaScript
    const boxInput = document.getElementById('box_label');
    const infoBox = document.getElementById('noNumberInfo');
    const btnText = document.getElementById('btnText');
    const btnIcon = document.getElementById('btnIcon');
    const divider = document.getElementById('divider');

boxInput.addEventListener('input', function() {
      const value = this.value.trim();

if (value !== '') {
        // Eingabe vorhanden: Hinweis ausblenden, Button anpassen
        infoBox.classList.add('d-none');
        divider.classList.add('d-none'); // Trenner ausblenden
        btnText.textContent = `Box ${value} wählen`;
        btnIcon.classList.add('d-none'); // Optional: Plus-Icon ausblenden
      } else {
        // Eingabe leer: Hinweis anzeigen, Standard-Text setzen
        infoBox.classList.remove('d-none');
        divider.classList.remove('d-none'); // Trenner wieder anzeigen
        btnText.textContent = 'Box mit Namen beschriftet';
        btnIcon.classList.remove('d-none');
      }
    });
});