Flickr, Galleriffic et jQuery

J'aime plusieurs choses dans la vie, et notamment Flickr, jQuery et un plugin bien sympa : Galleriffic. Ce dernier permet de concevoir des galeries photos assez facilement, à l'aide de balises <ul><li> qui contiennent des liens vers des images (miniatures et "grand format"). Amusons-nous à créer une galerie Flickr avec recherche.

Flickr propose dans son API, via un appel public (ie : sans clé), d'explorer les dernières photos publiées pour un compte sous forme d'un flux, avec différents formats de retour : RSS, Atom, Yaml, CSV, PHP ou JSON. Le flux qui nous intéresse concerne les photos publiques pour un utilisateur, et optionnellement avec un filtre sur des tags précis. Comme tout est dans la page HTML, le retour souhaité sera du JSON pour faciliter le traitement, tout ceci permettra :

• d'effectuer un appel Ajax (JSON-P) vers Flickr sur un user id en filtrant si on le souhaite sur des tags (séparés par des virgules),
• d'effectuer un appel Ajax (JSON-P) vers Yahoo pipes pour obtenir l'userid de l'username à rechercher (cf. ci-après),
• d'avoir en retour la liste des photos au format JSON,
• de construire cette liste sous forme <li>image</li> afin de l'injecter dans Galleriffic

Un exemple d'une URL du flux, pour l'utilisateur zorky (mon compte flickr) et les tags paysages,sunset :

http://api.flickr.com/services/feeds/photos_public.gne?tagmode=any&format=json&tags=paysages,sunset&id=55936300@N00

Malheureusement, Flickr demande l'userid (la chose barbare 55936300@N00) du compte Flickr et il n'est pas possible de préciser directement son username (par exemple zorky) dans l'API (qu'on utilise pour accéder à notre compte Flickr : http://www.flickr.com/photos/zorky), plus facile à retenir pour effectuer des requêtes vers Flickr.

Heureusement, Yahoo pipes est là, et j'ai pu trouver une pipe très bien réalisée pour obtenir l'username à partir d'un userid : j'ai honteusement fait une copie sur mon compte que je vous livre. En gros, le pipes effectue une requête Web sur la page http://www.flickr.com/photos/zorky, repère une balise <link> (pour les flux RSS/Atom) et prend grâce à une regexp, la partie derrière id= qui contient l'userid et nous le renvoie, ingénieux (il existe un site qui propose d'obtenir ce type d'information, mais n'implémente pas de service pour : http://idgettr.com)

Une fois tous ces éléments en notre possession, il ne reste plus qu'à coder notre page d'affichage de photos Flickr avec une recherche sur un compte et avec la possibilité de filtrer sur des tags.

Vous pouvez essayer sur quelques comptes que j'aime bien : le mien zorky, et d'autres : lili_jpeg, tripax, eloyricardez, loomax

La page en iframe :