fixing js in github workflow

Author: gcclinux

www/main.js

@@ -1,73 +1,74 @@
-document.querySelectorAll('a[href^="#"]').forEach(anchor => {
-    anchor.addEventListener('click', function (e) {
-        e.preventDefault();
-
-        document.querySelector(this.getAttribute('href')).scrollIntoView({
-            behavior: 'smooth'
+document.addEventListener('DOMContentLoaded', function() {
+    // Smooth scroll for anchor links
+    document.querySelectorAll('a[href^="#"]').forEach(anchor => {
+        anchor.addEventListener('click', function (e) {
+            e.preventDefault();
+            document.querySelector(this.getAttribute('href')).scrollIntoView({
+                behavior: 'smooth'
+            });
         });
     });
-});
 
-// Tab functionality for controls section
-const tabButtons = document.querySelectorAll('.tab-btn');
-const tabContents = document.querySelectorAll('.tab-content');
+    // Tab functionality for controls section
+    const tabButtons = document.querySelectorAll('.tab-btn');
+    const tabContents = document.querySelectorAll('.tab-content');
 
-tabButtons.forEach(button => {
-    button.addEventListener('click', () => {
-        const targetTab = button.getAttribute('data-tab');
-        
-        tabButtons.forEach(btn => btn.classList.remove('active'));
-        tabContents.forEach(content => content.classList.remove('active'));
-        
-        button.classList.add('active');
-        document.getElementById(targetTab).classList.add('active');
+    tabButtons.forEach(button => {
+        button.addEventListener('click', () => {
+            const targetTab = button.getAttribute('data-tab');
+            tabButtons.forEach(btn => btn.classList.remove('active'));
+            tabContents.forEach(content => content.classList.remove('active'));
+            button.classList.add('active');
+            document.getElementById(targetTab).classList.add('active');
+        });
     });
-});
 
-// Tab functionality for feature highlights section
-const featureButtons = document.querySelectorAll('.feature-tab-btn');
-const featurePanels = document.querySelectorAll('.feature-panel');
+    // Tab functionality for feature highlights section
+    const featureButtons = document.querySelectorAll('.feature-tab-btn');
+    const featurePanels = document.querySelectorAll('.feature-panel');
 
-featureButtons.forEach(button => {
-    button.addEventListener('click', () => {
-        const targetFeature = button.getAttribute('data-feature');
-        
-        featureButtons.forEach(btn => btn.classList.remove('active'));
-        featurePanels.forEach(panel => panel.classList.remove('active'));
-        
-        button.classList.add('active');
-        document.getElementById(targetFeature).classList.add('active');
+    featureButtons.forEach(button => {
+        button.addEventListener('click', () => {
+            const targetFeature = button.getAttribute('data-feature');
+            featureButtons.forEach(btn => btn.classList.remove('active'));
+            featurePanels.forEach(panel => panel.classList.remove('active'));
+            button.classList.add('active');
+            document.getElementById(targetFeature).classList.add('active');
+        });
     });
-});
 
-// Carousel functionality for featured gameplay
-const slides = document.querySelectorAll('.carousel-slide');
-const prevBtn = document.querySelector('.carousel-nav.prev');
-const nextBtn = document.querySelector('.carousel-nav.next');
-const dotsContainer = document.querySelector('.carousel-dots');
-let currentSlide = 0;
+    // Carousel functionality for featured gameplay
+    const slides = document.querySelectorAll('.carousel-slide');
+    const prevBtn = document.querySelector('.carousel-nav.prev');
+    const nextBtn = document.querySelector('.carousel-nav.next');
+    const dotsContainer = document.querySelector('.carousel-dots');
+    
+    if (slides.length > 0 && dotsContainer) {
+        let currentSlide = 0;
 
-// Create dots
-slides.forEach((_, index) => {
-    const dot = document.createElement('div');
-    dot.classList.add('dot');
-    if (index === 0) dot.classList.add('active');
-    dot.addEventListener('click', () => goToSlide(index));
-    dotsContainer.appendChild(dot);
-});
+        // Create dots
+        slides.forEach((_, index) => {
+            const dot = document.createElement('div');
+            dot.classList.add('dot');
+            if (index === 0) dot.classList.add('active');
+            dot.addEventListener('click', () => goToSlide(index));
+            dotsContainer.appendChild(dot);
+        });
 
-const dots = document.querySelectorAll('.dot');
+        const dots = document.querySelectorAll('.dot');
 
-function goToSlide(n) {
-    slides[currentSlide].classList.remove('active');
-    dots[currentSlide].classList.remove('active');
-    currentSlide = (n + slides.length) % slides.length;
-    slides[currentSlide].classList.add('active');
-    dots[currentSlide].classList.add('active');
-}
+        function goToSlide(n) {
+            slides[currentSlide].classList.remove('active');
+            dots[currentSlide].classList.remove('active');
+            currentSlide = (n + slides.length) % slides.length;
+            slides[currentSlide].classList.add('active');
+            dots[currentSlide].classList.add('active');
+        }
 
-prevBtn.addEventListener('click', () => goToSlide(currentSlide - 1));
-nextBtn.addEventListener('click', () => goToSlide(currentSlide + 1));
+        if (prevBtn) prevBtn.addEventListener('click', () => goToSlide(currentSlide - 1));
+        if (nextBtn) nextBtn.addEventListener('click', () => goToSlide(currentSlide + 1));
 
-// Auto-advance carousel
-setInterval(() => goToSlide(currentSlide + 1), 6000);
+        // Auto-advance carousel
+        setInterval(() => goToSlide(currentSlide + 1), 6000);
+    }
+});