web_hgtv_h5/app/static/js/pages/dialogAd.js

(function () {
  var QUEUE_VERSION = "2";
  var DISMISSED_KEY = "dialogAdDismissed";
  var PROGRESS_KEY = "dialogAdProgress";
  var mask = document.querySelector("[data-dialog-ad]");
  var previousBodyOverflow = "";
  var hasDisplayedItem = false;
  if (!mask) return;

  var items = Array.prototype.slice.call(mask.querySelectorAll("[data-dialog-ad-item]"));
  if (!items.length) return;

  var queueSignature =
    QUEUE_VERSION +
    "|" +
    items
      .map(function (item, index) {
      var image = item.querySelector(".dialog-ad-image");
      return (
        item.getAttribute("data-dialog-ad-id") ||
        (image && image.getAttribute("data-dialog-ad-src")) ||
        String(index)
      );
      })
      .join("|");

  function readSession(key) {
    try {
      return window.sessionStorage.getItem(key) || "";
    } catch (error) {
      return "";
    }
  }

  function writeSession(key, value) {
    try {
      window.sessionStorage.setItem(key, value);
    } catch (error) {
      // sessionStorage 被禁用时仍允许本页依次展示和关闭广告。
    }
  }

  function removeSession(key) {
    try {
      window.sessionStorage.removeItem(key);
    } catch (error) {
      // sessionStorage 被禁用时无需清理。
    }
  }

  function isDismissed() {
    return readSession(DISMISSED_KEY) === queueSignature;
  }

  function readProgress() {
    try {
      var progress = JSON.parse(readSession(PROGRESS_KEY));
      if (!progress || progress.signature !== queueSignature) return 0;
      var value = Number(progress.index);
      if (!Number.isFinite(value) || value < 0) return 0;
      return Math.floor(value);
    } catch (error) {
      return 0;
    }
  }

  function rememberProgress(index) {
    writeSession(
      PROGRESS_KEY,
      JSON.stringify({ signature: queueSignature, index: index }),
    );
  }

  var currentIndex = readProgress();

  function hideAllItems() {
    items.forEach(function (item) {
      item.hidden = true;
      item.setAttribute("hidden", "");
    });
  }

  function setActiveItem(index) {
    hideAllItems();
    var item = items[index];
    if (!item) return false;
    item.hidden = false;
    item.removeAttribute("hidden");
    return true;
  }

  function openMask() {
    if (isDismissed()) return;
    if (!mask.classList.contains("is-open")) {
      previousBodyOverflow = document.body.style.overflow;
      mask.hidden = false;
      mask.removeAttribute("hidden");
      mask.classList.add("is-open");
      document.body.style.overflow = "hidden";
    }
  }

  function finishQueue() {
    if (hasDisplayedItem) {
      writeSession(DISMISSED_KEY, queueSignature);
    } else {
      removeSession(DISMISSED_KEY);
    }
    removeSession(PROGRESS_KEY);
    hideAllItems();
    mask.classList.remove("is-open");
    mask.hidden = true;
    mask.setAttribute("hidden", "");
    document.body.style.overflow = previousBodyOverflow;
  }

  function showWhenAgeGateAllows() {
    if (isDismissed()) return;
    var ageGate = document.getElementById("eightPop");
    if (ageGate && ageGate.classList.contains("is-open")) {
      document.addEventListener("eightpop:closed", openMask, { once: true });
      return;
    }
    openMask();
  }

  function waitForImage(image) {
    return new Promise(function (resolve, reject) {
      if (image.complete) {
        if (image.naturalWidth > 0) resolve();
        else reject(new Error("image decode failed"));
        return;
      }

      var timeout = window.setTimeout(function () {
        cleanup();
        reject(new Error("image load timeout"));
      }, 12000);

      function cleanup() {
        window.clearTimeout(timeout);
        image.removeEventListener("load", handleLoad);
        image.removeEventListener("error", handleError);
      }

      function handleLoad() {
        cleanup();
        if (image.naturalWidth > 0) resolve();
        else reject(new Error("image decode failed"));
      }

      function handleError() {
        cleanup();
        reject(new Error("image load failed"));
      }

      image.addEventListener("load", handleLoad, { once: true });
      image.addEventListener("error", handleError, { once: true });
    });
  }

  function loadDialogImage(image) {
    var source = image.getAttribute("data-dialog-ad-src") || "";
    if (!source) return Promise.reject(new Error("image source is empty"));

    if (typeof window.processImage === "function") {
      return window.processImage(source, image).then(function (result) {
        if (!result) throw new Error("image decrypt failed");
        return waitForImage(image);
      });
    }

    image.src = source;
    return waitForImage(image);
  }

  function showItem(index) {
    if (index >= items.length) {
      finishQueue();
      return;
    }

    currentIndex = index;
    rememberProgress(currentIndex);
    var item = items[currentIndex];
    var image = item.querySelector(".dialog-ad-image");

    function displayItem() {
      if (!setActiveItem(currentIndex)) return;
      hasDisplayedItem = true;
      showWhenAgeGateAllows();
    }

    function skipBrokenItem() {
      showItem(currentIndex + 1);
    }

    if (!image) return skipBrokenItem();
    loadDialogImage(image).then(displayItem).catch(skipBrokenItem);
  }

  function showNextItem() {
    showItem(currentIndex + 1);
  }

  mask.addEventListener("click", function (event) {
    if (event.target.closest("[data-dialog-ad-close]")) {
      showNextItem();
    }
  });

  document.addEventListener("keydown", function (event) {
    if (event.key === "Escape" && mask.classList.contains("is-open")) {
      showNextItem();
    }
  });

  if (isDismissed()) return;
  if (currentIndex >= items.length) {
    finishQueue();
    return;
  }
  showItem(currentIndex);
})();