XSL pour afficher le XML en HTML

Version imprimable

02/11/2011, 10h31
demanghonj

XSL pour afficher le XML en HTML

Bonjour,

j'ai un contenu XML que je souhaite afficher en HTML. J'aimerai que l'affichage me permette de masquer ou afficher les noeuds avec une coloration syntaxique.

Je me suis donc naturellement tourné vers XSLT pour transformer mon XML en HTML. Après plusieurs recherche sur internet je ne trouve des exemples que sur une transformation avec un affichage particulier. Mais je n'ai pas trouvé de fichier XSL qui me permettent d'afficher un contenu XML en HTML avec un coloration syntaxique.

Ceci me parait quand même bizarre que personne n'a fait ce genre de chose. Donc avant de me lancer dessus je demande si il y a un existant.

Ma question est donc la suivante;

Y-a t-il un site référençant les fichiers XSL les plus utilisés ou un qui me permette d'afficher un XML en HTML ?

Merci
02/11/2011, 11h36
polymorphisme

Bonjour,

il y a syntaxhighlighter qui est souvent utilisé. :)
02/11/2011, 12h42
demanghonj

Ca a l'air bien mais il ne permet pas de masquer certains nœuds comme un arbre.
02/11/2011, 12h49
polymorphisme

Oui en effet. Ce que tu cherche est tout de même assez particulier ! Donne nous des nouvelles.
04/11/2011, 15h04
caballo

juste comme ça j'avais également cherché le même outil il y a quelques temps (avec le pb des noeuds) sans succès malheureusement... :(
04/11/2011, 15h25
polymorphisme

Bonjour demanghonj,

si tu as vraiment besoin d'un tel outil, pourquoi ne pas le programmer ? :D

Avant de le programmer je voulais savoir si ça existait.

J'ai commencé a faire un feuille xsl pour transformer mon xml en HTML. Petite précision mon XML correspond à une requete SOAP.

Mais je recontre déjà un problème:

J'ai attribut nommé: xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"

et quand je parcours mes attributs avec l'expression "@*" il ne me renvoie pas cette attribut. EN fait tout ceux qui commence par "xmlns:".

Y a t-il une expression en particulier ? J'ai cherché mais sans résultats.

Voici ma requete SOAP:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
 
<soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" toto="toto">
  <soap:Body>
    <ns1:recupererIdentifiantsResponse xmlns:ns1="http://ws.scu.pagesjaunes.fr">
      <ns1:ReponseCoordonneesDTO>
        <coordonnees xmlns="http://reponse.dto.ws.scu.pagesjaunes.fr">
          <ns2:CoordonneeDTO xmlns:ns2="http://dto.ws.scu.pagesjaunes.fr">
            <mailOuPortable xmlns="http://dto.ws.scu.pagesjaunes.fr">...</mailOuPortable>
            <uid xmlns="http://dto.ws.scu.pagesjaunes.fr">...</uid>
          </ns2:CoordonneeDTO>
        </coordonnees>
        <retour xmlns="http://reponse.dto.ws.scu.pagesjaunes.fr">
          <codeRetour xmlns="http://retour.dto.ws.scu.pagesjaunes.fr">SUCCES</codeRetour>
          <erreurSpecifique xmlns="http://retour.dto.ws.scu.pagesjaunes.fr" xsi:nil="true"/>
          <message xmlns="http://retour.dto.ws.scu.pagesjaunes.fr" xsi:nil="true"/>
        </retour>
      </ns1:ReponseCoordonneesDTO>
    </ns1:recupererIdentifiantsResponse>
  </soap:Body>
</soap:Envelope>

et voici ma feuille de style xls:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
 
<xsl:stylesheet
    xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
    xmlns="http://www.w3.org/TR/REC-html40"
    version="1.0">
 
    <xsl:template match="/">
 <DIV class="xml-conteneur">
    <xsl:apply-templates/>
 </DIV>
 </xsl:template>
 
   <xsl:template match="*">
      <DIV class="e">
         <DIV STYLE="margin-left:1em;text-indent:-2em">
            <SPAN class="b">
                <xsl:text> </xsl:text>
            </SPAN>
            <SPAN class="m"><xsl:text disable-output-escaping="yes">&lt;</xsl:text></SPAN>
            <SPAN>
               <xsl:attribute name="class">
                  <xsl:if test="xsl:*">
                     <xsl:text>x</xsl:text>
                  </xsl:if>
                  <xsl:text>t</xsl:text>
               </xsl:attribute>
               <xsl:value-of select="name(.)"/>
               <xsl:if test="@*">
                  <xsl:text> </xsl:text>
               </xsl:if>
            </SPAN>
            <xsl:for-each select="@*">
               <xsl:text>ok</xsl:text>
               <xsl:value-of select="name(.)"/>
               <xsl:text>="</xsl:text>
               <xsl:value-of select="."/>
               <xsl:text>" </xsl:text>
            </xsl:for-each>
            <SPAN class="m">
               <xsl:text disable-output-escaping="yes">/&gt;</xsl:text>
            </SPAN>
         </DIV>
      </DIV>
   </xsl:template>
 
</xsl:stylesheet>

et voici mon rendu actuel:

Code:

1
2
3
4
5
6
7
8
9
10
 
<DIV xmlns="http://www.w3.org/TR/REC-html40" class="xml-conteneur">
  <DIV class="e">
    <DIV STYLE="margin-left:1em;text-indent:-2em">
      <SPAN class="b"> </SPAN>
      <SPAN class="m"><</SPAN>
      <SPAN class="t">soap:Envelope </SPAN>oktoto="toto" <SPAN class="m">/></SPAN>
    </DIV>
  </DIV>
</DIV>

Citation:

Envoyé par demanghonj

Avant de le programmer je voulais savoir si ça existait.

C'est compréhensible. Mais pour l'instant les gens qui sont passés par ici n'en connaissent pas.

Citation:

Envoyé par demanghonj

J'ai commencé a faire un feuille xsl pour transformer mon xml en HTML. Petite précision mon XML correspond à une requete SOAP.

XSLT n'est pas vraiment un bon outil pour ça. Bon, sur du SOAP, c'est faisable, mais c'est galère quand même.

Citation:

Envoyé par demanghonj

Mais je recontre déjà un problème:

J'ai attribut nommé: xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"

et quand je parcours mes attributs avec l'expression "@*" il ne me renvoie pas cette attribut. EN fait tout ceux qui commence par "xmlns:".

Y a t-il une expression en particulier ? J'ai cherché mais sans résultats.

Ce ne sont pas des attributs, ce sont des déclarations de namespace.
C'est géré bizarrement par XSLT, et pas toujours bien géré par les moteurs qui existent.

Voici un template qui va donner le préfixe et l'URI de toutes les déclarations de namespaces d'un élément :
Code:

1 2 3 4 5 6 7 <xsl:template match="*"> <xsl:value-of select="concat('Namespaces de ', name(), ' : 
')"/> <xsl:for-each select="namespace::*"> <xsl:value-of select="concat('Préfixe : ', name(), ' ; ')"/> <xsl:value-of select="concat('URI : ', ., '
')"/> </xsl:for-each> </xsl:template>
Mais il y a deux problèmes :
-#1 : Il existe un namespace, de préfixe "xml:", qui est implicitement déclaré dans tous les documents xml, même sans rien faire.
et namespace::* va forcément le sélectionner aussi, alors qu'on ne le veut pas vraiment.
=> Solution : remplacer namespace::* par

Code:

namespace::*[name() != 'xml']

-#2 : Tous les éléments XML héritent des namespaces déclarés par leurs ascendants. Autrement dit, pour tous tes éléments, namespace::* va toujours leur sélectionner le namespace SOAP, même s'il n'est déclaré que sur la racine.

=> Solution : vérifier si un namespace n'est pas déjà déclaré pour le parent, avant de le traiter.
Ça donne:
Code:

1 2 3 4 5 6 7 8 9 10 <xsl:template match="*"> <xsl:value-of select="concat('Namespaces de ', name(), ' : 
')"/> <xsl:variable name="parent" select=".."/> <xsl:for-each select="namespace::*[name() != 'xml']"> <xsl:if test="not($parent/namespace::*[name(.) = name(current()) and . = current()])"> <xsl:value-of select="concat('Préfixe : ', name(), ' ; ')"/> <xsl:value-of select="concat('URI : ', ., '
')"/> </xsl:if> </xsl:for-each> </xsl:template>
Conclusion : XSLT c'est quand même pas franchement prévu pour ça. Là c'est tout juste faisable.

04/11/2011, 19h43
demanghonj

Déjà merci pour ta réponse plus que précise.

