Dribbble的API可以调用他们网站上的某些作品，做设计的朋友也许对这个网站非常熟悉，因为这里的作品非常优秀，加入想把他引用到你的网站上，就需要了解他的API有哪些，及如何调用。
推荐一个Dribbble的插件，http://lab.tylergaw.com/jribbble/.这个插件主要是使用官方API的文档来制作的，官方API使用地址：https://dribbble.com/api
;(function($, window, document, undefined) {
'use strict';
$.jribbble = {};
var jsonpGET = function (path, args) {
$.ajax({
type: 'GET',
url: 'http://api.dribbble.com' + path,
data: args[1] || {},
dataType: 'jsonp',
success: function (data) {
if (typeof (data) === 'undefined') {
args[0]({error: true});
}
else {
args[0](data);
}
}
});
};
var methods = {
'getShotById': '/shots/$/',
'getReboundsOfShot': '/shots/$/rebounds/',
'getShotsByList': '/shots/$/',
'getShotsByPlayerId': '/players/$/shots/',
'getShotsThatPlayerFollows': '/players/$/shots/following/',
'getPlayerById': '/players/$/',
'getPlayerFollowers': '/players/$/followers/',
'getPlayerFollowing': '/players/$/following/',
'getPlayerDraftees': '/players/$/draftees/',
'getCommentsOfShot': '/shots/$/comments/',
'getShotsThatPlayerLikes': '/players/$/shots/likes/'
};
var createAPIMethod = function (urlPattern) {
return function () {
var // Convert arguments to a real Array
args = [].slice.call(arguments),
// We run shift() on args here because we don't need to send
// the first argument to jsonpGET.
url = urlPattern.replace('$', args.shift());
jsonpGET(url, args);
};
};
for (var method in methods) {
$.jribbble[method] = createAPIMethod(methods[method]);
}
})(jQuery, window , document);通过以上代码将API分出多种方法。
调用方式
1.获取一个作品
$.jribbble.getShotById(shotId, callback)
shotID:调用作品的ID
callback：当成功响应式，返回一个参数返回请求的回调内容
var callback = function (shot) {
var html = '';
html += '<a href="' + shot.url + '"><img src="' + shot.image_url + '"></a>';
html += '<h3>' + shot.title + '</h3>';
html += '<i>by <a href="' + shot.player.url + '">' + shot.player.name + '</a></i>';
html += '<ul><li><b>Views:</b> ' + shot.views_count + '</li>';
html += '<li><b>Likes:</b> ' + shot.likes_count + '</li>';
html += '<li><b>Comments:</b> ' + shot.comments_count + '</li>';
html += '<li><b>Rebounds:</b> ' + shot.rebounds_count + '</li></ul>';
$('#shot').html(html);
};
$.jribbble.getShotById(914651, callback);
第二种：获取某类列表（popular、everyone、debuts）
$.jribbble.getShotsByList(listName, callback, [pagingOpts])
listName:“popular”, “everyone”, “debuts”
pagingOpts:{page: 1, per_page: 15}
回调函数返回的是对象的合集。
var callback = function (listDetails) {
var html = '';
$.each(listDetails.shots, function (i, shot) {
html += '<li><h3>' + shot.title + '</h3>';
html += '<h4>by ' + shot.player.name + '</h4><a href="' + shot.url + '">';
html += '<img src="' + shot.image_teaser_url + '" ';
html += 'alt="' + shot.title + '"></a></li>';
});
$('#shotsByList').html(html);
}
$.jribbble.getShotsByList('popular', callback, {page: 2, per_page: 10});
