Estoy trabajando en una pequeña aplicación web que reproduce mis transmisiones en vivo de radio favoritas. Ahora hay un problema cuando la transmisión se interrumpe por una llamada u otro medio: desaparece. Espero que el audio se reanude automáticamente después de que finalice el evento (por ejemplo, al final de la llamada), sin embargo, este no es el caso. He buscado en los foros pero nada parece comparar/funcionar. Probé un boolean para determinar el estado de reproducción, pero esto simplemente se estropea cada vez que presiono manualmente el botón de stop . Aquí está mi código hasta ahora:

 const radioList = [ { "radioName": "Ibiza Live", "radioStream": "https://streams.radio.co/sdc9cfaf77/listen", "imgUrl": "../img/ibizalive.png" }, ]; const radioContainer = document.querySelector('.stationsContainer'); // Render markup const radioMarkup = (img, name, audio) => { const html = ` <div class="station"> <img src="${img}" alt="${name}" data-id="station"> <div class="live"> <div> <div></div> <div></div> <div></div> <div></div> </div> </div> <audio src="${audio}"></audio> </div> ` radioContainer.innerHTML += html; } radioList.forEach(i => { radioMarkup(i.imgUrl, i.radioName, i.radioStream); }) // Play radio const audio = document.querySelectorAll("audio"); const stationList = document.querySelectorAll(".stationsContainer .station"); stationList.forEach((station, i) => { station.addEventListener('click', () => { stopAllAudio(); audio[i].load(); audio[i].play(); }) })

¿Cómo puedo hacer que el audio se reanude después de un evento?