@pie-framework/pie-fixed-player-static 1.0.0-24d9476.1 → 1.0.0-351df72.1

package/README.md

@@ -1,6 +1,6 @@
 # @pie-framework/pie-fixed-player-static
 
-Version: 1.0.0-24d9476.1
+Version: 1.0.0-351df72.1
 
 Pre-bundled PIE fixed player with static element versions for production use.
 
@@ -9,12 +9,15 @@ in Pieoneer, use `pie-inline-player` instead.
 
 ## Included Elements
 
+- @pie-element/drag-in-the-blank@8.1.0
+- @pie-element/hotspot@9.1.0
+- @pie-element/image-cloze-association@8.1.0
 - @pie-element/multiple-choice@11.1.0
 
 ## Installation
 
 ```bash
-npm install @pie-framework/pie-fixed-player-static@1.0.0-24d9476.1
+npm install @pie-framework/pie-fixed-player-static@1.0.0-351df72.1
 ```
 
 ## Usage
@@ -41,8 +44,51 @@ npm install @pie-framework/pie-fixed-player-static@1.0.0-24d9476.1
 - `session` - Session data array
 - `add-correct-response` - Show correct answers
 - `external-style-urls` - Additional CSS URLs
+- `loader-config` - Loader configuration (JSON string, see below)
 - Custom styling attributes
 
+## Loader Configuration
+
+Control resource loading behavior and New Relic tracking via the `loader-config` attribute:
+
+```html
+<pie-fixed-player 
+  item-id="your-item-id"
+  loader-config='{"trackPageActions": true, "maxResourceRetries": 3}'>
+</pie-fixed-player>
+```
+
+**Options:**
+- `trackPageActions` (boolean, default: false) - Enable New Relic instrumentation for module imports and resource loading
+- `maxResourceRetries` (number, default: 3) - Maximum retry attempts for failed resources
+- `resourceRetryDelay` (number, default: 500) - Initial delay in ms before retrying
+
+**Global Configuration:**
+
+Alternatively, set configuration globally before importing the package:
+
+```html
+<script>
+  window.PIE_LOADER_CONFIG = {
+    trackPageActions: true,
+    maxResourceRetries: 3,
+    resourceRetryDelay: 500
+  };
+</script>
+<script type="module">
+  import '@pie-framework/pie-fixed-player-static';
+</script>
+```
+
+## Resilient Loading
+
+This package includes automatic retry logic for module imports and resource loading:
+
+- **Module imports** (math-rendering, bundle, player): 4 attempts with exponential backoff (200ms, 400ms, 800ms)
+- **Runtime resources** (images, audio, video): Configurable retry attempts with exponential backoff
+- Console logging: warnings for retries, errors only for permanent failures
+- New Relic tracking (when enabled): tracks import timing, retries, and failures
+
 ## Events
 
 - `load-complete` - Fired when item loads successfully

package/dist/index.d.ts

@@ -1,5 +1,4 @@
 declare module '@pie-framework/pie-fixed-player-static' {
-  // Add type definitions if needed
   export {};
 }
 
@@ -8,4 +7,30 @@ declare global {
   interface HTMLElementTagNameMap {
     'pie-fixed-player': HTMLElement;
   }
+
+  interface Window {
+    /**
+     * Global debug flag for PIE components
+     * Set to true to enable debug logging
+     */
+    PIE_DEBUG?: boolean;
+
+    /**
+     * Global loader configuration for PIE components
+     * Alternative to setting loader-config attribute on individual elements
+     */
+    PIE_LOADER_CONFIG?: {
+      trackPageActions?: boolean;
+      maxResourceRetries?: number;
+      resourceRetryDelay?: number;
+    };
+
+    /**
+     * New Relic Browser Agent
+     */
+    newrelic?: {
+      addPageAction(name: string, attributes?: Record<string, any>): void;
+      noticeError(error: Error, attributes?: Record<string, any>): void;
+    };
+  }
 }

package/dist/index.js

