Dans cet article, nous mettons à profit plusieurs facilités du langage Groovy, afin de réaliser un diaporama dont les images proviendront du site de partage de photos Flickr, et qui sera visionné dans une page web.
Plus précisément, nous utiliserons l'API de Flickr pour récupérer les URL des photos placées sur un compte particulier de Flickr, puis générerons une page web grâce à un builder de Groovy, et enfin, aurons recours à la librairie Lytebox pour visionner l'ensemble des photos dans un superbe diaporama.
Interroger les services de Flickr avec Groovy XMLRPC
Les services de Flickr peuvent être invoquées au travers de différents types de format dont le format XML-RPC ; en outre, pour invoquer les méthodes de ces services, il faut disposer d'une clé API qui s'obtient auprès du site Flickr.
Grâce à la classe XMLRPCServerProxy du module Groovy XMLRPC (à installer séparément), nous pouvons exécuter des appels distants, au format XML-RPC et avec une syntaxe très claire, vers l'URL de l'API Flickr http://api.flickr.com/services/xmlrpc/.
Comme nous voulons obtenir la description des photos présentes sur un compte Flickr particulier, le premier appel à l'API Flickr consiste à récupérer l'ID (le NSID) correspondant à un nom d'utilisateur donné, au moyen de la méthode flickr.people.findByUsername :
def flickr = new XMLRPCServerProxy("http://api.flickr.com/services/xmlrpc/")
def utilisateur = flickr.'flickr.people.findByUsername'(api_key: 'votre_cle_api_ici', username: 'Bertrand Goetzmann')
Notez que le premier argument de la méthode flickr.people.findByUsername doit être la clé API Flickr, et le second, le nom de l'utilisateur ; par ailleurs les simples guillemets entourant le nom de la méthode ne sont pas nécessaires : nous les avons ajouté pour plus de lisibilité.
De manière élégante, le module Groovy XMLRPC se charge de créer la requête XML-RPC et d'invoquer la méthode cible flickr.people.findByUsername via HTTP.
Le résultat de la requête étant une chaîne de caractères au format XML, nous aurons recours à une autre classe très puissante de Groovy, qui est la classe XmlSlurper, pour extirper le NSID de l'utilisateur Flickr ; celui-ci est renvoyé dans l'attribut nsid de l'élément document de la réponse XML :
Maintenant, avec cet identifiant, nous pouvons demander la liste des photos publiques de cet utilisateur, en appelant la méthode flickr.people.getPublicPhotos :
La variable photos contiendra alors, sous la forme d'une chaîne de caractères, un document XML décrivant un ensemble de photos, avec toutes les données permettant de construire des URL vers ces photos.
Générer une page web utilisant Lytebox, avec le builder MarkupBuilder
Lytebox fait partie de ces librairies JavaScript qui vous permettent de mettre en place un diaporama très facilement dans une page web ; Lytebox a la particularité, selon votre choix, d'autoriser ou non un défilement automatique des images.
Selon les indications de Lytebox, nous allons générer une page web à l'aide du builder Groovy MarkupBuilder :
photos = new XmlSlurper().parseText(photos)
def writer = new StringWriter()
def builder = new MarkupBuilder(writer)
builder.html {
head() {
script(src: 'lytebox.js', type: 'text/javascript') {
mkp.yield('')
}
link(rel: 'stylesheet', href: 'lytebox.css', type: 'text/css', media: 'screen')
}
body() {
// Pour chaque photo
photos.photo.each() {
a(href: "http://farm${it.@farm}.static.flickr.com/${it.@server}/${it.@id}_${it.@secret}.jpg", rel: 'lyteshow[images]', title: "${it.@title}", 'Test')
}
}
}
Dans ce code, nous avons utilisé un objet StringWriter servant à contenir le code généré, qui peut être récupéré par un appel à writer.toString(). Il est bien sûr aussi possible de générer le code HTML dans un fichier avec l'utilisation d'un objet FileWriter à la place de l'objet StringWriter.
Noter aussi que dans l'appel à script pour produire l'élément HTML script, la closure employée fait un appel à mkp.yield(''), ce qui permet de forcer une ouverture et une fermeture de la balise script (sans cela la page ne fonctionnerait pas).
Pour chaque photo, nous générons un lien HTML a avec une référence vers l'image dont l'URL est construite dans une chaîne Groovy GString ; l'attribut rel est défini avec une valeur fixe, ce qui permet de lier l'ensemble des images dans le même diaporama.
Le code HTML ainsi produit nécessite bien sûr la librairie de Lytebox pour fonctionner. Le code présenté ici pourrait aussi bien être repris dans une application Grails, le code HTML étant généré par la méthode render d'un contrôleur.
Vous trouverez deux fichiers joints à cet article : le code source présenté ici, et un fichier HTML comme exemple de page web générée.
| Fichier attaché | Taille |
|---|---|
| code.groovy.txt | 1.05 Ko |
| test.html.txt | 3.17 Ko |