[XML/DTD/XSL/CSS/HTM] Exemple affichage d'images (tutorial)


Bonjour !

j'avance pas à pas en xml/xsl -> html, dans le but de créer des galeries de photos paramétrées...


[EDIT : je pense que c'est un bon exemple pour avancer en xsl après vous être ingurgité les tutoriels XML/DTD/XSL disponibles sur le net.
Voir solution tutorisée (tutorialisée?) dans le message suivant]

Définition du problème :

pour chaque paragraphe, j'insère un nombre variable d'images :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
 
<!ELEMENT paragraphe (posparag,info,image+,commentaire*)>
<!ATTLIST paragraphe pos_page ID #REQUIRED>
<!ELEMENT info (#PCDATA)>
<!ELEMENT image (#PCDATA)>
<!ATTLIST image l_orig NMTOKEN #REQUIRED h_orig NMTOKEN #REQUIRED>
<!ELEMENT commentaire (auteur,texte,jour,mois,année)>
si je veux retailler les images pour qu'elles s'affichent sur une ligne,
j'ai une solution ($larg_page est la largeur imposée de la page) :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
 
<xsl:variable name="larg_imgs">
  <xsl:value-of select="sum(image/@l_orig)" />
</xsl:variable>
 
<xsl:for-each select="image">
 <img alt="marche pas">
   <xsl:attribute name="src"><xsl:value-of select="." /></xsl:attribute>
   <xsl:attribute name="width"><xsl:value-of select="number(@l_orig * $larg_page div $larg_imgs)" /></xsl:attribute>
   <xsl:attribute name="height"><xsl:value-of select="number(@h_orig * $larg_page div $larg_imgs)" /></xsl:attribute>
  </img>
  <xsl:text> </xsl:text>
</xsl:for-each>
Maintenant, si je veux améliorer cet affichage, et faire en sorte que les images aient la même hauteur, et soient toujours affichés sur une largeur imposée, ça se complique, j'ai maintenant besoin de la somme des rapports hauteur/largeur des images.
et bien sûr, le code suivant serait trop simple :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
 
  <!-- A MARCHE PAS -->
  <xsl:variable name="larg_imgs">
   <xsl:value-of select="sum(image/@l_orig div image/@h_orig)" />
  </xsl:variable>
j'ai essayé pas mal d'autres formulations, jusqu'à recréer une variable node avec en éléments les rapports l/h, mais je ne crois pas avoir le droit d'en calculer la somme :
Code : Sélectionner tout - Visualiser dans une fenêtre à part
1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
  <!-- A MARCHE PAS -->
  <xsl:variable name="test" >
   <racine>
   <xsl:for-each select="image">
    <element>
    <xsl:value-of select="number(@l_orig div @h_orig)" />
    </element>
   </xsl:for-each>
   </racine>
  </xsl:variable>
  <p>
  <xsl:value-of select="sum($test)" />
  </p>
Voilà !

PS :
pour ceux que ça intéresse, à partir de n images, pour les afficher sur sur largeur X, et qu'elles aient la même hauteur sans modifier leur ratio h/l
x'i = (xi / yi ) * (X / (somme[1..n](xi/yi)))
y'i = yi * x'i / xi