Integración del Widget (Iframe)

Para integrar el widget en tu sitio web, utiliza el siguiente código HTML. Es obligatorio proporcionar una apiKey válida para que el widget se conecte a tu flujo de datos.

Guía de Implementación Robusta

Para evitar problemas de sincronización, utiliza el evento WIDGET_READY para inicializar el widget:

window.addEventListener("message", (event) => {
  if (event.data && event.data.type === "WIDGET_READY") {
    const iframe = document.querySelector(".flash-draw-iframe");
    // 1. Enviar Token de Autenticación
    iframe.contentWindow.postMessage({
      type: "INITIALIZE_WIDGET",
      payload: { token: "TU_TOKEN_JWT" }
    }, "*");

    // 2. Opcional: Inyectar estilos personalizados
    iframe.contentWindow.postMessage({
      type: "UPDATE_THEME",
      payload: { "--primary-color": "#33FFAD" }
    }, "*");
  }
});

Código de Ejemplo

<iframe
  src="https://tu-dominio.com/widget?apiKey=${ApiKeys.DEMO_COMPANY_KEY}"
  width="100%"
  height="700px"
  frameborder="0"
  allowtransparency="true"
  style="border-radius: 20px; overflow: hidden;"
></iframe>

Rutas de Integración

La URL del iframe determina qué juego se cargará. Asegúrate de apuntar a la ruta correcta:

Juego	Ruta Base (src)
Flash Draw (Lotería)	/widget/flash-draw
Flash Roulette	/widget/flash-roulette

Parámetros de la URL

Parámetro	Tipo	Requerido	Descripción
apiKey	String	Sí	Identificador único para autenticar el widget y cargar el perfil de usuario.
type	String	No	Tipo de animación (default, widget-2, etc.). Permite cambiar el estilo de las máquinas de sorteo.