Last.fm Recent Tracks
Tapping in to the Lat.fm API to get a user's recent tracks via jQuery and JSON.
by Wederson
HTML
<div id="top_artist"></div>
CSS
.nope
{
opacity:0.25;
filter:alpha(opacity=25);
}
#artiststyle0 {
padding:3px;
display:inline-block;
}
#artiststyle {
text-decoration:none;-o-box-shadow: 0px 2px 5px black;-moz-box-shadow: 0px 2px 5px black;-webkit-box-shadow: 0px 2px 5px black;box-shadow: 0px 2px 5px black; padding:4px;
background-repeat: no-repeat;width:95px; height:95px; float:left;
}
#artiststyle:hover {
text-decoration:none;-o-box-shadow: 0px 2px 5px black;-moz-box-shadow: 0px 7px 10px black;-webkit-box-shadow: 0px 7px 10px black;box-shadow: 0px 7px 10px black; padding:4px;
background-repeat: no-repeat;width:95px; height:95px; float:left;opacity:0.9;
}
#artiststyle2 {
color:#fff; padding:2px; font-size:14px; background:#000; font-family:helvetica; font-weight:500; opacity:0.6;
}
JavaScript
$.getJSON('http://ws.audioscrobbler.com/2.0/?method=tag.getTopArtists&tag=sertanejo&limit=1000&api_key=b5bd5e1d31bf4188a6bcd329c964f6f2&format=json&callback=?', function(data) {
var items = [];
var now_playing = "";
var artist = data.topartists.artist;
$.each(artist, function(i) {
var found = 'nope';
switch (true) {
case artist[i].name === 'Animal Collective':
found = 'yeah';
break;
case artist[i].name === 'Foster The People':
found = 'yeah';
break;
}
items.push('<div id="artiststyle0"><a href="/p/?name=p.php?a=' + artist[i].name + '%26"><div id="artiststyle" style="background:url(' + artist[i].image[2]["#text"] + ');background-size: 108px 108px;"><div id="artiststyle2">' + artist[i].name + '</div></div></a></div>');
});
$('#top_artist').append(items.join(''));
});