@hortonstudio/main 1.2.2 → 1.2.4

package/index.js

@@ -1,13 +1,19 @@
-// ver 1.2.2
+// ver 1.2.3
 
 const API_NAME = 'hsmain';
 
+console.log(`🟢 ${API_NAME} v1.2.3 initializing...`);
+console.log('🔍 DOM state:', document.readyState);
+console.log('🔍 Script URL:', import.meta.url);
+
 window[API_NAME] = window[API_NAME] || {};
 window[API_NAME].loaded = false
 
 // Dynamic module loader function (like Finsweet's approach)
 const loadModule = async (moduleName) => {
+    console.log(`📦 Loading module: ${moduleName}`);
     const baseURL = new URL('./', import.meta.url).href;
+    console.log(`📂 Base URL: ${baseURL}`);
     
     switch (moduleName) {
         case "data-hs-anim-text":
@@ -25,6 +31,7 @@ const loadModule = async (moduleName) => {
         case "smooth-scroll":
             return import(new URL('./autoInit/smooth-scroll.js', import.meta.url).href);
         default:
+            console.error(`❌ Unsupported module: ${moduleName}`);
             throw new Error(`HortonStudio module "${moduleName}" is not supported.`);
     }
     
@@ -71,21 +78,32 @@ const postWebflowCallbacks = [];
 const findCurrentScriptTag = () => {
     // Use import.meta.url like Finsweet does
     const scripts = [...document.querySelectorAll(`script[data-hs-main][src="${import.meta.url}"]`)];
-    return scripts[0] || document.querySelector('script[data-hs-main]');
+    const fallbackScript = document.querySelector('script[data-hs-main]');
+    const found = scripts[0] || fallbackScript;
+    console.log(`🏷️ Script tag found:`, found);
+    console.log(`🏷️ Script attributes:`, found ? [...found.attributes].map(a => `${a.name}="${a.value}"`).join(' ') : 'none');
+    return found;
 };
 
 const processModules = async (scriptTag) => {
+    console.log(`⚙️ Processing modules with script tag:`, scriptTag);
     const modulePromises = [];
 
     // Load manual modules based on attributes
-    for (const moduleName of Object.keys({ ...animationModules, ...utilityModules })) {
+    const manualModules = Object.keys({ ...animationModules, ...utilityModules });
+    console.log(`🔍 Checking for manual modules:`, manualModules);
+    
+    for (const moduleName of manualModules) {
         if (scriptTag && scriptTag.hasAttribute(moduleName)) {
+            console.log(`✅ Found attribute for: ${moduleName}`);
             modulePromises.push(loadHsModule(moduleName));
         }
     }
 
     // Load auto-init modules
-    for (const moduleName of Object.keys(autoInitModules)) {
+    const autoModules = Object.keys(autoInitModules);
+    console.log(`🔄 Auto-loading modules:`, autoModules);
+    for (const moduleName of autoModules) {
         modulePromises.push(loadHsModule(moduleName));
     }
 
@@ -98,38 +116,56 @@ const processModules = async (scriptTag) => {
     }
 
     // Wait for ALL modules to finish loading
+    console.log(`⏳ Waiting for ${modulePromises.length} modules to load...`);
     await Promise.all(modulePromises);
+    console.log(`✅ All modules loaded successfully`);
 
     // Always refresh Webflow after all modules are loaded
     refreshWebflow();
 };
 
 const refreshWebflow = () => {
+    console.log(`🔄 Refreshing Webflow...`);
     setTimeout(() => {
         if (window.Webflow && window.Webflow.ready) {
+            console.log(`🌐 Calling Webflow.ready()`);
             window.Webflow.ready();
+        } else {
+            console.log(`⚠️ Webflow not detected`);
         }
 
         // Run all registered post-Webflow callbacks (even without Webflow)
         setTimeout(() => {
-            postWebflowCallbacks.forEach(callback => {
+            console.log(`🔄 Running ${postWebflowCallbacks.length} post-Webflow callbacks`);
+            postWebflowCallbacks.forEach((callback, index) => {
                 try {
+                    console.log(`📞 Executing callback ${index + 1}/${postWebflowCallbacks.length}`);
                     callback();
                 } catch (error) {
+                    console.error(`❌ Callback ${index + 1} failed:`, error);
                 }
             });
             window[API_NAME].loaded = true;
-        },);
-    },);
+            console.log(`🎉 ${API_NAME} fully loaded and ready!`);
+        }, 100);
+    }, 100);
 };
 
 const loadHsModule = async (moduleName) => {
+    console.log(`🔄 loadHsModule called for: ${moduleName}`);
     const apiInstance = window[API_NAME];
 
+    if (!apiInstance || !apiInstance.process) {
+        console.error(`❌ API not initialized properly:`, apiInstance);
+        throw new Error(`${API_NAME} API not initialized`);
+    }
+
     if (apiInstance.process.has(moduleName)) {
+        console.log(`⚠️ Module ${moduleName} already processing, returning existing promise`);
         return apiInstance.modules[moduleName]?.loading;
     }
 
+    console.log(`➕ Adding ${moduleName} to process set`);
     apiInstance.process.add(moduleName);
 
     const moduleObj = apiInstance.modules[moduleName] || {};
@@ -141,9 +177,14 @@ const loadHsModule = async (moduleName) => {
     });
 
     try {
+        console.log(`📦 Importing ${moduleName}...`);
         const { init, version } = await loadModule(moduleName);
+        console.log(`✅ ${moduleName} imported, version: ${version}`);
+        
+        console.log(`🔧 Initializing ${moduleName}...`);
         const initResult = await init();
         const { result, destroy } = initResult || {};
+        console.log(`✅ ${moduleName} initialized:`, result);
 
         moduleObj.version = version;
         
@@ -165,6 +206,7 @@ const loadHsModule = async (moduleName) => {
         return result;
 
     } catch (error) {
+        console.error(`❌ Failed to load ${moduleName}:`, error);
         moduleObj.reject?.(error);
         apiInstance.process.delete(moduleName);
         throw error;
@@ -172,16 +214,25 @@ const loadHsModule = async (moduleName) => {
 };
 
 const initializeAPI = () => {
+    console.log(`🚀 Initializing ${API_NAME} API...`);
+    
     // Handle early API calls (like Finsweet)
     const existingAPI = window[API_NAME];
-    if (existingAPI && !Array.isArray(existingAPI)) {
+    console.log(`🔍 Existing API:`, existingAPI);
+    
+    if (existingAPI && !Array.isArray(existingAPI) && existingAPI.process) {
+        console.log(`⚡ API already initialized, processing...`);
         processAPI();
         return;
     }
     
     const existingRequests = Array.isArray(existingAPI) ? existingAPI : [];
+    console.log(`📝 Existing queued requests:`, existingRequests);
+    
     const scripts = [...document.querySelectorAll(`script[data-hs-main][src="${import.meta.url}"]`)];
     const scriptTag = scripts[0] || document.querySelector('script[data-hs-main]');
+    console.log(`📄 Found ${scripts.length} script tags with exact src match`);
+    console.log(`🏷️ Using script tag:`, scriptTag);
     
     // Handle rich text blocks
     const richTextBlocks = document.querySelectorAll('.w-richtext');
@@ -291,7 +342,11 @@ const processAPI = () => {
     
     // Always load auto-init modules
     for (const moduleName of Object.keys(autoInitModules)) {
-        loadHsModule(moduleName);
+        try {
+            loadHsModule(moduleName);
+        } catch (error) {
+            console.error(`❌ Failed to load auto-init module ${moduleName}:`, error);
+        }
     }
     
     // Hide .transition elements if transition module is not loaded
@@ -307,7 +362,9 @@ const processAPI = () => {
 };
 
 if (document.readyState === 'loading') {
+    console.log(`⏳ DOM still loading, waiting for DOMContentLoaded...`);
     document.addEventListener('DOMContentLoaded', initializeAPI);
 } else {
+    console.log(`✅ DOM ready, initializing immediately`);
     initializeAPI();
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hortonstudio/main",
-  "version": "1.2.2",
+  "version": "1.2.4",
   "main": "index.js",
   "type": "module",
   "scripts": {