@hortonstudio/main 1.9.11 → 1.9.20

package/autoInit/transition/transition.js

@@ -1,116 +0,0 @@
-// Page Transition Module
-const API_NAME = "hsmain";
-
-export async function init() {
-  // Store event handlers for cleanup
-  let clickHandler = null;
-  let resizeHandler = null;
-  let pageShowHandler = null;
-
-  const cleanup = () => {
-    // Remove all event listeners
-    if (clickHandler) {
-      document.removeEventListener("click", clickHandler);
-      clickHandler = null;
-    }
-    if (resizeHandler) {
-      window.removeEventListener("resize", resizeHandler);
-      resizeHandler = null;
-    }
-    if (pageShowHandler) {
-      window.onpageshow = null;
-      pageShowHandler = null;
-    }
-  };
-
-  const initTransitions = () => {
-    const transitionTrigger = document.querySelector('[data-hs-transition="trigger"]');
-    const transitionElement = document.querySelector('[data-hs-transition="element"]');
-
-    if (!transitionTrigger || !transitionElement) return;
-
-    // Get exit time from data attribute (in seconds)
-    const exitTimeAttr = transitionElement.getAttribute('data-hs-exit-time');
-    const exitTime = exitTimeAttr ? parseFloat(exitTimeAttr) * 1000 : 0;
-
-    // Get delay time for first load from data attribute (in seconds)
-    const delayAttr = transitionElement.getAttribute('data-hs-delay');
-    const delayTime = delayAttr ? parseFloat(delayAttr) * 1000 : 0;
-
-    // Page Load - Trigger entrance animation
-    // Check if this is the first page load of the session
-    const isFirstLoad = !sessionStorage.getItem('transition-loaded');
-
-    const triggerAnimation = () => {
-      Webflow.push(function () {
-        transitionTrigger.click();
-      });
-    };
-
-    // If first load and delay is set, wait before triggering
-    if (isFirstLoad && delayTime > 0) {
-      setTimeout(triggerAnimation, delayTime);
-      sessionStorage.setItem('transition-loaded', 'true');
-    } else {
-      // Subsequent loads or no delay: trigger immediately
-      triggerAnimation();
-      if (isFirstLoad) {
-        sessionStorage.setItem('transition-loaded', 'true');
-      }
-    }
-
-    // On Link Click
-    clickHandler = function (e) {
-      const link = e.target.closest("a");
-
-      if (
-        link &&
-        link.hostname === window.location.hostname &&
-        link.getAttribute("href") &&
-        link.getAttribute("href").indexOf("#") === -1 &&
-        link.getAttribute("target") !== "_blank"
-      ) {
-        e.preventDefault();
-
-        let transitionURL = link.getAttribute("href");
-
-        // Trigger exit animation
-        transitionTrigger.click();
-
-        // Wait for exit time, then navigate
-        setTimeout(() => {
-          window.location = transitionURL;
-        }, exitTime);
-      }
-    };
-    document.addEventListener("click", clickHandler);
-
-    // On Back Button Tap
-    pageShowHandler = function (event) {
-      if (event.persisted) {
-        window.location.reload();
-      }
-    };
-    window.onpageshow = pageShowHandler;
-
-    // Hide Transition on Window Width Resize
-    resizeHandler = function () {
-      if (transitionElement) {
-        transitionElement.style.display = "none";
-      }
-    };
-    window.addEventListener("resize", resizeHandler);
-  };
-
-  // Wait for Webflow to be ready before initializing transitions
-  window[API_NAME].afterWebflowReady(() => {
-    setTimeout(() => {
-      initTransitions();
-    }, 50);
-  });
-
-  return {
-    result: "anim-transition initialized",
-    destroy: cleanup
-  };
-}

package/index.js

