switching to separate source element for the audio tag

This commit is contained in:
mb 2022-09-21 15:37:58 +02:00
parent 69ea8bb846
commit a76baa5882

View File

@ -130,36 +130,30 @@
<!-- PLACEHOLDER link: https://vvvvvvaria.org/logs/zamopuzo/audio/varia_broadcasts_jingle1.mp3
previous audio cast: https://stream.w-i-t-m.net/meander -->
<div class="audio-stream fullscreen" id="showAudio">
<audio id="player" preload="none" src="https://voice.vvvvvvaria.org/live"> </audio>
<audio id="player" preload="none">
<source src="https://voice.vvvvvvaria.org/live" type="audio/mpeg">
Your browser does not support the audio element. Try the direct link to the audio below!
</audio>
<p>
Press play to tune in! It might take a few seconds to load.</p>
<div class="audio-buttons">
<button id="audio" class="stream-button b-narrow" onclick="Play()">Play</button>
<!-- <button id="bp" class="stream-button b-narrow" onclick="document.getElementById('player').play(); bplaytoggle()">Play</button> -->
<!-- <button id="bs" class="stream-button b-narrow" onclick="console.log(soundEffect);">Stop</button> -->
<!-- <button id="bs" class="stream-button b-narrow" onclick="document.getElementById('player').pause();document.getElementById('player').src=document.getElementById('player').src; bstoptoggle()">Stop</button> -->
<button id="audioButton" class="stream-button b-narrow" onclick="Play()">Play</button>
<script>
var audio = document.getElementById("player");
audio.volume = 0.5;
var butn = document.getElementById("audio");
// butn.style.background = "url(https://uploads-ssl.webflow.com/5acdf398c6f3e7252e9a31b9/5ad9f901d9a651ff58dad03b_play.svg) no-repeat";
audio.volume = 0.6;
var butn = document.getElementById("audioButton");
function Play() {
if(audio.paused) {
audio.play();
butn.innerText = "Pause";
}
else {
audio.pause();
butn.innerText = "Play";
}
}
if(audio.paused) {
audio.play();
butn.innerText = "Pause";
}
else {
audio.pause();
butn.innerText = "Play";
}
}
</script>
<button class="stream-button b-narrow vol" onclick="document.getElementById('player').volume += 0.1">Vol +</button>
<button class="stream-button b-narrow vol" onclick="document.getElementById('player').volume -= 0.1">Vol -</button>
</div>