@@ -5,33 +5,256 @@
 // Use async IIFE to ensure sequential loading without top-level await
 // (Top-level await has bundler compatibility issues with some build tools)
 (async function initializePieFixedPlayer() {
+
+  // Cache tracking enabled state to avoid repeated DOM queries and JSON parsing
+  let trackingEnabled = null;
+  
+  const isTrackingEnabled = () => {
+    // Return cached value if already determined
+    if (trackingEnabled !== null) {
+      return trackingEnabled;
+    }
+    
+    try {
+      // Check multiple sources for tracking configuration
+      // 1. Check if pie-fixed-player element exists with loader-config attribute
+      const playerElement = typeof document !== 'undefined' ? document.querySelector('pie-fixed-player') : null;
+      if (playerElement) {
+        const loaderConfigAttr = playerElement.getAttribute('loader-config');
+        if (loaderConfigAttr) {
+          try {
+            const loaderConfig = JSON.parse(loaderConfigAttr);
+            if (loaderConfig?.trackPageActions === true) {
+              trackingEnabled = true;
+              return true;
+            }
+          } catch {
+            // Invalid JSON, continue to other checks
+          }
+        }
+      }
+      
+      // 2. Check for global PIE_LOADER_CONFIG
+      if (typeof window !== 'undefined' && window.PIE_LOADER_CONFIG?.trackPageActions === true) {
+        trackingEnabled = true;
+        return true;
+      }
+    } catch {
+      // DOM operations failed, disable tracking
+    }
+    
+    // No tracking enabled or error occurred
+    trackingEnabled = false;
+    return false;
+  };
+
+  // Helper to track with New Relic if enabled
+  const trackNewRelicAction = (actionName, attributes) => {
+    if (!isTrackingEnabled() || typeof window === 'undefined' || !window.newrelic) {
+      return;
+    }
+    
+    try {
+      window.newrelic.addPageAction(actionName, {
+        ...attributes,
+        component: 'pie-fixed-player-static',
+        timestamp: new Date().toISOString()
+      });
+    } catch (err) {
+      // Silently fail if New Relic throws - don't break the app
+      if (typeof window !== 'undefined' && window.PIE_DEBUG) {
+        console.debug('[pie-fixed-player-static] New Relic tracking failed:', err);
+      }
+    }
+  };
+
+  const trackNewRelicError = (error, attributes) => {
+    if (!isTrackingEnabled() || typeof window === 'undefined' || !window.newrelic) {
+      return;
+    }
+    
+    try {
+      window.newrelic.noticeError(error, {
+        ...attributes,
+        component: 'pie-fixed-player-static'
+      });
+    } catch (err) {
+      // Silently fail if New Relic throws - don't break the app
+      if (typeof window !== 'undefined' && window.PIE_DEBUG) {
+        console.debug('[pie-fixed-player-static] New Relic error tracking failed:', err);
+      }
+    }
+  };
+
+  const importWithRetry = async (specifier, attempts = 3, baseDelayMs = 200) => {
+    const startTime = Date.now();
+    let lastError;
+    
+    // Track import start (never throws due to internal try/catch)
+    trackNewRelicAction('pie-import-started', {
+      specifier,
+      maxAttempts: attempts
+    });
+    
+    for (let attempt = 1; attempt <= attempts; attempt++) {
+      try {
+        // Safe debug logging
+        try {
+          if (typeof window !== 'undefined' && window.PIE_DEBUG) {
+            console.debug(`[pie-fixed-player-static] importWithRetry: attempt ${attempt} -> ${specifier}`);
+          }
+        } catch {
+          // Logging failed, continue anyway
+        }
+        
+        const result = await import(specifier);
+        
+        // Track successful import (never throws due to internal try/catch)
+        const duration = Date.now() - startTime;
+        trackNewRelicAction('pie-import-success', {
+          specifier,
+          attempt,
+          duration,
+          wasRetried: attempt > 1
+        });
+        
+        return result;
+      } catch (err) {
+        lastError = err;
+        const isLastAttempt = attempt === attempts;
+        
+        if (isLastAttempt) {
+          // Final attempt failed - safe error logging
+          try {
+            console.error(`[pie-fixed-player-static] Failed to load ${specifier} after ${attempts} attempts:`, err);
+          } catch {
+            // Even error logging failed, but continue
+          }
+          
+          // Track final failure (never throws due to internal try/catch)
+          try {
+            const duration = Date.now() - startTime;
+            const errorMessage = err && err.message ? err.message : String(err || 'Unknown error');
+            trackNewRelicError(new Error(`Import failed: ${specifier}`), {
+              specifier,
+              attempts,
+              duration,
+              errorMessage
+            });
+          } catch {
+            // Tracking failed, continue anyway
+          }
+        } else {
+          // Intermediate failure - safe warning logging
+          try {
+            console.warn(`[pie-fixed-player-static] Import failed (attempt ${attempt}/${attempts}) for ${specifier}, will retry:`, err);
+          } catch {
+            // Logging failed, continue anyway
+          }
+          
+          // Track retry attempt (never throws due to internal try/catch)
+          try {
+            const errorMessage = err && err.message ? err.message : String(err || 'Unknown error');
+            trackNewRelicAction('pie-import-retry', {
+              specifier,
+              attempt,
+              remainingAttempts: attempts - attempt,
+              errorMessage
+            });
+          } catch {
+            // Tracking failed, continue anyway
+          }
+          
+          const delay = baseDelayMs * Math.pow(2, attempt - 1);
+          
+          // Safe debug logging for retry
+          try {
+            if (typeof window !== 'undefined' && window.PIE_DEBUG) {
+              console.debug(`[pie-fixed-player-static] retrying ${specifier} in ${delay}ms`);
+            }
+          } catch {
+            // Logging failed, continue anyway
+          }
+          
+          await new Promise((res) => setTimeout(res, delay));
+        }
+      }
+    }
+    throw lastError;
+  };
+  try {
+    
+  // Initialize global debug flag from URL params (checked BEFORE any imports)
+  // Can also be set via: <script>window.PIE_DEBUG = true;</script> before importing this module
+  if (typeof window !== 'undefined' && typeof window.PIE_DEBUG === 'undefined') {
+    try {
+      const params = new URLSearchParams(window.location?.search || '');
+      const urlFlag = params.get('pie_debug') || params.get('PIE_DEBUG') || params.get('debug');
+      if (urlFlag != null) {
+        window.PIE_DEBUG = urlFlag === '' || String(urlFlag).toLowerCase() === 'true' || urlFlag === '1';
+      }
+    } catch {}
+  }
+  
+  // Log debug state if enabled
   try {
-    // 1. Dynamically import math-rendering module (bundled with package)
-    const mathRenderingModule = await import('./math-rendering.js');
+    if (typeof window !== 'undefined' && window.PIE_DEBUG) {
+      console.debug('[pie-fixed-player-static] Debug logging enabled');
+    }
+  } catch {}
+
 
-    // 2. Set globals BEFORE any PIE elements execute
+    // 2. Dynamically import math-rendering module (bundled with package)
+    const mathRenderingModule = await importWithRetry('./math-rendering.js', 4, 200);
+
+    // Set globals BEFORE any PIE elements execute
     if (typeof window !== 'undefined') {
       // Set BOTH globals:
       // - @pie-lib/math-rendering: Standard key used by pie-player
       // - _dll_pie_lib__math_rendering: SystemJS/DLL key used by IIFE bundles
       window['@pie-lib/math-rendering'] = mathRenderingModule._dll_pie_lib__math_rendering;
       window['_dll_pie_lib__math_rendering'] = mathRenderingModule._dll_pie_lib__math_rendering;
-      console.log('[pie-fixed-player-static] Math rendering initialized (both globals set)');
+      
+      // Debug logging (only if window.PIE_DEBUG is true)
+      try {
+        if (window.PIE_DEBUG) {
+          console.debug('[pie-fixed-player-static] Math rendering initialized (both globals set)');
+        }
+      } catch {}
     }
 
     // 3. NOW load PIE element bundles (IIFE) - these execute immediately
     // The IIFE must find math-rendering globals already set (which they now are)
-    await import('./pie-elements-bundle-24d9476.js');
+    await importWithRetry('./pie-elements-bundle-351df72.js', 4, 200);
 
     // 4. Load pie-fixed-player custom element
-    await import('./pie-fixed-player.js');
-
-    // 5. Confirm ready
-    if (typeof window !== 'undefined') {
-      console.log('[pie-fixed-player-static] Package loaded. PIE elements available via window.pie');
+    await importWithRetry('./pie-fixed-player.js', 4, 200);
+    
+    // 5. Mark load completion (performance tracking - never throws)
+    try {
+      if (typeof window !== 'undefined' && typeof window.performance !== 'undefined') {
+        window.performance.mark('PIE-Fixed-Player-Load-Complete');
+      }
+    } catch {
+      // Performance marking failed, continue anyway
+    }
+    
+    // Confirm ready (debug logging - never throws)
+    try {
+      if (typeof window !== 'undefined' && window.PIE_DEBUG) {
+        console.debug('[pie-fixed-player-static] Package loaded. PIE elements available via window.pie');
+      }
+    } catch {
+      // Logging failed, continue anyway
     }
   } catch (error) {
-    console.error('[pie-fixed-player-static] Failed to initialize:', error);
+    // Note: Individual import failures are already logged as errors above
+    // This catch provides a final safety net for unexpected errors
+    try {
+      console.error('[pie-fixed-player-static] Initialization failed - pie-fixed-player is not available. See errors above for details.');
+    } catch {
+      // Even final error logging failed - nothing more we can do
+    }
   }
 })();