switching to separate source element for the audio tag

index.html

@@ -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>