Embed

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8" />
  <title>FB / WhatsApp Signup</title>

  
  <script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js"></script>
</head>
<body>
  
  <div style="display:flex; gap:12px; align-items:center; margin:12px 0; flex-wrap:wrap;">
    <label for="companyName" style="font-family: Helvetica, Arial, sans-serif; font-size: 14px;">
      Company name
    </label>
    <input
      id="companyName"
      type="text"
      placeholder="Enter your company"
      style="height:36px; padding:0 10px; border:1px solid #ccc; border-radius:4px; font-size:14px;"
    />

    <label for="adminEmail" style="font-family: Helvetica, Arial, sans-serif; font-size: 14px;">
      Admin email
    </label>
    <input
      id="adminEmail"
      type="email"
      placeholder="admin@company.com"
      style="height:36px; padding:0 10px; border:1px solid #ccc; border-radius:4px; font-size:14px;"
    />

    <button
      id="fbLoginBtn"
      disabled
      style="background-color:#1877f2; border:0; border-radius:4px; color:#fff; cursor:not-allowed; font-family:Helvetica, Arial, sans-serif; font-size:16px; font-weight:bold; height:40px; padding:0 24px;"
    >
      Login with Facebook
    </button>
  </div>

  <script>
    let signupData = {};
    let fbIsReady = false;

    const isValidEmail = (email) =>
      /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(email);

    const sendCombinedData = () => {
      if (
        signupData.company_name &&
        signupData.client_admin_email &&
        signupData.user_code &&
        signupData.waba_id
      ) {
        console.log("All data ready, sending to Lambda:", signupData);
        callLambdaFunction({ "Received User Data": signupData });
        signupData = {};
      } else {
        console.log("Not all data available yet:", signupData);
      }
    };

    const callLambdaFunction = async (payload) => {
      try {
        const response = await fetch(
          "https://qbieaywrbvrhg62hew5e2xzvue0bcdgt.lambda-url.eu-central-1.on.aws/",
          {
            method: "POST",
            mode: "cors",
            headers: { "Content-Type": "application/json" },
            body: JSON.stringify(payload),
          }
        );
        const responseData = await response.json();
        console.log("Lambda response:", responseData);
      } catch (error) {
        console.error("Error calling Lambda function:", error);
      }
    };

    window.fbAsyncInit = function () {
      FB.init({
        appId: "1069132304565541",
        autoLogAppEvents: true,
        xfbml: true,
        version: "v22.0",
      });
      fbIsReady = true;
    };

    window.addEventListener("message", (event) => {
      if (
        event.origin !== "https://www.facebook.com" &&
        event.origin !== "https://web.facebook.com"
      ) return;

      try {
        const data = JSON.parse(event.data);
        if (data.type === "WA_EMBEDDED_SIGNUP" && data.event === "FINISH") {
          signupData.waba_id = data.data.waba_id;
          sendCombinedData();
        }
      } catch (e) {}
    });

    const fbLoginCallback = (response) => {
      if (response?.authResponse?.code) {
        signupData.user_code = response.authResponse.code;
        sendCombinedData();
      }
    };

    function launchWhatsAppSignup() {
      if (!window.FB || !fbIsReady) return;

      FB.login(fbLoginCallback, {
        config_id: "1346253060634802",
        response_type: "code",
        override_default_response_type: true,
        extras: {
          setup: {},
          sessionInfoVersion: "3",
        },
      });
    }

    function setupUI() {
      const companyInput = document.getElementById("companyName");
      const emailInput = document.getElementById("adminEmail");
      const loginBtn = document.getElementById("fbLoginBtn");

      const toggleBtn = () => {
        const company = companyInput.value.trim();
        const email = emailInput.value.trim();

        const isValid =
          company.length > 0 && isValidEmail(email);

        loginBtn.disabled = !isValid;
        loginBtn.style.cursor = isValid ? "pointer" : "not-allowed";

        signupData.company_name = isValid ? company : undefined;
        signupData.client_admin_email = isValid ? email : undefined;
      };

      companyInput.addEventListener("input", toggleBtn);
      emailInput.addEventListener("input", toggleBtn);
      toggleBtn();

      loginBtn.addEventListener("click", (e) => {
        e.preventDefault();
        if (!loginBtn.disabled) {
          launchWhatsAppSignup();
        }
      });
    }

    if (document.readyState === "loading") {
      document.addEventListener("DOMContentLoaded", setupUI);
    } else {
      setupUI();
    }
  </script>
</body>
</html>

Call to action

Twains

Twains ambitionne de révolutionner le marketing d'influence. Nous créons des jumeaux digitaux d'influenceurs pilotés par IA, capables de reproduire leur style, voix et image, pour échanger avec leur audience en 1-to-1 sur WhatsApp, mener un marketing d'influence interactif, naturel et innovant, et maximiser l'engagement. Imaginez discuter avec votre influenceur préféré en temps réel, et ce, dans la langue de votre choix. Notre technologie ouvre des horizons d'engagement inédits pour les marques et offre de nouvelles possibilités de monétisation pour les influenceurs. Par ailleurs, nous offrons également l'alternative de créer un bot de marque, une extension digitale de la marque, maîtrisant son univers, ses produits et ses valeurs.... Comme un conseiller en magasin !