jQuery + get.JSON + Last.FM problems

Question

I am trying to customize this script so that instead of a user's recent tracks it will display a user's favourite artists.

This is what I have come up with, however it doesn't work whatsoever. I thought it would be easy changing the attributes of the feed, but obviously not...

(function($){
$.fn.lastFM = function(options) {

var defaults = {
number: 10,
username: 'willblackmore',
apikey: '96e0589327a3f120074f74dbc8ec6443',
artSize: 'medium',
noart: 'images/noartwork.gif',
onComplete: function(){}
},
settings = $.extend({}, defaults, options);



var lastUrl = 'http://ws.audioscrobbler.com/2.0/?method=user.gettopartists&user='+settings.username+'&api_key='+settings.apikey+'+'&limit='+settings.number+'&format=json&callback=?';
var $this = $(this);

var container = $this.html();

$this.children(':first').remove();

if(settings.artSize == 'small'){imgSize = 0}
if(settings.artSize == 'medium'){imgSize = 1}
if(settings.artSize == 'large'){imgSize = 2}

this.each(function() {

$.getJSON(lastUrl, function(data){ 
 $.each(data.topartists.artist, function(i, item){

 if(item.image[1]['#text'] == ''){
  art = settings.noart;
 }else{
  art = stripslashes(item.image[imgSize]['#text']);
 }

 url = stripslashes(item.url);
 song = item.name;
 artist = item.playcount['#text'];
 album = item.streamable['#text'];

 $this.append(container);

 var $current = $this.children(':eq('+i+')');

 $current.find('[class=lfm_song]').append(song);
 $current.find('[class=lfm_artist]').append(artist);
 $current.find('[class=lfm_album]').append(album);
 $current.find('[class=lfm_art]').append("<img src='"+art+"' alt='Artwork for "+album+"'/>");
 $current.find('a').attr('href', url).attr('title', 'Listen to '+song+' on Last.FM').attr('target', '_blank');

 //callback
 if(i==(settings.number-1)){
  settings.onComplete.call(this);
 }

  });
 });
});
};

 //Clean up the URL's
 function stripslashes( str ) {  
return (str+'').replace(/\0/g, '0').replace(/\\([\\'"])/g, '$1');
}
})(jQuery);`

Any ideas? Thanks.

Enactment

Did you mean to post your api key? – Paulettepauley

Answer 1

You have concencated your URL wrong. This is valid:

var lastUrl = 'http://ws.audioscrobbler.com/2.0/?method=user.gettopartists&user=' + settings.username + '&api_key=' + settings.apikey + '&limit=' + settings.number + '&format=json&callback=?';

I'm not sure it fixes your problem since you didn't provide enough detail (errors etc).

Mccrea

And you shouldn't be concatenating to make a URL anyway. You should be using the second parameter of $.getJSON to let jQuery escape your data properly. Almost every use of concatenation I've seen near jQuery is wrong and can be avoided. – Bewail

This DOES fix my problem! Thanks! So it is simple, just need to watch the URL. And on that front... Have no idea what 'concatenating' is, but presume it is '+settings.username+' for example? Why is it bad and what is the second parameter of $.getJSON? – Enactment

If I solved your problem you should accept my answer. As for your question ask another question. Concatenating means putting multiple strings together into one string (you do that with +) – Enteron