Etant un développeur Java, me conseilles tu de tout faire en java ?

Car là je ne suis que au début de mon fichier XSL et j'ai peur que les problèmes continues et que cela devienne impossible en XSL.
04/11/2011, 23h59
thelvin

Citation:

Envoyé par demanghonj

Etant un développeur Java, me conseilles tu de tout faire en java ?

Eh bien... C'est un choix difficile.

- Faire un parseur XML est compliqué dans n'importe quel langage, Java compris.

- Bien que ça ne soit pas prévu pour, c'est au moins possible de faire ça en XSLT pour des documents SOAP. Parce que le SOAP n'a généralement pas de déclaration XML, de DOCTYPE, de référence d'entité, ou d'autres choses ignorées par XSLT.

- Il serait aussi possible de le faire avec SAX, DOM ou JDOM de Java. Ils ne gèrent pas non plus déclaration XML, entités ou ce genre de choses, comme XSLT. Mais leur gestion des namespaces et des échappements est plus simple. En fait, il devrait être possible de s'inspirer du code source du XMLOutputter de JDOM pour faire ça. Dans ce cas-là il faudra respecter la license de JDOM mais elle est permissive. Moi c'est ce que je ferais. Mais c'est pas simple simple.
05/11/2011, 12h24
tsuji

[0] Pour ce genre de transformation général, on peut toujours tirer des leçons de ceux qui sont faites ie et ff. Il peut se faire comme des implémentation de base.

[0.1] Pour ie, on peut trouver le document xsl mis au travail par défault ici:
http://www.dpawson.co.uk/xsl/sect4/N10301.html
http://www.dpawson.co.uk/xsl/sect2/m...html#d6894e227
Cela devrait rester assez stable en gros quoique ce soit là depuis IE5. Aussi remarquez qu'il ne rend pas les déclarations de namespace. Il faut le supplémenter vous-mêmes. Il ne marche pas bien entendu en firefox.

[0.2] Pour ff, on peut le tirer avec comme cela:
chrome://global/locale/xml/XMLPrettyPrint.xsl
chrome://global/locale/xml/prettyprint.dtd
chrome://global/locale/global.dtd
Mais je n'ai pas trouvé où se trouve les fonctions javascript pour faire expansion et contraction.

[1] Je connais un projet similaire pour wsdl. C'est le projet wsdl-viewer, maintenant passé à l'hospice d'Apache.
http://code.google.com/p/wsdl-viewer/
Le document xsl est affiché aussi là:
http://tomi.vanek.sk/xml/wsdl-viewer.xsl
Mais le document ce que je viens de télécharger pour vérifier, il y a typos à deux endroits qu'il faut corriger à la main - ce n'est pas très grave.

Salut tsuji,

Déjà merci pour ta réponse.

j'ai regardé tes 3 solutions. Je pense que je vais prendre le fichier XMLPrettyPrint.xsl pour faire ma transformation. J'ai testé la transformation avec mon code Java et ça marche presque. Le seul petit souci est que le namespace "xmlns" n'est pas pris en compte par contre celui du "xsi" oui.

le résultat ressemble donc à:
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 <soap:Envelope toto="toto"> <soap:Body> <ns1:recupererIdentifiantsResponse> <ns1:ReponseCoordonneesDTO> <coordonnees> <ns2:CoordonneeDTO> <mailOuPortable>...</mailOuPortable> <uid>...</uid> </ns2:CoordonneeDTO> </coordonnees> <retour> <codeRetour>SUCCES</codeRetour> <erreurSpecifique xsi:nil="true"/> <message xsi:nil="true"/> </retour> </ns1:ReponseCoordonneesDTO> </ns1:recupererIdentifiantsResponse> </soap:Body> </soap:Envelope>
Il manque donc tous les attributs du namespace "xmlns".
Je vais donc essayer de regarder ça avec mon peu de connaissance en xsl et ce que m'a dit . Je vous tient au courant et surtout je vous demanderais votre avis sur mon fichier xsl.

Merci pour votre contribution.

07/11/2011, 16h59
thelvin

Citation:

Envoyé par demanghonj

Le seul petit souci est que le namespace "xmlns" n'est pas pris en compte par contre celui du "xsi" oui.

Pas du tout la même chose.
Les xsi:machin sont des attributs normaux qui ont un namespace, dont le préfixe est xsi.
Les xmlns:truc ne sont pas des attributs. Ce sont des déclarations de namespace.

