TP : Les feuilles de style XSL 1 Documents XML et DTD A l issue du TP précédent vous devez disposer d un document XML qui regroupe : la définition des unités, la définition des intervenants, la composition des parcours en semestres et unités, 2 Feuilles de style XSL Objectifs : A partir du document XML (séance précédente) qui décrit les unités d enseignement, les intervenants, les semestres et les parcours du M1, nous allons maintenant produire une page XHTML puis, plus tard, une série de pages. 2.1 Première transformation Construisez une feuille de style XSL permettant de produire une page XHTML qui liste les UE et les informations dont nous disposons (utilisez la commande xsltproc ). Faites en sorte que la page produite soit valide vis à vis de la norme du W3C (utilisez tidy ). Conseil 1 : Prenez soin de concevoir des feuilles de style qui ne sont pas dirigées par les données mais qui, au contraire, choisissent les données et leur traitement. Conseil 2 : Utilisez la clause xsl:output 1 pour produire des documents codés en iso-8859-1 et bien associés à la DTD du XHTML en version stricte. Conseil 3 : structurez votre feuille XSL autour d une règle nommée 2 qui effectue le travail : <xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/xsl/transform" version="1.0"> <xsl:template match="/"> <html><body> <xsl:call-template name="liste-des-unites" /> </body></html> <xsl:template name="liste-des-unites"> construire la liste des unités </xsl:stylesheet> Conseil 4 : N hésitez pas à construire, pour les éléments principaux (UE, intervenant, semestre, etc.), des règles XSL spécifiques pour produire le code XHTML. Conseil 5 : A l aide du script bash ci-dessous augmentez la taille de votre fichier XML : 1. 05-xsl.html#xsl :output 2. 05-xsl.html#regle-nommee 1
#!/bin/bash for((i=1; i<10; i++)); do echo "<UE id= ue-$i >"; echo " "; echo " <ref-intervenant ref= intervenant-$i >"; echo "</UE>"; echo " "; done for((i=1; i<10; i++)); do echo "<intervenant id= intervenant-$i >"; echo " "; echo "</intervenant>"; done exit 0 2.2 Lister les données Étape 1 : ajoutez une règle nommée pour produire les fiches de chaque intervenant avec toutes les informations disponibles (utilisez par exemple un <h2> par intervenant). Étape 2 : Faites en sorte que chaque intervenant ait un identifiant dans le fichier XML (attribut id de type ID). Utilisez cet identifiant et l attribut id du XHTML (sur l élément de votre choix) pour que des ancres soient définies dans votre fichier XHTML. L URL ci-dessous doit pouvoir vous amener directement à la description de l enseignant en question : votre-page.html#identifiant-enseignant Étape 3 : Dans une nouvelle règle nommée, utilisez le principe des ancres pour construire, au début de votre fichier XHTML, une liste des intervenants (avec <ul><li>..</li>..</ul>). Dans chaque élément de cette liste, vous placerez un lien permettant un accès direct à la fiche d un intervenant : <li><a href="#identifiant-de-xyz">xyz</a></li> Étape 4 : Faites la même chose pour les unités d enseignement. Conseil : pour l instant, ne traitez pas finement les champs de desciption contenant du texte enrichi. Vous pouvez simplement construire un paragraphe : <p><xsl:value-of select="string(resume)" /></p> 2.3 Lier les données Modifiez l affichage des unités d enseignement afin que chaque UE soit accompagnée de la liste de ses intervenants. Chaque intervenant sera présenté sous la forme d un lien direct vers sa fiche. Conseil : pour chaque entité susceptible d être la cible d un lien, je vous conseille de mettre en place deux règles : 2
<xsl:template match="intervenant"> produire la fiche d un intervenant <xsl:template match="intervenant" mode="ref"> produire un lien vers la fiche d un intervenant 3 Construire un site Web statique 3.1 Sorties multiples Étape 1 : Consultez la documentation sur XSLT 1.1 3 pour comprendre le fonctionnement de l élément <xsl:document>. Étape 2 : Modifiez votre feuille de style et utilisez cette directive pour produire trois fichiers XHTML : index.html : point d entrée du site, unites.html : description des unités d enseignement, intervenants.html : description des intervenants, Attention : Les liens entre UE et intervenants doivent toujours fonctionner. Étape 3 : En utilisant l élément xsl:for-each 4 de XSL, faites en sorte de produire autant de fichiers XHTML que d unités d enseignement. Étape 4 : Même principe pour les intervenants (une page XHTML par intervenant). 3.2 Traiter les parcours et les semestres Ajoutez à votre feuille XSL la production d une page XHTML par parcours. Ces pages doivent présenter le parcours, sa description, les semestres et mettre en place les liens entre semestres et unités d enseignement. Conseil : N hésitez pas à construire une nouvelle feuille que vous allez ensuite inclure dans la feuille principale (clause xsl:include 5 ). 3.3 Ajouter les liaisons inverses Étape 1 : Ajoutez à la fiche de chaque intervenant, la liste des unités d enseignement qu il assure. Faites en sorte que cette liste soit constituée de liens vers les fiches de ces unités d enseignement. Conseil : Utilisez une variable XSL associée à une expression XPATH qui va, pour chaque intervenant, extraire les UE utiles. Étape 2 : Ajoutez à la fiche de chaque intervenant les liens vers le(s) parcour(s) dont il est le responsable. Étape 3 : Ajoutez à la fiche de chaque UE, la liste des parcours dans lesquels elle apparaît. Faites en sorte que cette liste soit constituée de liens vers les fiches de ces parcours. 3. http://www.w3.org/tr/xslt11/#multiple-output 4. 05-xsl.html#xsl-for-each 5. 05-xsl.html#xsl-include 3
4 Améliorons nos pages 4.1 Traitement du texte enrichi Faites en sorte que les éléments XML qui contiennent du texte enrichi (mélange de texte et d éléments p, b, i, etc.) soient correctement présentés dans vos pages XHTML. 4.2 Ajouter un menu Ajoutez dans chaque page XHTML un menu statique qui permet d accéder à la page d accueil, à la liste des intervenants, à la liste des unités d enseignement. 4.3 Des requêtes XPATH plus compliquées Étape 1 : Commencez par construire une règle nommée avec paramètres pour construire une liste de liens à partir d un ensemble de noeuds : <xsl:template name="faire-une-liste" > <xsl:param name="objets" /> <xsl:param name="nom" /> <!-- produire une liste de liens vers ces objets --> Étape 2 : Utilisez cette règle pour construire la liste des UE de 3 crédits qui se déroulent à Luminy (une seule expression XPATH). Étape 3 : Construire la liste des intervenants qui n enseignent qu à Luminy (une seule expression XPATH). 4.4 Un traitement plus rapide Pour améliorer l efficacité de vos transformations XSL, utilisez la clause xsl:key 6 afin de pouvoir retrouver facilement les UE à partir des identifiants des intervenants. Profitez-en pour lister (avec la règle nommée précédente), les intervenants qui s occupent de trois UE. 5 Transformation XML vers XML Commencez par récupérer le fichier XML décrivant les unités, les parcours et les intervenants du Master Informatique (fichier donnees-master.zip 7 ). A la fin de ce TP, vous avez du concevoir une DTD et un document XML décrivant le Master. Vous pouvez maintenant, à l aide d une feuille de style XSL, enrichir votre description en exploitant les informations qui se trouvent dans le document XML récupéré. Attention, ce document n a pas de structure particulière. Vous devez donc le transformer pour respecter votre DTD. Voila un petit exemple (à titre d illustration) de feuille de style XSL permettant de reconstruire une unité à partir des informations du fichiers XML donné. 6. 05-xsl.html#xsl-key 7. donnees-master.zip 4
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/xsl/transform" version="1.0"> <xsl:output method="xml" indent="yes" /> <xsl:template match="/"> <unites> <xsl:for-each select="//objet[@type = enseignement ]"> <unite> <id><xsl:value-of select="@id"/></id> <nom><xsl:value-of select="info[@nom= nom ]/@value"/></nom> <credits><xsl:value-of select="info[@nom= nb_credits ]/@value"/></credits <resume><xsl:copy-of select="info[@nom= contenu ]/*"/></resume> </unite> </xsl:for-each> </unites> </xsl:stylesheet> 5