templates/email/email.html.twig line 1

Open in your IDE?
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <meta name="viewport" content="width=device-width, initial-scale=1.0">
  6.     <title>FirstID SDK Email Test</title>
  7.     <link rel="icon"
  8.           href="data:image/svg+xml,<svg xmlns=%22http://www.w3.org/2000/svg%22 viewBox=%220 0 128 128%22><text y=%221.2em%22 font-size=%2296%22>⚫️</text></svg>">
  9.     <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/css/bootstrap.min.css"
  10.           integrity="sha384-zCbKRCUGaJDkqS1kPbPd7TveP5iyJE0EjAuZQTgFLD2ylzuqKfdKlfG/eSrtxUkn" crossorigin="anonymous">
  11.     <script src="https://cdn.jsdelivr.net/npm/jquery@3.5.1/dist/jquery.slim.min.js"
  12.             integrity="sha384-DfXdz2htPH0lsSSs5nCTpuj/zy4C+OGpamoFVy38MVBnE+IbbVYUew+OrCXaRkfj"
  13.             crossorigin="anonymous"></script>
  14.     <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.1/dist/js/bootstrap.bundle.min.js"
  15.             integrity="sha384-fQybjgWLrvvRgtW6bFlB7jaZrFsaBXjsOMm/tB9LTS58ONXgqbR9W8oWht/amnpF"
  16.             crossorigin="anonymous"></script>
  17.     <script src="https://cdn.preprod.first-id.fr/sdk/loader/loader-latest-flex-no-tcf.js" defer></script>
  18. </head>
  19. <body>
  20. <nav class="navbar navbar-expand-lg navbar-light bg-light">
  21.     <a class="navbar-brand" href="{{ path('app_index') }}">{{ site_name }}</a>
  22.     <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarSupportedContent"
  23.             aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation">
  24.         <span class="navbar-toggler-icon"></span>
  25.     </button>
  26. </nav>
  28. <div class="container mt-4">
  29.     <div class="row">
  30.         <div class="col-md-12">
  31.             <h1>FirstID SDK Email Test</h1>
  32.             <p>Current FirstID: <span id="firstid" class="font-weight-bold">Not set</span></p>
  33.             <p>Current Email: <span id="email" class="font-weight-bold">Not set</span></p>
  34.             <p>Email Hash: <span id="emailHash" class="font-weight-bold">Not set</span></p>
  35.             <div class="form-group">
  36.                 <input type="email" id="emailInput" class="form-control" placeholder="Enter your email">
  37.             </div>
  38.             <button onclick="setEmail()" class="btn btn-primary">Set Email</button>
  39.         </div>
  40.     </div>
  41. </div>
  43. <script>
  44.     function getCookieValueFromCookieName(cookieName) {
  45.         let cookieArr = document.cookie.split(";");
  46.         for (let i = 0; i < cookieArr.length; i++) {
  47.             let cookiePair = cookieArr[i].split("=");
  48.             if (cookieName === cookiePair[0].trim()) {
  49.                 return decodeURIComponent(cookiePair[1]);
  50.             }
  51.         }
  52.         return null;
  53.     }
  55.     function updateFid() {
  56.         let fid = getCookieValueFromCookieName('firstid');
  57.         document.getElementById('firstid').textContent = fid || 'Not set';
  58.         let emailHash = getCookieValueFromCookieName('fid_email_hash');
  59.         document.getElementById('emailHash').textContent = emailHash || 'Not set';
  60.     }
  62.     async function setEmail() {
  63.         const email = document.getElementById('emailInput').value;
  65.         const hashEmailInSHA256 = val =>
  66.             crypto.subtle
  67.                 .digest('SHA-256', new TextEncoder('utf-8').encode(val))
  68.                 .then(h => {
  69.                     let hexes = [],
  70.                         view = new DataView(h);
  71.                     for (let i = 0; i < view.byteLength; i += 4)
  72.                         hexes.push(('00000000' + view.getUint32(i).toString(16)).slice(-8));
  73.                     return hexes.join('');
  74.                 });
  76.         if (email && window.FIRSTID) {
  77.             window.FIRSTID.setEmailHashed(await hashEmailInSHA256(email));
  78.             document.getElementById('email').textContent = email;
  79.             console.log('Email set:', email);
  80.         } else {
  81.             console.error('Email not set. Make sure the SDK is loaded and the email is valid.');
  82.         }
  83.     }
  85.     setInterval(updateFid, 1000);
  86. </script>
  87. </body>
  88. </html>