Citation:

Envoyé par demanghonj

Il manque donc tous les attributs du namespace "xmlns".

Oui, et c'est effectivement l'une des choses chiantes comme la mort quand on veut faire ce genre de choses en XSLT.

Bonjour tout le monde,

J'ai réussi ma fonctionnalité au complet. Je me suis basé sur un fichier XSL existant capable d'afficher mon XML (SOAP) en HTML, avec une coloration syntaxique, gérant les namespaces.

Voici le lien vers ce fichier : http://opensource.apple.com/source/l...o/verbatim.xsl

Cette fiche XSL marche vraiment bien. Par contre il me manquait le plier/déplier de mes noeuds XML.

J'ai donc modifié le fichier pour prendre en compte ce code dont voici la source :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
286
287
288
289
290
291
292
293
294
295
296
297
298
299
300
301
302
303
304
305
306
307
308
309
310
311
312
313
314
315
316
317
318
319
320
321
322
323
324
325
326
327
328
329
330
331
332
333
334
335
336
337
338
339
340
341
342
343
344
345
346
347
348
349
350
351
352
353
354
355
356
357
358
359
360
361
362
363
 
<?xml version="1.0" encoding="ISO-8859-1"?>
 
<!--
    XML to HTML Verbatim Formatter with Syntax Highlighting
    Version 1.1
    Contributors: Doug Dicks, added auto-indent (parameter indent-elements)
                  for pretty-print
 
    Copyright 2002 Oliver Becker
    ob@obqo.de
 
    Licensed under the Apache License, Version 2.0 (the "License"); 
    you may not use this file except in compliance with the License.
    You may obtain a copy of the License at http://www.apache.org/licenses/LICENSE-2.0
    Unless required by applicable law or agreed to in writing, software distributed
    under the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR 
    CONDITIONS OF ANY KIND, either express or implied. See the License for the
    specific language governing permissions and limitations under the License.
 
    Alternatively, this software may be used under the terms of the 
    GNU Lesser General Public License (LGPL).
-->
 
