Building Relationships For Life

/* base fade for all slides */
/*#brxe-rshjwl .splide__slide {
  opacity: 0.5;
  transition: opacity 0.35s ease, transform 0.35s ease;
  will-change: opacity, transform;
}

/* focused slide */
/*#brxe-rshjwl .splide__slide.in-focus {
  opacity: 1 !important;
}
/*

/* (function () {
  const ROOT_SELECTOR = '#brxe-rshjwl .splide';
  const RETRY_MS = 250;
  const MAX_RETRIES = 40; // ~10s total

  function log(...args) { console.debug('[splide-focus]', ...args); }

  function findExistingInstance(el) {
    // try a few common places where an instance may be stored
    if (!el) return null;
    return el.splideInstance || el._splide || el.splide || null;
  }

  function updateFocusUsingSplide(splide) {
    if (!splide) return;
    const slides = Array.from(splide.Components.Elements.slides || []);
    if (!slides.length) return;

    slides.forEach(s => s.classList.remove('in-focus'));
    const visible = slides.filter(s => s.classList.contains('is-visible'));

    if (visible.length) {
      // choose middle visible slide for "focus" (feel free to pick index 0 for left-most)
      const center = Math.floor(visible.length / 2);
      visible[center].classList.add('in-focus');
    } else {
      // fallback: use is-active (single active) or splide.index
      const active = slides.find(s => s.classList.contains('is-active')) || slides[splide.index] || slides[0];
      if (active) active.classList.add('in-focus');
    }
  }

  function updateFocusFromDOM(root) {
    // fallback if we don't have Splide instance
    const slides = Array.from(root.querySelectorAll('.splide__slide'));
    if (!slides.length) return;
    slides.forEach(s => s.classList.remove('in-focus'));
    const visible = slides.filter(s => s.classList.contains('is-visible'));
    if (visible.length) {
      const center = Math.floor(visible.length / 2);
      visible[center].classList.add('in-focus');
    } else {
      // first slide fallback
      slides[0].classList.add('in-focus');
    }
  }

  function attachObservers(root, splideInstance) {
    // If we have a Splide instance, hook its events
    if (splideInstance && typeof splideInstance.on === 'function') {
      const safeUpdate = () => requestAnimationFrame(() => updateFocusUsingSplide(splideInstance));
      splideInstance.on('mounted', safeUpdate);
      splideInstance.on('moved', safeUpdate);   // 'moved' is fired after transition
      splideInstance.on('updated', safeUpdate);
      // initial run
      requestAnimationFrame(() => updateFocusUsingSplide(splideInstance));
      log('Attached to Splide instance events.');
      return;
    }

    // Otherwise, observe DOM changes (class/child mutations) and update from DOM
    const slidesContainer = root.querySelector('.splide__list') || root;
    if (!slidesContainer) return;

    const mo = new MutationObserver(() => {
      requestAnimationFrame(() => updateFocusFromDOM(root));
    });

    mo.observe(slidesContainer, { attributes: true, attributeFilter: ['class'], childList: true, subtree: true });
    // run once immediately
    requestAnimationFrame(() => updateFocusFromDOM(root));
    log('Attached MutationObserver fallback.');
  }

  function initOnce(retries = 0) {
    const root = document.querySelector(ROOT_SELECTOR);
    if (!root) {
      if (retries < MAX_RETRIES) {
        setTimeout(() => initOnce(retries + 1), RETRY_MS);
        return;
      } else {
        console.warn('[splide-focus] splide root not found:', ROOT_SELECTOR);
        return;
      }
    }

    // If Splide library not loaded yet, wait a bit
    if (typeof window.Splide !== 'function') {
      if (retries < MAX_RETRIES) {
        log('Waiting for Splide library...');
        setTimeout(() => initOnce(retries + 1), RETRY_MS);
        return;
      } else {
        console.warn('[splide-focus] Splide library not found, will use DOM fallback.');
        attachObservers(root, null);
        return;
      }
    }

    // Try to find an existing instance
    let splideInstance = findExistingInstance(root);
    if (!splideInstance) {
      // If no existing instance, create one and store it on root to prevent double-init
      try {
        splideInstance = new Splide(root, {
          perPage: 2,
          perMove: 1,
          gap: '1rem',
          type: 'loop',
          autoplay: true,
          interval: 5000,
          speed: 2000,
          pauseOnHover: true
        });
        splideInstance.mount();
        // store so other scripts can find it
        try { root.splideInstance = splideInstance; } catch (e) { /* ignore */ }
/*        log('Created new Splide instance.');
      } catch (err) {
        console.error('[splide-focus] failed to create Splide instance, using DOM fallback', err);
        attachObservers(root, null);
        return;
      }
    } else {
      log('Found existing Splide instance.');
    }

    // attach event-based or DOM fallback
    attachObservers(root, splideInstance);
  }

  // start
  if (document.readyState === 'complete' || document.readyState === 'interactive') {
    initOnce();
  } else {
    document.addEventListener('DOMContentLoaded', initOnce);
  }
})();