this will display shoutcast dnas v2 status/info, auto updating every 5 seconds without page reload.
Your DNAS version must have JSON support, if it does not then you will not be able to use this plugin.
Download the plugin and store jquery.shoutcast.easy.min.js somewhere on your server.
In the second script tag you need to edit example.com to be your host and also edit the port if necessary, this is the minimum configration that is required by the plugin, there are more options which can be found here
Once you have configured the plugin you will need to add various elements to your page.
To show any statistics from your stream you simply need to add an element with adata-shoutcast-value=”” attribute, for example, if I wanted to show the currently playing song this is what you would have:
Or current listeners:
All of the available values can be found here
Showing played tracks
To show played tracks you need to an an ul element with an id of played to your page:
With the above element on the page the names of the recently played tracks will be displayed in order.
<body> <h1 data-shoutcast-value="servertitle"></h1> <p>Now Playing: <span data-shoutcast-value="songtitle"></span></p> <p>Listeners: <span data-shoutcast-value="currentlisteners"></span>/<span data-shoutcast-value="maxlisteners"></span></p> <h2>You just missed</h2> <ul id="played"></ul> <script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script> <script src="jquery.shoutcast.easy.min.js?host=example.com&port=8000&interval=5000"></script> </body>
The above HTML will display the server title, the current song, the current listeners, the maximum listeners and a list of all of the recently played tracks.