<xsl:stylesheet version="1.0"
                xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
                xmlns:verb="http://informatik.hu-berlin.de/xmlverbatim"
                exclude-result-prefixes="verb">
 
   <xsl:output method="html" omit-xml-declaration="yes" indent="no"/>
 
   <xsl:param name="indent-elements" select="false()" />
   <xsl:param name="tree-browser" select="false()" />
 
   <xsl:template match="/">
      <xsl:apply-templates select="." mode="xmlverb" />
   </xsl:template>
 
   <!-- root -->
   <xsl:template match="/" mode="xmlverb">
      <xsl:text>&#xA;</xsl:text>
      <xsl:comment>
         <xsl:text> converted by xmlverbatim.xsl 1.1, (c) O. Becker </xsl:text>
      </xsl:comment>
      <xsl:text>&#xA;</xsl:text>
      <div class="xmlverb-default">
         <xsl:apply-templates mode="xmlverb">
            <xsl:with-param name="indent-elements" select="$indent-elements" />
            <xsl:with-param name="tree-browser" select="$tree-browser" />
         </xsl:apply-templates>
      </div>
      <xsl:text>&#xA;</xsl:text>
   </xsl:template>
 
   <!-- wrapper -->
   <xsl:template match="verb:wrapper">
      <xsl:apply-templates mode="xmlverb">
         <xsl:with-param name="indent-elements" select="$indent-elements" />
         <xsl:with-param name="tree-browser" select="$tree-browser" />
      </xsl:apply-templates>
   </xsl:template>
 
   <xsl:template match="verb:wrapper" mode="xmlverb">
      <xsl:apply-templates mode="xmlverb">
         <xsl:with-param name="indent-elements" select="$indent-elements" />
         <xsl:with-param name="tree-browser" select="$tree-browser" />
      </xsl:apply-templates>
   </xsl:template>
 
   <!-- element nodes -->
   <xsl:template match="*" mode="xmlverb">
      <xsl:param name="indent-elements" select="false()" />
      <xsl:param name="tree-browser" select="false()" />
      <xsl:param name="indent" select="''" />
      <xsl:param name="indent-increment" select="'&#xA0;&#xA0;&#xA0;'" />
      <xsl:if test="$tree-browser">
        <xsl:text disable-output-escaping="yes">&lt;span class=&quot;tree-container&quot; &gt;</xsl:text>
      </xsl:if>
      <xsl:if test="$indent-elements">
        <br/>
        <xsl:value-of select="$indent" />
      </xsl:if>
      <xsl:if test="$tree-browser">
          <xsl:choose>
              <xsl:when test="*">
                <xsl:call-template name="tree-expander" />
              </xsl:when>
              <xsl:otherwise>
                <xsl:call-template name="tree-spacer" />
              </xsl:otherwise>
          </xsl:choose>
      </xsl:if>
      <xsl:text>&lt;</xsl:text>
      <xsl:variable name="ns-prefix"
                    select="substring-before(name(),':')" />
      <xsl:if test="$ns-prefix != ''">
         <span class="xmlverb-element-nsprefix">
            <xsl:value-of select="$ns-prefix"/>
         </span>
         <xsl:text>:</xsl:text>
      </xsl:if>
      <span class="xmlverb-element-name">
         <xsl:value-of select="local-name()"/>
      </span>
      <xsl:variable name="pns" select="../namespace::*"/>
      <xsl:if test="$pns[name()=''] and not(namespace::*[name()=''])">
         <span class="xmlverb-ns-name">
            <xsl:text> xmlns</xsl:text>
         </span>
         <xsl:text>=&quot;&quot;</xsl:text>
      </xsl:if>
      <xsl:for-each select="namespace::*">
         <xsl:if test="not($pns[name()=name(current()) and 
                           .=current()])">
            <xsl:call-template name="xmlverb-ns" />
         </xsl:if>
      </xsl:for-each>
      <xsl:for-each select="@*">
         <xsl:call-template name="xmlverb-attrs" />
      </xsl:for-each>
      <xsl:choose>
         <xsl:when test="node()">
            <xsl:text>&gt;</xsl:text>
            <xsl:apply-templates mode="xmlverb">
              <xsl:with-param name="indent-elements"
                              select="$indent-elements"/>
              <xsl:with-param name="indent"
                              select="concat($indent, $indent-increment)"/>
              <xsl:with-param name="indent-increment"
                              select="$indent-increment"/>
              <xsl:with-param name="tree-browser"
                              select="$tree-browser"/>
            </xsl:apply-templates>
            <xsl:if test="* and $indent-elements">
               <br/>
               <xsl:value-of select="$indent" />
            </xsl:if>
            <xsl:if test="* and $tree-browser">
                <xsl:call-template name="tree-spacer" />
            </xsl:if>
            <xsl:text>&lt;/</xsl:text>
            <xsl:if test="$ns-prefix != ''">
               <span class="xmlverb-element-nsprefix">
                  <xsl:value-of select="$ns-prefix"/>
               </span>
               <xsl:text>:</xsl:text>
            </xsl:if>
            <span class="xmlverb-element-name">
               <xsl:value-of select="local-name()"/>
            </span>
            <xsl:text>&gt;</xsl:text>
            <xsl:if test="$tree-browser">
                <xsl:text disable-output-escaping="yes">&lt;/span&gt;</xsl:text>
            </xsl:if>
         </xsl:when>
         <xsl:otherwise>
            <xsl:text> /&gt;</xsl:text>
            <xsl:if test="$tree-browser">
               <xsl:text disable-output-escaping="yes">&lt;/span&gt;</xsl:text>
            </xsl:if>
         </xsl:otherwise>
      </xsl:choose>
      <xsl:if test="not(parent::*)">
          <br /><xsl:text>&#xA;</xsl:text>
      </xsl:if>
   </xsl:template>
 
   <!-- attribute nodes -->
   <xsl:template name="xmlverb-attrs">
      <xsl:text> </xsl:text>
      <span class="xmlverb-attr-name">
         <xsl:value-of select="name()"/>
      </span>
      <xsl:text>=&quot;</xsl:text>
      <span class="xmlverb-attr-content">
         <xsl:call-template name="html-replace-entities">
            <xsl:with-param name="text" select="normalize-space(.)" />
            <xsl:with-param name="attrs" select="true()" />
         </xsl:call-template>
      </span>
      <xsl:text>&quot;</xsl:text>
   </xsl:template>
 
   <!-- namespace nodes -->
   <xsl:template name="xmlverb-ns">
      <xsl:if test="name()!='xml'">
         <span class="xmlverb-ns-name">
            <xsl:text> xmlns</xsl:text>
            <xsl:if test="name()!=''">
               <xsl:text>:</xsl:text>
            </xsl:if>
            <xsl:value-of select="name()"/>
         </span>
         <xsl:text>=&quot;</xsl:text>
         <span class="xmlverb-ns-uri">
            <xsl:value-of select="."/>
         </span>
         <xsl:text>&quot;</xsl:text>
      </xsl:if>
   </xsl:template>
 
   <!-- text nodes -->
   <xsl:template match="text()" mode="xmlverb">
      <span class="xmlverb-text">
         <xsl:call-template name="preformatted-output">
            <xsl:with-param name="text">
               <xsl:call-template name="html-replace-entities">
                  <xsl:with-param name="text" select="." />
               </xsl:call-template>
            </xsl:with-param>
         </xsl:call-template>
      </span>
   </xsl:template>
 
   <!-- comments -->
   <xsl:template match="comment()" mode="xmlverb">
      <xsl:text>&lt;!--</xsl:text>
      <span class="xmlverb-comment">
         <xsl:call-template name="preformatted-output">
            <xsl:with-param name="text" select="." />
         </xsl:call-template>
      </span>
      <xsl:text>--&gt;</xsl:text>
      <xsl:if test="not(parent::*)"><br /><xsl:text>&#xA;</xsl:text></xsl:if>
   </xsl:template>
 
   <!-- processing instructions -->
   <xsl:template match="processing-instruction()" mode="xmlverb">
      <xsl:text>&lt;?</xsl:text>
      <span class="xmlverb-pi-name">
         <xsl:value-of select="name()"/>
      </span>
      <xsl:if test=".!=''">
         <xsl:text> </xsl:text>
         <span class="xmlverb-pi-content">
            <xsl:value-of select="."/>
         </span>
      </xsl:if>
      <xsl:text>?&gt;</xsl:text>
      <xsl:if test="not(parent::*)"><br /><xsl:text>&#xA;</xsl:text></xsl:if>
   </xsl:template>
 
 
   <!-- =========================================================== -->
   <!--                    Procedures / Functions                   -->
   <!-- =========================================================== -->
 
   <!-- generate entities by replacing &, ", < and > in $text -->
   <xsl:template name="html-replace-entities">
      <xsl:param name="text" />
      <xsl:param name="attrs" />
      <xsl:variable name="tmp">
         <xsl:call-template name="replace-substring">
            <xsl:with-param name="from" select="'&gt;'" />
            <xsl:with-param name="to" select="'&amp;gt;'" />
            <xsl:with-param name="value">
               <xsl:call-template name="replace-substring">
                  <xsl:with-param name="from" select="'&lt;'" />
                  <xsl:with-param name="to" select="'&amp;lt;'" />
                  <xsl:with-param name="value">
                     <xsl:call-template name="replace-substring">
                        <xsl:with-param name="from" 
                                        select="'&amp;'" />
                        <xsl:with-param name="to" 
                                        select="'&amp;amp;'" />
                        <xsl:with-param name="value" 
                                        select="$text" />
                     </xsl:call-template>
                  </xsl:with-param>
               </xsl:call-template>
            </xsl:with-param>
         </xsl:call-template>
      </xsl:variable>
      <xsl:choose>
         <!-- $text is an attribute value -->
         <xsl:when test="$attrs">
            <xsl:call-template name="replace-substring">
               <xsl:with-param name="from" select="'&#xA;'" />
               <xsl:with-param name="to" select="'&amp;#xA;'" />
               <xsl:with-param name="value">
                  <xsl:call-template name="replace-substring">
                     <xsl:with-param name="from" 
                                     select="'&quot;'" />
                     <xsl:with-param name="to" 
                                     select="'&amp;quot;'" />
                     <xsl:with-param name="value" select="$tmp" />
                  </xsl:call-template>
               </xsl:with-param>
            </xsl:call-template>
         </xsl:when>
         <xsl:otherwise>
            <xsl:value-of select="$tmp" />
         </xsl:otherwise>
      </xsl:choose>
   </xsl:template>
 
   <!-- replace in $value substring $from with $to -->
   <xsl:template name="replace-substring">
      <xsl:param name="value" />
      <xsl:param name="from" />
      <xsl:param name="to" />
      <xsl:choose>
         <xsl:when test="contains($value,$from)">
            <xsl:value-of select="substring-before($value,$from)" />
            <xsl:value-of select="$to" />
            <xsl:call-template name="replace-substring">
               <xsl:with-param name="value" 
                               select="substring-after($value,$from)" />
               <xsl:with-param name="from" select="$from" />
               <xsl:with-param name="to" select="$to" />
            </xsl:call-template>
         </xsl:when>
         <xsl:otherwise>
            <xsl:value-of select="$value" />
         </xsl:otherwise>
      </xsl:choose>
   </xsl:template>
 
   <!-- preformatted output: space as &nbsp;, tab as 8 &nbsp;
                             nl as <br> -->
   <xsl:template name="preformatted-output">
      <xsl:param name="text" />
      <xsl:call-template name="output-nl">
         <xsl:with-param name="text">
            <xsl:call-template name="replace-substring">
               <xsl:with-param name="value"
                               select="translate($text,' ','&#xA0;')" />
               <xsl:with-param name="from" select="'	'" />
               <xsl:with-param name="to" 
                               select="'&#xA0;&#xA0;&#xA0;&#xA0;&#xA0;&#xA0;&#xA0;&#xA0;'" />
            </xsl:call-template>
         </xsl:with-param>
      </xsl:call-template>
   </xsl:template>
 
   <!-- output nl as <br> -->
   <xsl:template name="output-nl">
      <xsl:param name="text" />
      <xsl:choose>
         <xsl:when test="contains($text,'&#xA;')">
            <xsl:value-of select="substring-before($text,'&#xA;')" />
            <xsl:text>&#xA;</xsl:text>
            <xsl:call-template name="output-nl">
               <xsl:with-param name="text" 
                               select="substring-after($text,'&#xA;')" />
            </xsl:call-template>
         </xsl:when>
         <xsl:otherwise>
            <xsl:value-of select="$text" />
         </xsl:otherwise>
      </xsl:choose>
   </xsl:template>
 
   <!-- Template pour la gestion de l'arbre -->
   <xsl:template name="tree-expander">
        <span class="expander" onclick="x(this);"><span class="spacer"></span></span>
   </xsl:template>
 
   <xsl:template name="tree-spacer">
        <span><span class="spacer"></span></span>
   </xsl:template>
 
