Update track title and listener count from an Icecast2 server
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';
// this is your mountpoint's name, mine is called /radio
var mountpoint = '/radio';
$.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[mountpoint].title);
// this is the element we're updating that will hold the listeners count
$('#listeners').text(json[mountpoint].listeners);
},
error: function (e) { console.log(e.message);
}
});
}
$(document).ready(function () {
setTimeout(function () {radioTitle();}, 2000);
// we're going to update our html elements / player every 15 seconds
setInterval(function () {radioTitle();}, 15000);
});