Přeskočit na hlavní obsah

Detailní konfigurace widgetu

Přehled všech konfiguračních možností​

const modal = new PhoneValidationModal({
    // Povinné
    apiKey: 'váš-api-klíč',
    
    // Volitelné parametry
    language: 'cs',                    // Jazyk rozhraní
    defaultCountry: 'CZ',              // Předvolená země
    primaryColor: '#3b82f6',           // Hlavní barva
    verificationMode: 'online',        // Režim ověření
    debug: false,                      // Debug logování
    
    // Callback funkce
    onSuccess: function(data) {},      // Úspěšné ověření
    onError: function(error) {},       // Chyba
    onClose: function() {}             // Zavření modalu
});

Detailní popis parametrů​

apiKey​

  • Typ: string
  • Povinný: Ano
  • Popis: Unikátní identifikátor vašeho tenantu (UUID v4)
  • Formát: XXXXXXXX-XXXX-XXXX-XXXX-XXXXXXXXXXXX
  • Příklad: '550e8400-e29b-41d4-a716-446655440000'
  • Poznámka: Tento klíč obdržíte od správce systému

language​

  • Typ: string
  • Povinný: Ne
  • Výchozí: Automatická detekce z navigator.language
  • Dostupné hodnoty:
    • 'en' - English
    • 'cs' - Čeština
    • 'sk' - Slovenčina
    • 'pl' - Polski
  • Příklad: language: 'cs'
  • Chování:
    • Pokud není zadán, widget detekuje jazyk z prohlížeče
    • Pokud jazyk není podporován, použije se angličtina

defaultCountry​

  • Typ: string
  • Povinný: Ne
  • Výchozí: Žádná předvolená země
  • Formát: ISO 3166-1 alpha-2 kód země (2 písmena)
  • Příklady:
    • 'CZ' - Česká republika
    • 'SK' - Slovensko
    • 'PL' - Polsko
    • 'DE' - Německo
  • Využití:
    • Předvyplní mezinárodní předvolbu
    • Umožňuje zadávat čísla bez předvolby
    • Například pro defaultCountry: 'CZ':
      • Uživatel zadá: 777123456
      • Systém zpracuje jako: +420777123456

primaryColor​

  • Typ: string
  • Povinný: Ne
  • Výchozí: '#3b82f6' (modrá)
  • Formát: HEX kód barvy (včetně #)
  • Příklady:
    • '#e11d48' - Červená
    • '#15803d' - Zelená
    • '#9333ea' - Fialová
  • Co ovlivňuje:
    • Pozadí primárních tlačítek
    • Barvu odkazů
    • Focus stavy inputů
    • Barvu progress indikátorů

verificationMode​

  • Typ: string
  • Povinný: Ne
  • Výchozí: 'online'
  • Možnosti:

'online' (výchozí)​

  • Kód je ověřen na serveru
  • Nejbezpečnější varianta
  • Vyžaduje internetové připojení
  • Widget automaticky zpracuje ověření

'offline'​

  • Kód je poslán rodičovskému oknu
  • Vy ověříte kód na vašem backendu
  • Vhodné pro vysokou kontrolu nad procesem
  • Vyžaduje implementaci message handleru

'hybrid'​

  • Kombinace online a offline
  • Nejprve lokální ověření
  • Možnost dodatečného ověření na serveru
  • Nejflexibilnější řešení

debug​

  • Typ: boolean
  • Povinný: Ne
  • Výchozí: false
  • Popis: Zapíná detailní logování do konzole
  • Co loguje:
    • Všechny API volání
    • Přijaté a odeslané zprávy
    • Změny stavu
    • Chybové stavy
  • Použití: Pouze pro vývoj a debugging

onSuccess​

  • Typ: function
  • Povinný: Doporučený
  • Parametry: data objekt obsahující: 
    {
      phoneNumber: "+420777123456",  // Ověřené číslo
      token: "abc-123-def",          // Unikátní token validace
      timestamp: "2024-01-15T10:30:00Z", // Čas ověření
      proof: "a1b2c3..."             // HMAC důkaz (pokud je k dispozici)
    }
  • Příklad: 
    onSuccess: function(data) {
        console.log('Ověřeno číslo:', data.phoneNumber);
        // Uložit do databáze
        savePhoneVerification(data);
        // Přesměrovat uživatele
        window.location.href = '/dashboard';
    }

onError​

  • Typ: function
  • Povinný: Doporučený
  • Parametry: error objekt obsahující: 
    {
      message: "Chybová zpráva",     // Lidsky čitelná zpráva
      code: "ERROR_CODE",            // Kód chyby
      status: 429                    // HTTP status (pokud je k dispozici)
    }
  • Možné chyby:
    • INVALID_PHONE - Neplatné telefonní číslo
    • RATE_LIMIT - Překročen limit požadavků
    • INVALID_CODE - Nesprávný ověřovací kód
    • EXPIRED - Vypršela platnost kódu
    • MAX_ATTEMPTS - Překročen počet pokusů
  • Příklad: 
    onError: function(error) {
        console.error('Chyba ověření:', error);
        if (error.code === 'RATE_LIMIT') {
            alert('Příliš mnoho pokusů. Zkuste to za chvíli.');
        } else {
            alert('Ověření selhalo: ' + error.message);
        }
    }

onClose​

  • Typ: function
  • Povinný: Ne
  • Parametry: Žádné
  • Kdy je voláno:
    • Uživatel klikne na křížek
    • Uživatel klikne mimo modal
    • Uživatel stiskne ESC
    • Po úspěšném ověření (po onSuccess)
  • Příklad: 
    onClose: function() {
        console.log('Modal byl zavřen');
        // Cleanup nebo analytika
        trackEvent('modal_closed');
    }