</xsl:stylesheet>

Je vous laisse regarder la différence mais en gros j'englobe chaque noeud d'un div avec la classe "tree-container". Puis avec le bout de javascript (basé sur jquery) suivant je gère l'affichage:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
 
/**
 * 
 * Permet de pilier ou deplier un element de l'arbre.
 * 
 * @param e element a plier ou deplier
 */
function x(e) 
{
	var _this = $(e);
	//si le noeud est deplier
    if (!_this.hasClass("expander-closed")) 
    {
    	_this.addClass("expander-closed")
    	_this.parent().find("> .tree-container").hide();
    }
    //sinon
    else 
    {
    	_this.removeClass("expander-closed")
    	_this.parent().find("> .tree-container").show();
    }
}

Et voici le style CSS:

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
 
.xmlverb-default {
    color: #333333;
    font-family: monospace
}
 
.xmlverb-element-name {
    color: #990000
}
 
.xmlverb-element-nsprefix {
    color: #666600
}
 
.xmlverb-attr-name {
    color: #660000
}
 
.xmlverb-attr-content {
    color: #000099;
    font-weight: bold
}
 
.xmlverb-ns-name {
    color: #666600
}
 
.xmlverb-ns-uri {
    color: #330099
}
 
.xmlverb-text {
    color: #000000;
    font-weight: bold
}
 
.xmlverb-comment {
    color: #006600;
    font-style: italic
}
 
.xmlverb-pi-name {
    color: #006600;
    font-style: italic
}
 
.xmlverb-pi-content {
    color: #006666;
    font-style: italic
}
 
.spacer {
  width: 14px;
  height: 14px;
  display: inline-block;
  border: 10px;
}
 
.expander .spacer{
    background: url("../images/tree-open.gif") no-repeat scroll 0 2px transparent;
}
 
.expander-closed .spacer{
    background: url("../images/tree-close.gif") no-repeat scroll 0 1px transparent;
}
 
.expander {
  cursor: pointer;
  -moz-user-select: none;
  vertical-align: top;
  text-align: center;
}

Je n'ai pas intégré le javascript et le CSS dans la fiche XSL car cela ne correspondait pas a mon besoin.

Voila ma réponse en espérant avoir été clair.

Merci pour votre aide à tous.