I\'m basically trying to load in one random flickr image taken from a specific user and specific set which then gets displayed within a div with the id of \'flickr-wrap\'. I\'m
You may want to pull bigger images, for that you need your API key from here . Then, you may call this function and thats it:
function getPicture(the_user_id, your_div_id){
var apiKey = "YOUR-API-KEY"; // replace this with your API key
// get an array of random photos
$.getJSON(
"http://api.flickr.com/services/rest/",
{
method: 'flickr.people.getPublicPhotos',
api_key: apiKey,
user_id: the_user_id,
format: 'json',
nojsoncallback: 1,
per_page: 10 // you can increase this to get a bigger array
},
function(data){
// if everything went good
if(data.stat == 'ok'){
// get a random id from the array
var photoId = data.photos.photo[ Math.floor( Math.random() * data.photos.photo.length ) ];
// now call the flickr API and get the picture with a nice size
$.getJSON(
"http://api.flickr.com/services/rest/",
{
method: 'flickr.photos.getSizes',
api_key: apiKey,
photo_id: photoId,
format: 'json',
nojsoncallback: 1
},
function(response){
if(response.stat == 'ok'){
var the_url = response.sizes.size[5].source;
$("#"+your_div_id).append('');
}
else{
console.log(" The request to get the picture was not good :\ ")
}
}
);
}
else{
console.log(" The request to get the array was not good :( ");
}
}
);
};