Reprototyping of scoreboard without bootstrap carousel

ProjectSourceCode/src/resources/js/live-scoreboard/carousel.js

@@ -0,0 +1,31 @@
+document.addEventListener('DOMContentLoaded', function () {
+    const carouselInner = document.querySelector('#scoreboard-container');
+    const carouselItems = Array.from(carouselInner.children);
+    const carouselControlPrev = document.querySelector('.carousel-control-prev');
+    const carouselControlNext = document.querySelector('.carousel-control-next');
+    let currentIndex = 0;
+
+    const updateCarousel = () => {
+      carouselItems.forEach((item, index) => {
+        if (index === currentIndex) {
+          item.classList.add('active');
+        } else {
+          item.classList.remove('active');
+        }
+      });
+    };
+
+    carouselControlPrev.addEventListener('click', () => {
+      if (currentIndex > 0) {
+        currentIndex--;
+        updateCarousel();
+      }
+    });
+
+    carouselControlNext.addEventListener('click', () => {
+      if (currentIndex < carouselItems.length - 1) {
+        currentIndex++;
+        updateCarousel();
+      }
+    });
+  });