TP 4

XML — Licence Pro BDISE — 4 janvier 2017

Rappels

Pour transformer arbre.xml en page.html via la feuille transformation.xsl, on utilise la commande suivante:

xsltproc -o page.html transformation.xsl arbre.xml

On pourra utiliser la feuille de style vide fournie.

Exercice 1

  1. Construire la template pour la racine.
  2. On remarque qu'il y a tout d'abord une partie qui lit la liste des enfants et affiche leurs cadeaux.
    • Prévoir ce parcours, soit dans une template pour enfants, soit directement dans la racine.
    • On commence par le cas des enfants sages. La principale difficulté est ici de sélectionner dans la liste des cadeaux (le chameau) les cadeaux correspondant à chaque enfant. Dans ce cas, on va garder le nom de l'enfant dans une variable de sorte à pouvoir comparer lors du parcours de la totalité des cadeaux.
    • On s'occupe ensuite des enfants pas sages. Cette fois, la sélection des cadeaux correspondant à l'enfant se fera par une expression XPath.
  3. On s'intéresse maintenant à la deuxième partie, le parcours du contenu du chargement du chameau.
    • Prévoir ce parcours dans la template de la racine.
    • On va parcourir la liste des boites deux fois. La première fois, on filtre (par une expression XPath) pour n'afficher que les éléments dont le destinataire a été sage. Remarquez que les objets sont classés par poids décroissant...
    • Lors du second parcours, on adapte le filtre pour ne considérer que les enfants passages. Notez qu'ici on veut un ordre alphabétique sur les références.
    • En bonus: avec une expression XPath, on veut obtenir le poids total de tous les cadeaux à remplacer par du charbon.
  4. Vous pouvez maintenant décommenter dans le xml la ligne qui référence la feuille de style.

Exercice 2

On va travailler sur le contenu de l'archive petit_prince.tar.gz. Pour la décompresser: tar -xvzf petit_prince.tar.gz

Le but de l'exercice est de définir une feuille de style XSLT qui transforme le fichier petit_prince.xml vers un fichier HTML qui présente les données comme dans cet exemple.

Préambule
  • La structure de petit_prince.xml respecte PRESQUE la DTD fournie. Trouver l'erreur et modifier le XML en conséquence. En profiter pour ajouter votre nom, la date... Enregistrer et vérifier que la DTD est désormais respectée.
  • Récupérer la feuille de style vide. Remplir la template de la racine. On pensera bien à lier la feuille de style fournie. Sauvegarder et nommer le fichier .xsl.
Échauffement: les images
On va commencer par le traitement des images. On remarque dans la DTD que l'élément image peut se trouver soit sous la racine, soit dans les informations sur le texte, soit, enfin, dans le corps du texte.
  • Construire une template pour le cas où l'image est dans le corps du texte. On veut que l'élément img dans le HTML produit ait les attributs (obligatoires) suivants: src, qui indique l'URL de l'image, et alt, qui indique le texte affiché s'i l'URL de src n'a pu être chargé. Le contenu du alt est le contenu de l'élément image d'origine ou un texte par défaut (voir exemple).
  • Dans le cas où l'image est directement à la racine, on insère la même chose que dans le cas précédent, mais dans un div de classe illustration. On s'attachera ici à minimiser les recopies de code!
  • Faire de même avec le cas des images dans info_texte, cette fois en l'encadrant d'un div de classe couverture.
L'entête
L'entete du document XML contient les informations sur l'ouvrage et sur l'exercice.
  • Modifier le XML pour faire apparaître votre nom et la date du jour.
  • Transformer info_texte en un titre de la page (dans un div de classe titre).
  • Transformer info_corpus en un entête informatif (dans un div de classe titre).
Traitement du corps du texte — Les paragraphes
On s'intéresse à la mise en forme des paragraphes.
  • Faire en sorte que chaque paragraphe se trouve dans un élément <p>...</p>.
  • Faire en sorte que chaque phrase se trouve dans un élément <span>...</span> dont la class sera la langue du paragraphe.
  • Chaque phrase sera séparée de la suivante par un saut de ligne <br/>. [Bonus: pas de <br/> après la dernière phrase du paragraphe.]
  • Faire en sorte que le mot "mouton" ("beranka" ou "beranek" en tchèque) soit dans un <span>...</span> de class "mouton".
Traitement du corps du texte — Les dialogues
On va maintenant mettre en forme les dialogues.
  • Les dialogues seront présentés sous le forme d'un tableau. Dans la cellule de gauche, le nom du locuteur. On pourra faire en sorte de l'écrire "joliement" (transformer par exemple "LePetitPrince" en "Le Petit Prince").
  • Encore une fois, indiquer la langue du dialogue dans un span; mettre également un saut de ligne entre les phrases.