GET data from GitHub is Possible, GET data from dribbble doesn't work

Question

I've used this piece of code to GET data from the GitHub API

var name;
var description;    
var html_url;
var username    = "PirateStef";
var updated_at;
var language;       
var repo;
var urlGitHub       = 'https://api.github.com/users/'+username+'/repos?sort=created';

$.getJSON(urlGitHub, function(json){
    repositories = json;
    outputGitHubContent();      // GitHub Content         
}); 

function outputGitHubContent() {


    $.each(repositories, function(index){
        name            = "<div class='name'>" + repositories[index].name + "</div>";
        description     = "<div class='description'>" + repositories[index].description + "</div>";
        updated_at      = "<div class='updated_at'>" + repositories[index].updated_at.substring(0,10) + "</div>";
        html_url        = "<a class='html_url'  target='_blank' href='" + repositories[index].html_url + "'>";
        language        = "<div class='language'>" + repositories[index].language + "</div>";

        repo            = "<div class='repo'>" + html_url + "<div>" + name + language +  "</div>" + description + updated_at + "</a> </div>";

        console.log(repositories[index].owner.login);

        $("#github").append(repo);
    });
};

This is the Github API url

https://api.github.com/users/PirateStef/repos?sort=updated

I've tried to build a function to GET the dribbble data. Using the api.dribbble url below.

http://api.dribbble.com/players/PirateStef/shots/

I'm having trouble getting the "title" from each object.

---

The dribbble code that isn't working

var urlDribbble     = 'http://api.dribbble.com/players/'+username+'/shots/';
var shot;   

$.getJSON(urlDribbble, function(json){
    shots = json;
    outputDribbbleContent();    // Dribbble Content         
}); 

function outputDribbbleContent() {


    $.each(shots, function(index){
        console.log(shots[index].title);
    });
};

gets me 5x undefined

console.log(shots[index]);

gets me this

[
Object
, 
Object
, 
Object
, 
Object
, 
Object
, 
Object
, 
Object
, 
Object
, 
Object
, 
Object
, 
Object
, 
Object
, 
Object
]

Answer 1

I know it's a bit late to the answer but I recently working on some part of dribbble and come to know about these:

'https://api.dribbble.com/v1/users/'+user_id+'/buckets?access_token='+dribbble_access_token

This will provide user buckets data as:

created_at
description
id
name
shots_count
updated_at

Now to get shots you can use:

'https://api.dribbble.com/v1/buckets/'+bucket_id+'/shots?access_token='+dribbble_access_token

or

'https://api.dribbble.com/v1/users/'+user_id+'/shots?access_token='+dribbble_access_token

This will provide 12(default) shots data with all possible resolution images. Though I am still looking to any parameter to manage the limit, i.e, 12 by default.

Ok, I got the solution to set limit as well. The parameter that is to be passed is

per_page

This can receive any numeric value. So my final url is:

'https://api.dribbble.com/v1/users/'+user_id+'/shots?per_page='+limit+'&access_token='+dribbble_access_token

I have used it in a beautiful Multi social tabs module of Joomla by Webkul, have a look at it by following the link then simply check dribble tab there

Answer 2

I've used the jribbble plug-in, this way I don't have to register an app with dribbble.