JSFiddle - React, Tailwind, and code Playground
HTML
<!DOCTYPE html>
<html>
<body>
<br>
<br>
<button onclick="play1()" type="button">Play Audio Clip - Test</button>
<br><br>
<br><br>
<p>
*None of the buttons below or functions matter for your project
</p>
<button onclick="getTotalDuration()" type="button">Total Clip Duration</button>
<br><br>
<button onclick="getCurrentTime()" type="button">Get current time position</button>
<button onclick="setCurrentTime()" type="button">Set time position to 1 second</button>
<br>
</body>
</html>
JavaScript
//var audioClip_ID = new Audio("horse.mp3");
var audioClip_ID = new Audio("https://app.box.com/shared/static/j9jix5nhuddqfiw4zq7390ob7y9asl7f.mp3");
var triggerTimeLength = 189; //seconds (change to 5 if you want)
function play1(){
audioClip_ID.onended = function () {
document.getElementById("myCheck").click();
}
audioClip_ID.play();
//as soon as audio plays. start 'timer'
//setTimeout(getCurrentTime, 1000); //hard coded approach
setTimeout(getCurrentTime, (audioClip_ID.duration - triggerTimeLength) * 1000); //dynamic approach
}
//not needed buttons/functions
function getCurrentTime(){
alert("Time Check: " + audioClip_ID.currentTime + " / " + "Clip Duration: " + audioClip_ID.duration);
}
function setCurrentTime(){
audioClip_ID.currentTime = 1;
alert("Set Time To: " + audioClip_ID.currentTime);
}
function getTotalDuration(){
alert("Total Audio Clip Duration: " + audioClip_ID.duration);
}