Skip to content

Instantly share code, notes, and snippets.

@bbrochier
Last active February 6, 2017 08:12
Show Gist options
  • Save bbrochier/2db627ea83029d803e72 to your computer and use it in GitHub Desktop.
Save bbrochier/2db627ea83029d803e72 to your computer and use it in GitHub Desktop.
Social Feeds
<!DOCTYPE html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Social Data</title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/screen.css">
<script src="js/vendor/modernizr-2.6.2.min.js"></script>
</head>
<body>
<table>
<tr>
<th colspan="2">Facebook</th>
</tr>
<tr>
<td>Likes</td>
<td class="fb-likes"></td>
</tr>
<tr>
<th colspan="2">Youtube</th>
</tr>
<tr>
<td>Channel views</td>
<td class="yt-views"></td>
</tr>
<tr>
<td>Channel subscribers</td>
<td class="yt-subscribers"></td>
</tr>
<tr>
<td>Channel videos</td>
<td class="yt-uploads"></td>
</tr>
<tr>
<th colspan="2">Google+</th>
</tr>
<tr>
<td>Views</td>
<td class="gp-views"><a href="http://goo.gl/rNtppE">non dispo</a></td>
</tr>
<tr>
<td>Followers</td>
<td class="gp-followers"></td>
</tr>
<tr>
<th colspan="2">Pinterest</th>
</tr>
<tr>
<td>Pins</td>
<td class="pt-pins"></td>
</tr>
<tr>
<td>Followers</td>
<td class="pt-followers"></td>
</tr>
<tr>
<th colspan="2">Instagram</th>
</tr>
<tr>
<td>Media</td>
<td class="inst-media"></td>
</tr>
<tr>
<td>Followers</td>
<td class="inst-followers"></td>
</tr>
<tr>
<th colspan="2">Flickr</th>
</tr>
<tr>
<td>Photos</td>
<td class="fl-photos"></td>
</tr>
<tr>
<td>Albums</td>
<td class="fl-photoSet"></td>
</tr>
<tr>
<td>Followers</td>
<td class="fl-followers">seulement 3</td>
</tr>
</table>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script>window.jQuery || document.write('<script src="js/vendor/jquery-1.10.2.min.js"><\/script>')</script>
<script src="js/plugins.js"></script>
<script src="js/front.js"></script>
</body>
</html>
(function ($, window, document, undefined) {
'use strict';
$(function () {
/* Settings
========================================================================== */
var facebookPage = "XXXXXX",
youtubeUser = "XXXXXX",
googlePlusId = "XXXXXX",
googlePlusKey = "XXXXXX",
pinterestUser = "XXXXXX",
instagramUserId = "XXXXXX",
instagramToken = "XXXXXX",
flickrUserId = "XXXXXX",
flickrApiKey = "XXXXXX";
/* Facebook
========================================================================== */
$.getJSON('https://graph.facebook.com/'+facebookPage+'?callback=?', function(data) {
var fb_count = data['likes'].toString();
fb_count = add_space(fb_count);
// Display
$('.fb-likes').html(fb_count);
});
/* Youtube
========================================================================== */
$.getJSON('http://gdata.youtube.com/feeds/api/users/'+youtubeUser+'?alt=json', function(data) {
// views count
var ytViewsCount = data.entry.yt$statistics.totalUploadViews;
ytViewsCount = add_space(ytViewsCount);
// subscribers count
var ytSubscriberCount = data.entry.yt$statistics.subscriberCount;
ytSubscriberCount = add_space(ytSubscriberCount);
// uploads count
var ytUploadCount = data.entry.gd$feedLink[4].countHint;
ytUploadCount = add_space(ytUploadCount);
// Display
$('.yt-views').html(ytViewsCount);
$('.yt-subscribers').html(ytSubscriberCount);
$('.yt-uploads').html(ytUploadCount);
});
/* Google+
========================================================================== */
$.getJSON('https://www.googleapis.com/plus/v1/people/'+googlePlusId+'?key='+googlePlusKey, function(data) {
// followers count
var gpSubscriberCount = data.circledByCount;
gpSubscriberCount = add_space(gpSubscriberCount);
// Display
$('.gp-followers').html(gpSubscriberCount);
});
/* Instagram
========================================================================== */
$.ajax({
url: 'https://api.instagram.com/v1/users/'+instagramUserId+'/?access_token='+instagramToken,
dataType: 'jsonp',
success: function(data){
// media count
var instMediaCount = data.data.counts.media;
instMediaCount = add_space(instMediaCount);
// followers count
var instFollowerCount = data.data.counts.followed_by;
instFollowerCount = add_space(instFollowerCount);
// // Display
$('.inst-media').html(instMediaCount);
$('.inst-followers').html(instFollowerCount);
}
});
/* Flickr
========================================================================== */
$.getJSON('https://api.flickr.com/services/rest/?method=flickr.people.getInfo&api_key='+flickrApiKey+'&user_id='+flickrUserId+'&format=json&nojsoncallback=1', function(data) {
// photo count
var flPhotoCount = data.person.photos.count._content;
flPhotoCount = add_space(flPhotoCount);
// Display
$('.fl-photos').html(flPhotoCount);
});
$.getJSON('https://api.flickr.com/services/rest/?method=flickr.photosets.getList&api_key='+flickrApiKey+'&user_id='+flickrUserId+'&format=json&nojsoncallback=1', function(data) {
// album(photoset) count
var flPhotoSetCount = data.photosets.total;
flPhotoSetCount = add_space(flPhotoSetCount);
// Display
$('.fl-photoSet').html(flPhotoSetCount);
});
/* Pinterest (http://stackoverflow.com/questions/9951045/pinterest-api-documentation)
========================================================================== */
$.ajax({
url: 'https://api.pinterest.com/v3/pidgets/users/'+pinterestUser+'/pins/',
dataType: 'jsonp',
success: function(data){
// pins count
var ptPinCount = data.data.pins[0].pinner.pin_count;
ptPinCount = add_space(ptPinCount);
// followers count
var ptFollowerCount = data.data.pins[0].pinner.follower_count;
ptFollowerCount = add_space(ptFollowerCount);
// Display
$('.pt-pins').html(ptPinCount);
$('.pt-followers').html(ptFollowerCount);
}
});
/* Twitter (https://dev.twitter.com/rest/reference/get/users/show)
========================================================================== */
});
})(jQuery, window, document);
/* Add a space every 3 decimals '1293847' => '1 293 847'
========================================================================== */
function add_space(number) {
if (number.length > 3) {
var mod = number.length % 3;
var output = (mod > 0 ? (number.substring(0,mod)) : '');
for (var i=0 ; i < Math.floor(number.length / 3); i++) {
if ((mod === 0) && (i === 0)) {
output += number.substring(mod+ 3 * i, mod + 3 * i + 3);
} else {
output+= ' ' + number.substring(mod + 3 * i, mod + 3 * i + 3);
}
}
return (output);
} else {
return number;
}
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment