Skip to content

Instantly share code, notes, and snippets.

@Contagious06
Created March 19, 2016 11:35
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save Contagious06/81486fe63e9ad8675e36 to your computer and use it in GitHub Desktop.
Save Contagious06/81486fe63e9ad8675e36 to your computer and use it in GitHub Desktop.
jQuery plugin to integrate a Flickr PhotoStream set into your website.
/*!
* William DURAND <william.durand1@gmail.com>
* MIT Licensed
*
* GistID: 5705453
*
* Usage:
*
* $('.photos').flickrPhotoStream({ id: '12345', setId: '67890' });
*
* $('.photos').flickrPhotoStream({
* id: '12345', // Flickr Id
* setId: '67890', // Flick "Set" Id
* container: '<div />', // wrap the image
* cssClass: 'photos-item' // applied to the image's link
* }).done(function () {});
*
*/
(function (document, $) {
"use strict";
var flickrPhotoStream = function ($el, options) {
var url = [
'http://api.flickr.com/services/feeds/photoset.gne?nsid=',
options.id,
'&set=',
options.setId,
'&format=json&jsoncallback=?'
].join('');
return $.getJSON(url).done(function (data) {
$.each(data.items, function (index, item) {
var link = item.media.m.replace('_m', '_z');
$("<img />")
.attr("src", item.media.m)
.appendTo($el)
.wrap(options.container || '')
.wrap([
'<a href="',
link,
options.cssClass ? '" class="' + options.cssClass : '',
'" title="',
item.title,
'"></a>'
].join(''));
});
});
};
$.fn.flickrPhotoStream = function (options) {
return flickrPhotoStream($(this).get(), options || {});
};
})(document, jQuery);
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment