Update track title and listener count from an Icecast2 server

by onigetoc

HTML

<p>Listeners: <span id="listeners">00</span></p>
<p>Current track: <span id="track-title">LIVE</span></p>

JavaScript

function radioTitle() {
 
// this is the URL of the json.xml file located on your server.
    //var url = 'http://stream.amea-radio.gr:9000/json.xsl';
    var url = 'https://raw.githubusercontent.com/substack/tuner/master/stations.json';
 
$.ajax({
   type: 'GET',
    url: url,
    async: true,
    jsonpCallback: 'parseMusic',
    contentType: "application/json",
    dataType: 'jsonp',
    success: function(json) {
        // this is the element we're updating that will hold the track title
       $('#track-title').text(json['/radio']['title']); 
        // this is the element we're updating that will hold the listeners count
       $('#listeners').text(json['/radio']['listeners']); 
    },
    error: function(e) {
       console.log(e.message);
    }
});
 
}

$(document).ready(function(){

  setTimeout(function(){radioTitle();}, 2000);
  setInterval(function(){radioTitle();}, 15000); // we're going to update our html elements / player every 15 seconds

});