Sales Mix

<!-- Potrebujeme kód, ktorý zmeria výšku
  najvyššieho slajdu a podľa toho prispôsobí celý slajder podľa potreby -->

(function() {
  // Debounce helper
  function debounce(fn, delay) {
    let t;
    return function() {
      clearTimeout(t);
      t = setTimeout(fn, delay);
    };
  }

  // Zmeraj max výšku v rámci konkrétneho slider wrappera
  function measureMaxHeight(containerEl) {
    const wraps = containerEl.querySelectorAll('.refs__refs-slide');
    let max = 0;
    wraps.forEach(slide => {
      const content = slide.querySelector('.referencie__referencia-wrap') || slide;
      // dočasne necháme auto výšku, aby meranie bolo presné
      const prevH = slide.style.height;
      slide.style.height = ''; // reset
      const h = content.scrollHeight;
      if (h > max) max = h;
      slide.style.height = prevH; // vrátime späť, nastavenie príde hneď po výpočte
    });
    return max;
  }

  function applyFixedHeight(root) {
    if (!root) return;

    // Root je .refs__refs-container; v ňom hľadáme Splide štruktúru
    const splideRoot = root.querySelector('.refs__refs-slider .splide') || root.querySelector('.refs__refs-slider');
    const track = splideRoot && splideRoot.querySelector('.splide__track');
    const list  = splideRoot && splideRoot.querySelector('.splide__list');
    const slides = splideRoot && splideRoot.querySelectorAll('.splide__slide');

    if (!splideRoot || !track || !list || !slides || !slides.length) return;

    // Reset výšok na auto, nech meriame prirodzený stav pri aktuálnom breakpointe
    track.style.height = '';
    list.style.height  = '';
    slides.forEach(s => s.style.height = '');

    const max = measureMaxHeight(splideRoot);
    if (!max) return;

    const px = max + 'px';
    track.style.height = px;
    list.style.height  = px;
    slides.forEach(s => s.style.height = px);

    // Poistka proti "poskočeniu" okolia
    const container = root;
    container.style.minHeight = px;
  }

  function wireUp(container) {
    const recalc = () => applyFixedHeight(container);

    // 1) po DOM ready
    recalc();

    // 2) po načítaní fontov (mení line-height a zalomenie)
    if (document.fonts && document.fonts.ready) {
      document.fonts.ready.then(recalc).catch(() => {});
    }

    // 3) po úplnom loade (kvôli obrázkom/ikonám v referenciách, ak tam sú)
    window.addEventListener('load', recalc, { once: true });

    // 4) pri resize/breakpointoch
    window.addEventListener('resize', debounce(recalc, 150));

    // 5) ak sa obsah mení dynamicky (napr. lazy load, filtrácia)
    if (window.ResizeObserver) {
      const ro = new ResizeObserver(debounce(recalc, 80));
      ro.observe(container);
    }

    // 6) ak vieme chytiť Splide inštanciu, naviažeme eventy
    const splideEl = container.querySelector('.refs__refs-slider .splide') || container.querySelector('.refs__refs-slider');
    const inst = splideEl && splideEl.splide;
    if (inst && inst.on) {
      // mounted: po inicializácii; updated/resize: pri zmene options/breakpoint; moved: pri posune (bezpečné recalc)
      inst.on('mounted updated resize refreshed moved', recalc);
    }
  }

  function init() {
    document.querySelectorAll('.refs__refs-container').forEach(wireUp);
  }

  if (document.readyState === 'loading') {
    document.addEventListener('DOMContentLoaded', init);
  } else {
    init();
  }
})();