@braze/web-sdk/src/InAppMessage/ui/show-in-app-message.js

Braze SDK for web sites and other JS platforms.

import r, { OPTIONS as U } from "../../managers/braze-instance.js";
import ControlMessage from "../models/control-message.js";
import HtmlMessage from "../models/html-message.js";
import InAppMessage from "../models/in-app-message.js";
import SlideUpMessage from "../models/slide-up-message.js";
import be from "../display/get-animation-effect.js";
import Fe from "../display/in-app-message-to-html.js";
import { logInAppMessageImpression } from "../log-in-app-message-impression.js";
import {
  ORIENTATION as Ue,
  WindowUtils as no,
} from "../../util/window-utils.js";
import { isURIJavascriptOrData as tt } from "../../util/url-utils.js";
import { KeyCodes as Ce } from "../../util/key-codes.js";
import { setupInAppMessageUI as rs } from "../../ui/js/index.js";
import { logger as E } from "../../../shared-lib/index.js";
import { toRgba as ke } from "../../util/color-utils.js";
import { isIFrame as St } from "../utils/in-app-message-utils.js";
import Je from "../../l10n/l10n-manager-factory.js";
import {
  IamTiming as Et,
  IamClickAction as $e,
  IamDismissType as pr,
  IamOrientation as Ae,
  IamSlideFrom as De,
} from "../constants.js";
export function showInAppMessage(e, t, s) {
  if (!r.rr()) return;
  if ((rs(), null == e)) return !1;
  if (e instanceof ControlMessage)
    return (
      E.info(
        "User received control for a multivariate test, logging to Braze servers.",
      ),
      logInAppMessageImpression(e),
      !0
    );
  if (!(e instanceof InAppMessage)) return !1;
  if (e.constructor === InAppMessage) return !1;
  e.lh();
  const o = e instanceof HtmlMessage;
  if (o && !e.trusted && !r.ar())
    return (
      E.error(
        'HTML in-app messages are disabled. Use the "allowUserSuppliedJavascript" option for braze.initialize to enable these messages.',
      ),
      !1
    );
  if ((null == t && (t = document.body), e.zo())) {
    if (t.querySelectorAll(".ab-modal-interactions").length > 0)
      return (
        E.info(
          `Cannot show in-app message ${e.message} because another message is being shown.`,
        ),
        !1
      );
  }
  if (no.da()) {
    const t = no.ga();
    if (
      (t === Ue.PORTRAIT && e.orientation === Ae.LANDSCAPE) ||
      (t === Ue.LANDSCAPE && e.orientation === Ae.PORTRAIT)
    ) {
      const s = t === Ue.PORTRAIT ? "portrait" : "landscape",
        o = e.orientation === Ae.PORTRAIT ? "portrait" : "landscape";
      return (
        E.info(
          `Not showing ${o} in-app message ${e.message} because the screen is currently ${s}`,
        ),
        !1
      );
    }
  }
  if (!r.ar()) {
    let t = !1;
    if (e.buttons && e.buttons.length > 0) {
      const s = e.buttons;
      for (let e = 0; e < s.length; e++)
        if (s[e].clickAction === $e.URI) {
          const o = s[e].uri;
          t = tt(o);
        }
    } else e.clickAction === $e.URI && (t = tt(e.uri));
    if (t)
      return (
        E.error(
          'Javascript click actions are disabled. Use the "allowUserSuppliedJavascript" option for braze.initialize to enable these actions.',
        ),
        !1
      );
  }
  const i = document.createElement("div");
  if (
    ((i.className = "ab-iam-root v3"),
    (i.className += be(e)),
    e.language && !o && (i.lang = e.language),
    e.Bo() && (i.id = e.htmlId),
    r.er(U.ja) && (i.style.zIndex = (r.er(U.ja) + 1).toString()),
    t.appendChild(i),
    e.Mo())
  ) {
    const t = document.createElement("style");
    (t.innerHTML = e.css),
      (t.id = e.Oo()),
      null != r.er(U.sr) && t.setAttribute("nonce", r.er(U.sr)),
      document.getElementsByTagName("head")[0].appendChild(t);
  }
  const n = e instanceof SlideUpMessage,
    a = Fe(
      e,
      (t) => {
        if (e.zo() && e.od()) {
          const s = document.createElement("div");
          if (
            ((s.className = "ab-page-blocker"),
            e.Mo() || (s.style.backgroundColor = ke(e.frameColor)),
            r.er(U.ja) && (s.style.zIndex = r.er(U.ja).toString()),
            i.appendChild(s),
            !r.er(U.oh))
          ) {
            const o = new Date().valueOf();
            s.onclick = (s) => {
              new Date().valueOf() - o > Et.pE &&
                (e.tl(t), s.stopPropagation());
            };
          }
          i.appendChild(t), t.focus(), e.eh(i);
        } else if (n) {
          const s = document.querySelectorAll(".ab-slideup");
          let o = null;
          for (let e = s.length - 1; e >= 0; e--)
            if (s[e] !== t) {
              o = s[e];
              break;
            }
          if (e.slideFrom === De.TOP) {
            let e = 0;
            null != o && (e = o.offsetTop + o.offsetHeight),
              (t.style.top = Math.max(e, 0) + "px");
          } else {
            let e = 0;
            null != o &&
              (e =
                (window.innerHeight || document.documentElement.clientHeight) -
                o.offsetTop),
              (t.style.bottom = Math.max(e, 0) + "px");
          }
        } else if (o && !r.er(U.oh)) {
          const s = e;
          St(t) &&
            t.contentWindow &&
            t.contentWindow.addEventListener("keydown", function (e) {
              e.keyCode === Ce.rh && s.closeMessage();
            });
        }
        logInAppMessageImpression(e),
          e.dismissType === pr.AUTO_DISMISS &&
            setTimeout(() => {
              i.contains(t) && e.tl(t);
            }, e.duration),
          "function" == typeof s && s();
      },
      (e) => {
        E.info(e);
      },
      r.er(U.ba),
      r.er(U.ja),
      r.er(U.sr),
      t,
      Je.ra().wa(),
    );
  return (o || n) && (i.appendChild(a), e.eh(i)), !0;
}