@@ -1,305 +0,0 @@
-const API_NAME = "hsmain";
-
-const initializeHsMain = async () => {
-  if (
-    window[API_NAME] &&
-    !Array.isArray(window[API_NAME]) &&
-    window[API_NAME].loaded
-  ) {
-    return;
-  }
-
-  // Add hs-main class to HTML element immediately
-  document.documentElement.classList.add('hs-main');
-
-  const queuedModules = Array.isArray(window[API_NAME]) ? window[API_NAME] : [];
-
-  const animationModules = {};
-
-  const utilityModules = {
-    "data-hs-util-ba": true,
-  };
-
-  const allDataAttributes = { ...animationModules, ...utilityModules };
-
-  const moduleMap = {
-    transition: () => import("./autoInit/transition/transition.js"),
-    "data-hs-util-ba": () => import("./utils/before-after/before-after.js"),
-    "smooth-scroll": () => import("./autoInit/smooth-scroll/smooth-scroll.js"),
-    navbar: () => import("./autoInit/navbar/navbar.js"),
-    accessibility: () => import("./autoInit/accessibility/accessibility.js"),
-    counter: () => import("./autoInit/counter/counter.js"),
-    form: () => import("./autoInit/form/form.js"),
-    "site-settings": () => import("./autoInit/site-settings/site-settings.js"),
-    button: () => import("./autoInit/button/button.js"),
-  };
-
-  let scripts = [
-    ...document.querySelectorAll(
-      `script[type="module"][src="${import.meta.url}"]`,
-    ),
-  ];
-
-  if (scripts.length === 0) {
-    scripts = [
-      ...document.querySelectorAll(
-        'script[type="module"][src*="@hortonstudio/main"]',
-      ),
-    ].filter((script) => {
-      const scriptSrc = script.src;
-      const currentSrc = import.meta.url;
-      const scriptPackage = scriptSrc.match(
-        /@hortonstudio\/main(@[\d.]+)?/,
-      )?.[0];
-      const currentPackage = currentSrc.match(
-        /@hortonstudio\/main(@[\d.]+)?/,
-      )?.[0];
-      return (
-        scriptPackage &&
-        currentPackage &&
-        scriptPackage.split("@")[0] === currentPackage.split("@")[0]
-      );
-    });
-  }
-
-  // Check if no-transition attribute is present on script tag
-  const hasNoTransition = scripts[0]?.hasAttribute('no-transition');
-
-  const autoInitModules = {
-    "smooth-scroll": true,
-    navbar: true,
-    accessibility: true,
-    counter: true,
-    form: true,
-    "site-settings": true,
-    button: true,
-    // Only include transition if no-transition attribute is NOT present
-    ...(hasNoTransition ? {} : { transition: true }),
-  };
-
-  const loadModule = async (moduleName) => {
-    const instance = window[API_NAME];
-    if (instance.process.has(moduleName)) {
-      return instance.modules[moduleName]?.loading;
-    }
-
-    instance.process.add(moduleName);
-
-    const moduleData = instance.modules[moduleName] || {};
-    instance.modules[moduleName] = moduleData;
-
-    moduleData.loading = new Promise((resolve, reject) => {
-      moduleData.resolve = resolve;
-      moduleData.reject = reject;
-    });
-
-    try {
-      const { init, version } = await moduleMap[moduleName]();
-      const result = await init();
-      const { result: initResult, destroy } = result || {};
-
-      moduleData.version = version;
-      moduleData.destroy = () => {
-        destroy?.();
-        instance.process.delete(moduleName);
-      };
-      moduleData.restart = () => {
-        moduleData.destroy?.();
-        instance.load(moduleName);
-      };
-
-      moduleData.resolve?.(initResult);
-      delete moduleData.resolve;
-      delete moduleData.reject;
-
-      return initResult;
-    } catch (error) {
-      moduleData.reject?.(error);
-      instance.process.delete(moduleName);
-      throw error;
-    }
-  };
-
-  const readyCallbacks = [];
-
-  window[API_NAME] = {
-    scripts,
-    modules: {},
-    process: new Set(),
-    load: loadModule,
-    loaded: false,
-    barbaEnabled: false,
-    embedScriptManager: null,
-    barbaManager: null,
-    push(...items) {
-      for (const [moduleName, callback] of items) {
-        if (typeof callback === "function") {
-          this.modules[moduleName]?.loading?.then(callback);
-        } else {
-          this.load(moduleName);
-        }
-      }
-    },
-    destroy() {
-      for (const moduleName in this.modules) {
-        this.modules[moduleName]?.destroy?.();
-      }
-    },
-    async reinitialize() {
-      // Complete teardown and reinit
-      this.loaded = false;
-      this.destroy();
-      this.modules = {};
-      this.process = new Set();
-
-      // Re-scan for modules including in w-embeds
-      await this.scanForEmbedModules();
-      processModules();
-
-      // Wait for IX3 to be ready before marking as loaded
-      await waitForIx3();
-      this.loaded = true;
-    },
-    async scanForEmbedModules() {
-      const embeds = document.querySelectorAll(".w-embed");
-      embeds.forEach((embed) => {
-        const scripts = embed.querySelectorAll("script[data-hs-module]");
-        scripts.forEach((script) => {
-          // Extract module info from data attributes
-          const moduleType = script.getAttribute("data-hs-module-type");
-          const moduleName = script.getAttribute("data-hs-module");
-
-          if (moduleType && moduleName) {
-            const moduleKey = `data-hs-${moduleType}-${moduleName}`;
-            if (moduleMap[moduleKey]) {
-              this.load(moduleKey);
-            }
-          }
-        });
-      });
-    },
-    async setBarbaMode(enabled) {
-      this.barbaEnabled = enabled;
-      if (enabled && !this.barbaManager) {
-        try {
-          const module = await import("./barba/barbaManager.js");
-          this.barbaManager = module.initializeBarba();
-          if (!this.barbaManager) {
-          }
-        } catch (error) {
-          this.barbaEnabled = false;
-        }
-      }
-    },
-    enableBarba() {
-      return this.setBarbaMode(true);
-    },
-    async initEmbedScriptManager() {
-      if (!this.embedScriptManager) {
-        const { EmbedScriptManager } = await import(
-          "./barba/embedScriptManager.js"
-        );
-        this.embedScriptManager = new EmbedScriptManager();
-      }
-      return this.embedScriptManager;
-    },
-    afterReady(callback) {
-      if (typeof callback === "function") {
-        if (this.loaded) {
-          callback();
-        } else {
-          readyCallbacks.push(callback);
-        }
-      }
-    },
-    afterWebflowReady(callback) {
-      if (typeof callback === "function") {
-        if (this.loaded) {
-          callback();
-        } else {
-          readyCallbacks.push(callback);
-        }
-      }
-    },
-    status(moduleName) {
-      if (moduleName) {
-        return {
-          loaded: !!this.modules[moduleName],
-          loading: this.process.has(moduleName),
-        };
-      }
-      return {
-        loaded: Object.keys(this.modules),
-        loading: [...this.process],
-        animations: Object.keys(animationModules),
-        utilities: Object.keys(utilityModules),
-        autoInit: Object.keys(autoInitModules),
-        barbaEnabled: this.barbaEnabled,
-      };
-    },
-  };
-
-  const processModules = () => {
-    for (const script of scripts) {
-      for (const attrName of Object.keys(allDataAttributes)) {
-        if (script.hasAttribute(attrName)) {
-          loadModule(attrName);
-        }
-      }
-    }
-
-    for (const moduleName of Object.keys(autoInitModules)) {
-      loadModule(moduleName);
-    }
-
-    // Transition is now auto-loaded, so no need to hide transition elements
-  };
-
-  document.querySelectorAll(".w-richtext").forEach((richtext) => {
-    richtext.querySelectorAll("img").forEach((img) => {
-      img.loading = "eager";
-    });
-  });
-
-  const waitForIx3 = async () => {
-    const startTime = Date.now();
-    const timeout = 2000; // 2 second timeout
-
-    return new Promise((resolve) => {
-      const checkIx3 = () => {
-        const htmlElement = document.documentElement;
-        const hasIx3 = htmlElement.classList.contains('w-mod-ix3');
-
-        if (hasIx3) {
-          resolve(true);
-        } else if (Date.now() - startTime >= timeout) {
-          console.warn('[hsmain] IX3 (w-mod-ix3) not detected after 2s timeout. Proceeding anyway, but Webflow interactions may not be fully loaded.');
-          resolve(false);
-        } else {
-          setTimeout(checkIx3, 50);
-        }
-      };
-      checkIx3();
-    });
-  };
-
-  const finalize = async () => {
-    processModules();
-
-    // Wait for IX3 to be ready before firing callbacks
-    await waitForIx3();
-
-    window[API_NAME].loaded = true;
-    readyCallbacks.forEach((callback) => {
-      try {
-        callback();
-      } catch (error) {}
-    });
-    readyCallbacks.length = 0; // Clear array after execution
-  };
-
-  window[API_NAME].push(...queuedModules);
-  finalize().catch(() => {});
-};
-
-initializeHsMain();