/**
 * @file
 * Counters utilities.
 *
 */
(function (Drupal, $) {
  'use strict';
  
  let initializedCounters;

  Drupal.behaviors.countersAnimation = {
    attach: function (context, settings) {
      if (!initializedCounters) {
        initializedCounters = true;

        const counters = document.querySelectorAll(".paragraph--type--counter-de-informacoes .field--name-field-count");
        const countersValues = [];

        var isInView = false;

        function counterBlockIsVisible() {
          var counterBlock = document.querySelector(".paragraph--type--counter-de-informacoes");

          if (counterBlock) {
            var counterBlockPosition = counterBlock.getBoundingClientRect();
            var windowHeight = window.innerHeight;

            if (counterBlockPosition.top >= 300 && counterBlockPosition.top <= windowHeight && !isInView) {
              const animateCounter = (counter, start, end, duration) => {
                let startTimestamp = null;
                const step = (timestamp) => {
                  if (!startTimestamp) startTimestamp = timestamp;
                  const progress = Math.min((timestamp - startTimestamp) / duration, 1);
                  counter.innerHTML = Math.floor(progress * (end - start) + start);
                  if (progress < 1) {
                    window.requestAnimationFrame(step);
                  }
                };
                window.requestAnimationFrame(step);
              }

              for (let i = 0; i < counters.length; i++) {
                animateCounter(counters[i], 0, countersValues[i], 500);
              }

              isInView = true;
            } else if ((counterBlockPosition.top < 300 || counterBlockPosition.top > windowHeight) && isInView) {
              isInView = false;
            }
          }
        }

        if (counters) {
          for (let i = 0; i < counters.length; i++) {
            countersValues.push(counters[i].innerText);
          }
          window.addEventListener("scroll", counterBlockIsVisible);
          window.addEventListener("load", counterBlockIsVisible);
        }
      }
    }
  }

})(Drupal, jQuery);