Time Delay Plugin

const experiences = createInstance({
  timeDelay: {
    delay: 5000,             // Show delay in ms (default: 0)
    hideAfter: 0,            // Auto-hide after ms (default: 0 = disabled)
    pauseWhenHidden: true    // Pause timers when tab hidden (default: true)
  }
});

Init → [delay ms] → Show Trigger → [hideAfter ms] → Hide Trigger
         ↓ (tab hidden)
       Pause → Resume (tab visible) →

// Show after 5 seconds
experiences.register('delayed-welcome', {
  type: 'banner',
  content: {
    title: 'Still reading?',
    message: 'Subscribe to our newsletter for weekly updates.',
    buttons: [{ text: 'Subscribe', url: '/subscribe' }]
  },
  targeting: {
    custom: (context) => {
      return context.triggers?.timeDelay?.triggered === true;
    }
  }
});
 
// Show after delay, hide after 10 seconds
experiences.register('flash-message', {
  type: 'banner',
  content: {
    message: 'Limited time: Free shipping on orders over $50!'
  },
  targeting: {
    custom: (context) => {
      const delay = context.triggers?.timeDelay;
      // Show if triggered and not yet hidden
      return delay?.triggered && delay?.type === 'show';
    }
  }
});

if (experiences.timeDelay.isTriggered()) {
  console.log('Delay elapsed');
}

const total = experiences.timeDelay.getElapsed();
console.log(`${total}ms since page load`);

const active = experiences.timeDelay.getActiveElapsed();
console.log(`${active}ms of active time`);

const remaining = experiences.timeDelay.getRemaining();
console.log(`${remaining}ms until trigger`);

if (experiences.timeDelay.isPaused()) {
  console.log('Timers paused (tab hidden)');
}

experiences.timeDelay.reset();

experiences.on('trigger:timeDelay', (event) => {
  console.log('Time delay triggered!');
  console.log('Type:', event.type); // 'show' or 'hide'
  console.log('Elapsed:', event.elapsed, 'ms');
  console.log('Active elapsed:', event.activeElapsed, 'ms');
  console.log('Was paused:', event.wasPaused);
});

{
  triggered: boolean;
  timestamp: number;
  elapsed: number;
  activeElapsed: number;
  remaining: number;
  wasPaused: boolean;
  type: 'show' | 'hide';
}

- // Pathfora
- var widget = new pathfora.Message({
-   msg: 'Still here?',
-   displayConditions: {
-     showDelay: 5
-   }
- });
 
+ // Experience SDK
+ experiences.register('delayed-message', {
+   type: 'banner',
+   content: {
+     message: 'Still here?'
+   },
+   targeting: {
+     custom: (ctx) => ctx.triggers?.timeDelay?.triggered
+   }
+ });
+ 
+ // Configure globally
+ experiences.config({
+   timeDelay: { delay: 5000 }
+ });