Hi Oliver,
On this Wiki Page Torben has described how you should proceed. I followed these instructions and a friend of mine helped me with the php scripts which I needed on my website.
This script should be placed at the top of your website. xxxxxxxxxx has to be replaced with the appropriate name of the database and passwords obviously. Make sure you rename the webpage to *.php in order for it to work. Set DESC LIMIT to the appropriate number of songs you would like to show. “1” shows only the current song.
<?php
$db = mysqli_connect('localhost', 'xxxxxxxxxx', 'xxxxxxxxxx', 'xxxxxxxxxx');
$query = mysqli_query($db, "SELECT * FROM playlistlog ORDER BY starttime DESC LIMIT 2");
?>
Insert the code below somewhere on your page where you would like to show the current song:
<div id="now_playing">
<h2>Now on air:<a href="../nfm/nfm.php"><i class="fa fa-refresh pull-right hidden-xs"></i></a></h2>
<br>
<div id="onair">
<div class="table-responsive">
<table class="table table-hover table-highlight table-condensed table-borderless">
<tbody>
<?php /*StartWhile*/ while($song = mysqli_fetch_assoc($query)) { ?>
<tr>
<td><img src="<?= curl_get_file_contents($song['artist'],$song['title']) ?: "https://xxxxxxxx.nl/images/nfm_tips/fallback_image.png" ?>" class="border2 img-rounded pull-left" width=191px height=191px/></td>
<td><span style="font-weight:bold" class="text-uppercase"><?= $song['artist'] ?></span> <br> <?= $song['title'] ?><td>
</tr>
<?php } /*EndWhile*/ ?>
</tbody>
</table>
</div>
</div>
</div>
Make the necessary adjustments to your own liking.
If you want the albumart to show up, put this script underneath the the first php script. Make sure you have a fallback image if the albumart cannot be found.
<?php
function curl_get_file_contents($artiest,$titel,$size = "extralarge")
{
$URL = "http://api.depubliekeomroep.nl/anp/albumart.php?artiest=" .
urlencode($artiest) . "&titel=". urlencode($titel)
."&size=". urlencode($size);
$c = curl_init();
curl_setopt($c, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($c, CURLOPT_URL, $URL);
$contents = curl_exec($c);
curl_close($c);
if ($contents) return $contents;
else return FALSE;
}
?>
Insert this script at the end of your body in order to refresh the div where your current song is shown:
<script>
$(document).ready(function(){
setInterval(function(){
$("#onair").load(window.location.href + " #onair" );
}, 26760);
});
</script>
This will refresh the div every 26 seconds. My fallback image is a turning vinyl record at 33rpm and this way it keeps rotating nicely even when the div is refreshed.
This is the result with Album Art:
And this is the result without Album Art:
Hope this is helpfull.
)
