'; } html += ''; } track.innerHTML = html; } function getVisibleCount() { if (window.innerWidth >= 1024) return 3; if (window.innerWidth >= 768) return 2; return 1; } function updatePosition() { var track = document.getElementById('appMainTrack'); if (!track) return; var slides = track.querySelectorAll('.app-slide'); if (!slides.length) return; var slideWidth = slides[0].offsetWidth; track.style.transform = 'translateX(-' + (currentIdx * slideWidth) + 'px)'; } function moveNext() { var visible = getVisibleCount(); if (currentIdx < appData.length - visible) { currentIdx++; } else { currentIdx = 0; } updatePosition(); } function movePrev() { var visible = getVisibleCount(); if (currentIdx > 0) { currentIdx--; } else { currentIdx = Math.max(0, appData.length - visible); } updatePosition(); } function stopAutoPlay() { if (autoPlayTimer) { clearInterval(autoPlayTimer); autoPlayTimer = null; } } function startAutoPlay() { stopAutoPlay(); autoPlayTimer = setInterval(moveNext, 5000); } function init() { buildHTML(); var nextBtn = document.getElementById('appForward'); var prevBtn = document.getElementById('appBack'); var track = document.getElementById('appMainTrack'); if (!nextBtn || !prevBtn || !track) return; nextBtn.addEventListener('click', function() { moveNext(); startAutoPlay(); }); prevBtn.addEventListener('click', function() { movePrev(); startAutoPlay(); }); track.addEventListener('mouseenter', stopAutoPlay); track.addEventListener('mouseleave', startAutoPlay); var resizeTimeout; window.addEventListener('resize', function() { clearTimeout(resizeTimeout); resizeTimeout = setTimeout(function() { currentIdx = 0; updatePosition(); }, 200); }); updatePosition(); startAutoPlay(); } if (document.readyState === 'loading') { document.addEventListener('DOMContentLoaded', init); } else { init(); } })();