Gorgias utility functions

gorgias-integration.js

  /**
   * Manages interface with the Gorgias third-party chat widget.
   */
  window.mx.utils.gorgias = {
    /**
     * Gets the Gorgias chat container element.
     * @returns {HTMLElement|null} The Gorgias chat container or null if not found.
     */
    getContainer: () => {
      try {
        const container = document.querySelector('#gorgias-chat-container');
        if (!container) {
          console.warn('Gorgias container not found');
          return null;
        }

        return container;
      } catch (error) {
        console.warn('Error getting Gorgias container:', error);
        return null;
      }
    },

    /**
     * Opens the Gorgias chat widget.
     * @param {HTMLElement} [container] - The Gorgias container to use (fetched automatically if not provided).
     */
    open: (container) => {
      if (!container) {
        container = window.mx.utils.gorgias.getContainer();
        if (!container) return;
      }

      window.mx.utils.gorgias.lower(container);
      window.mx.utils.gorgias.show(container);

      window.GorgiasChat?.open();
    },

    /**
     * Closes the Gorgias chat widget.
     * @param {HTMLElement} [container] - The Gorgias container to use (fetched automatically if not provided).
     */
    close: (container) => {
      if (!container) {
        container = window.mx.utils.gorgias.getContainer();
        if (!container) return;
      }

      window.mx.utils.gorgias.lower(container);
      window.mx.utils.gorgias.show(container);

      window.GorgiasChat?.close();
    },

    /**
     * Hides the Gorgias chat widget.
     * @param {HTMLElement} [container] - The Gorgias container to use (fetched automatically if not provided).
     */
    hide: (container) => {
      if (!container) {
        container = window.mx.utils.gorgias.getContainer();
        if (!container) return;
      }

      container.setAttribute('data-hidden', '');
      window.GorgiasChat?.close();
    },

    /**
     * Shows the Gorgias chat widget.
     * @param {HTMLElement} [container] - The Gorgias container to use (fetched automatically if not provided).
     */
    show: (container) => {
      if (!container) {
        container = window.mx.utils.gorgias.getContainer();
        if (!container) return;
      }

      container.removeAttribute('data-hidden');
    },

    /**
     * Elevates the Gorgias chat widget (increases z-index).
     * @param {HTMLElement} [container] - The Gorgias container to use (fetched automatically if not provided).
     */
    elevate: (container) => {
      if (!container) {
        container = window.mx.utils.gorgias.getContainer();
        if (!container) return;
      }

      container.setAttribute('data-elevated', '');
    },

    /**
     * Lowers the Gorgias chat widget (restores normal z-index).
     * @param {HTMLElement} [container] - The Gorgias container to use (fetched automatically if not provided).
     */
    lower: (container) => {
      if (!container) {
        container = window.mx.utils.gorgias.getContainer();
        if (!container) return;
      }

      container.removeAttribute('data-elevated');
    },
  };
  
    /**
   * Initialize Gorgias integration
   * - Updates Gorgias chat visibility when drawers and modals are opened/closed
   * - Updates Gorgias chat visibility when the page is scrolled
   */
  function initGorgiasIntegration() {
    const checkAndInitialize = () => {
      if (window.mx.utils.gorgias.getContainer() || window.GorgiasChat) {
        document.addEventListener('mx-drawer:open', () => {
          window.mx.utils.gorgias.hide();
        });

        document.addEventListener('mx-drawer:close', () => {
          window.mx.utils.gorgias.show();
        });

        document.addEventListener('mx-modal:open', () => {
          window.mx.utils.gorgias.hide();
        });

        document.addEventListener('mx-modal:close', () => {
          window.mx.utils.gorgias.show();
        });

        const footer = window.mx.dom.footer;

        if (footer && footer.observers) {
          footer.observers.intersection(footer, (entries) => {
            entries.forEach((entry) => {
              if (entry.isIntersecting) {
                window.mx.utils.gorgias.hide();
              } else {
                window.mx.utils.gorgias.show();
              }
            });
          });
        } else {
          console.warn('[gorgiasIntegration] Footer not found');
        }

        return true;
      } else {
        return false;
      }
    };

    // Try immediate initialization
    if (checkAndInitialize()) return;

    // Set up retry mechanism - try for up to 10 seconds
    let attempts = 0;
    const maxAttempts = 10;
    const retryInterval = setInterval(() => {
      attempts++;

      if (checkAndInitialize() || attempts >= maxAttempts) {
        clearInterval(retryInterval);

        if (attempts >= maxAttempts) {
          console.warn('[gorgiasIntegration] Gorgias chat not found after maximum retry attempts');
        }
      }
    }, 1000);
  }