https://www.houstonpermittingcenter.org/themes/custom/hpc/js/snapshot.js?tm4jo9

1(function ($) {
2  $.ajaxSetup({
3    cache: false
4  });
5  var dir = drupalSettings.data_dir;
6  var updatedCounter = 0;
7  $.get(dir + '/pr0055a1_DailyInspcNumbers.csv', function (txt) {
8    var lines = txt.split("\n");
9    var total = lines[1].split(",");
10    $('.daily-inspection-counter').eq(0).attr('data-target', total[4]);
11    startAnimation();
12  });
13  $.get(dir + '/pr0055ap_DailyNumbers.csv', function (txt) {
14    var lines = txt.split("\n");
15    var total = lines[1].split(",");
16    $('.daily-numbers-counter').eq(0).attr('data-target', total[0]);
17    startAnimation();
18  });
19  // Function to start animation
20  function startAnimation() { // the counter start
21    const counters = document.querySelectorAll('.counter');
22    const speed = 50; // The lower the slower
23
24    counters.forEach(counter => {
25      const updateCount = () => {
26        if (counter.getAttribute('data-target') != "0") {
27          const target = + counter.getAttribute('data-target');
28          const count = + counter.innerText;
29
30          // Lower inc to slow and higher to slow
31          const inc = speed;
32
33          // Check if target is reached
34          if (count < target) { // Add inc to count and output in counter
35            counter.innerText = count + inc;
36            // Call function every ms
37            setTimeout(updateCount, 50);
38          } else {
39            counter.innerText = target;
40          }
41        }
42      };
43
44      updateCount();
45    });
46
47  }
48  function resetCounters() {
49    var counters = document.querySelectorAll('.counter');
50    counters.forEach(counter => {
51      counter.innerText = 0;
52    });
53  }
54  // Check on page load (in case the element is already in view)
55  const inViewport = (entries, observer) => {
56    entries.forEach(entry => {
57      entry.target.classList.toggle("is-inViewport", entry.isIntersecting);
58      if (entry.target.classList.contains('is-inViewport')) {
59        startAnimation();
60      } else {
61        resetCounters();
62      }
63    });
64  };
65
66  const Obs = new IntersectionObserver(inViewport);
67  const obsOptions = {};
68  // See: https://developer.mozilla.org/en-US/docs/Web/API/Intersection_Observer_API#Intersection_observer_options
69
70  // Attach observer to every [data-inviewport] element:
71  document.querySelectorAll('.paragraph--type--snapshot .circle-item').forEach(el => {
72    Obs.observe(el, obsOptions);
73  });
74
75})(jQuery, drupalSettings);