https://www.masteringthemix.com/cdn/shop/t/230/assets/multi-audio-…?v=159570395040500922361788791922

1(function(){"use strict";function formatTime(sec){if(!isFinite(sec))return"0:00";const m=Math.floor(sec/60),s=Math.floor(sec%60);return m+":"+(s<10?"0":"")+s}function initPlayer(el){const audios=el.querySelectorAll(".mtm-audio"),beforeAudio=el.querySelector('.mtm-audio[data-track="before"]'),afterAudio=el.querySelector('.mtm-audio[data-track="after"]'),playBtn=el.querySelector(".mtm-play-btn"),ringFill=el.querySelector(".mtm-ring-fill"),progressTrack=el.querySelector(".mtm-progress-track"),progressFill=el.querySelector(".mtm-progress-fill"),progressThumb=el.querySelector(".mtm-progress-thumb"),timeCurrent=el.querySelector(".mtm-time-current"),timeTotal=el.querySelector(".mtm-time-total"),toggleBtns=el.querySelectorAll(".mtm-toggle-btn"),toggleWrap=el.querySelector(".mtm-toggle"),gradId="mtm-grad-"+el.id,svg=el.querySelector(".mtm-ring");if(svg&&!svg.querySelector("defs")){const defs=document.createElementNS("http://www.w3.org/2000/svg","defs");defs.innerHTML=`
2        <linearGradient id="${gradId}" x1="0%" y1="0%" x2="100%" y2="100%">
3          <stop offset="0%" stop-color="#0072DC"/>
4          <stop offset="100%" stop-color="#004FAE"/>
5        </linearGradient>`,svg.prepend(defs),ringFill&&ringFill.setAttribute("stroke",`url(#${gradId})`)}let activeAudio=beforeAudio,inactiveAudio=afterAudio,isPlaying=!1,raf=null,scrubbing=!1;beforeAudio.muted=!1,afterAudio.muted=!0;function stopAll(){document.querySelectorAll(".mtm-ab-player").forEach(function(other){if(other===el)return;const otherBefore=other.querySelector('.mtm-audio[data-track="before"]'),otherAfter=other.querySelector('.mtm-audio[data-track="after"]');otherBefore&&otherBefore.pause(),otherAfter&&otherAfter.pause(),other.classList.remove("is-playing")})}function setProgress(pct){const p=Math.max(0,Math.min(100,pct));if(progressFill&&(progressFill.style.width=p+"%"),progressThumb&&(progressThumb.style.left=p+"%"),ringFill){const offset=119.38-p/100*119.38;ringFill.style.strokeDashoffset=offset}}function updateUI(){const dur=activeAudio.duration||0,cur=activeAudio.currentTime||0,pct=dur?cur/dur*100:0;scrubbing||setProgress(pct),timeCurrent&&(timeCurrent.textContent=formatTime(cur)),timeTotal&&(timeTotal.textContent=formatTime(dur))}function tick(){updateUI(),isPlaying&&(raf=requestAnimationFrame(tick))}function play(){stopAll(),isPlaying=!0,el.classList.add("is-playing"),activeAudio.muted=!1,inactiveAudio.muted=!0,activeAudio.play().catch(function(){}),inactiveAudio.play().catch(function(){}),raf=requestAnimationFrame(tick)}function pause(){isPlaying=!1,el.classList.remove("is-playing"),activeAudio.pause(),inactiveAudio.pause(),cancelAnimationFrame(raf),updateUI()}playBtn.addEventListener("click",function(){isPlaying?pause():play()}),toggleBtns.forEach(function(btn){btn.addEventListener("click",function(){const track=btn.dataset.track;if(track==="before"&&activeAudio===beforeAudio||track==="after"&&activeAudio===afterAudio)return;const syncTime=activeAudio.currentTime;track==="after"?(activeAudio=afterAudio,inactiveAudio=beforeAudio,toggleWrap.classList.add("after-active")):(activeAudio=beforeAudio,inactiveAudio=afterAudio,toggleWrap.classList.remove("after-active")),activeAudio.currentTime=syncTime,toggleBtns.forEach(function(b){b.classList.toggle("is-active",b===btn)}),isPlaying?(inactiveAudio.muted=!0,activeAudio.muted=!1,activeAudio.play().catch(function(){})):(inactiveAudio.muted=!0,activeAudio.muted=!1)})});function seek(e){const rect=progressTrack.getBoundingClientRect(),pct=Math.max(0,Math.min(1,(e.clientX-rect.left)/rect.width)),dur=activeAudio.duration||0;dur&&(activeAudio.currentTime=pct*dur,inactiveAudio.currentTime=pct*dur,setProgress(pct*100))}progressTrack.addEventListener("mousedown",function(e){scrubbing=!0,seek(e)}),progressTrack.addEventListener("click",seek),document.addEventListener("mousemove",function(e){scrubbing&&seek(e)}),document.addEventListener("mouseup",function(){scrubbing=!1}),progressTrack.addEventListener("touchstart",function(e){scrubbing=!0,seek(e.touches[0])},{passive:!0}),document.addEventListener("touchmove",function(e){scrubbing&&seek(e.touches[0])},{passive:!0}),document.addEventListener("touchend",function(){scrubbing=!1});function onMeta(){updateUI()}beforeAudio.addEventListener("loadedmetadata",onMeta),afterAudio.addEventListener("loadedmetadata",onMeta),activeAudio.addEventListener("ended",function(){isPlaying&&(activeAudio.currentTime=0,inactiveAudio.currentTime=0,activeAudio.play().catch(function(){}))})}function initAll(){document.querySelectorAll(".mtm-ab-player").forEach(function(el){el.dataset.mtmInit||(el.dataset.mtmInit="1",initPlayer(el))})}document.readyState==="loading"?document.addEventListener("DOMContentLoaded",initAll):initAll(),document.addEventListener("shopify:section:load",initAll)})();
6//# sourceMappingURL=/cdn/shop/t/230/assets/multi-audio-player-common.js.map?v=159570395040500922361788791922