networkState, readyState not working for audio stream

[ebooks9]

I’m trying to check for an audio stream, to see if it is active. The server is on and streaming audio or it is off and not streaming. I found two methods, .networkState and .readyState, that work against an audio tag or an Audio() object. Things look okay when the stream is off and never been listened to (not in browser cache). I have both methods being executed every 4s to catch any change in the status of the stream because I want to continuously monitor for any change and update the web page.

The trouble is that I can’t get either method to correctly update the status of the stream once it has changed, that is, from off to on or on to off. I have to refresh the page to get a real update. Then, after you’ve listened to the stream and it is cached, it always shows as ‘on’.

Why don’t either of these methods correctly detect the change of the stream? Is there a way to force a check against the actual object instead of the cached object?

(excuse my code - I quickly chunked this together and I am a newbie) (I tried more than shown below, but tried to make this post succinct.)

<audio id="myAudio" controls>
  <source src="http://myserver.com:8080/live.mp3" type="audio/mpeg">
</audio>

<!-- this is what does not update correctly on the page -->
<p>StreamN0 is: <span id="netstate">OFFLINE</span></p>
<p>StreamR0 is: <span id="readystate">OFFLINE</span></p>

<script>
var myTimerVar = setInterval(myTimer, 4000);
var myFunctionVar = setInterval(myFunction, 4000);
// var aud = new Audio('http://myserver.com:8080/live.mp3');

function myTimer() {
    var acheck = document.getElementById("myAudio").networkState;
    if (acheck == 1) {
      document.getElementById("netstate").innerHTML = "ONLINE " + acheck;
      document.getElementById("netstate").style.backgroundColor = "MediumSeaGreen";
    }
    else if (acheck == 3) {
      document.getElementById("netstate").innerHTML = "OFFLINE " + acheck;
      document.getElementById("netstate").style.backgroundColor = "yellow";
    }
}

function myFunction() {
    var x = document.getElementById("myAudio").readyState;
    if (x == 0) {
      document.getElementById("readystate").innerHTML = "OFFLINE " + x;
      document.getElementById("readystate").style.backgroundColor = "yellow";
    }
    else if (x == 4) {
      document.getElementById("readystate").innerHTML = "ONLINE " + x;
      document.getElementById("readystate").style.backgroundColor = "MediumSeaGreen";
    }
}
</script>