diff --git a/src/scripts/main.js b/src/scripts/main.js index d62aa00..1ed09df 100644 --- a/src/scripts/main.js +++ b/src/scripts/main.js @@ -605,7 +605,7 @@ document.addEventListener('DOMContentLoaded', () => { // 6. AMBIENT WORKSHOP SOUND (MP3) // ========================================================== - let soundOn = false; + let soundOn = true; // Create audio element (preloaded, looped, low volume) const ambientAudio = new Audio('/assets/atelier-ambiance.mp3'); @@ -616,8 +616,8 @@ document.addEventListener('DOMContentLoaded', () => { const headerNav = document.querySelector('.header-nav'); if (headerNav) { const soundBtn = document.createElement('button'); - soundBtn.className = 'sound-toggle'; - soundBtn.setAttribute('aria-label', 'Activer le son ambiant'); + soundBtn.className = 'sound-toggle sound-active'; + soundBtn.setAttribute('aria-label', 'Couper le son ambiant'); soundBtn.innerHTML = '' + '' + @@ -630,6 +630,20 @@ document.addEventListener('DOMContentLoaded', () => { attachCursorHover([soundBtn]); } + // Autoplay on first user interaction (browsers require it) + let autoStarted = false; + function autoStartSound() { + if (autoStarted || !soundOn) return; + autoStarted = true; + startAmbientSound(); + window.removeEventListener('click', autoStartSound); + window.removeEventListener('scroll', autoStartSound); + window.removeEventListener('mousemove', autoStartSound); + } + window.addEventListener('click', autoStartSound, { once: false }); + window.addEventListener('scroll', autoStartSound, { once: false }); + window.addEventListener('mousemove', autoStartSound, { once: false }); + // Smooth volume fade using GSAP function startAmbientSound() { ambientAudio.play().then(() => {