blog.pagesd.info

Cet été, j'ai eu envie d'un Altrr-Press tout beau, tout propre pour qu'il soit encore plus simple à utiliser et aussi un peu plus prêt pour le grand jour du passage sous .Net 2.0 (ou plus) : moins de code = moins de problèmes lors de la conversion.

Pour commencer, je me suis enfin décidé à supprimer les sources d'un certain nombre de boites devenues inutiles mais dont les codes sources avaient été épargnés (voire un peu oubliés) en attendant que tous les sites existant soient mis à jour.

• FlashFile : insérait une animation flash (remplacé par IncludeFile)
• Image : insérait une image (remplacé par IncludeFile)
• Redirect : redirige le client vers une autre URL (remplacé par la macro [%AP.Redirect:url%])
• Sitemap : insérait le plan du site (remplacé par la macro [%AP.Site.Map%])
• Sitemenu : menu ou sous-menu de navigation (remplacé par la macro [%AP.Site.Menu:level1-level2%])

Note : si vous connaissez des sites qui ont encore besoin de ces boites, 20071029_update.sql et 20071030_update.sql sont vos amis.

Pour continuer sur ma lancée, j'ai aussi cherché comment éliminer la boite SqlRepeat qui prend le résultat d'une requête sous forme de DataReader pour générer un tableau HTML à l'aide d'un système de template très primaire.

D'abord, il y a le template d'en-tête :

<table class='repertoire'>

Puis le template pour le détail des lignes :

<tr>
  <td class='col1'>{0}<br /></td>
  <td class='col2'>{1} {3} {2}<br />{4}</td>
  <td class='col3'>Tél:&amp;nbsp; {7}<br />Fax: {8}</td>
</tr>

Et pour finir celui pour la fin du tableau :

</table>

Et côté code, en simplifiant ça donne à peu près ça :

StringBuilder html = new StringBuilder();
html.Append(templateHead);
DataReader dr = Data.Base.ExecuteReader(sqlQuery);
while (dr.Read()) {
  html.Append(ToHtmlRow(dr, templateLoop));
}
dr.Close();
html.Append(templateFoot);

Pour chaque ligne du DataReader, la fonction ToHtmlRow() génère une ligne en remplaçant les marqueurs {#} par la colonne correspondante dans la ligne en cours DataReader.

Le but étant de supprimer une boite, il faut donc trouver par quoi la remplacer. Le plus simple est de passer par la boite à tout faire RawContent et d'y coller le tableau HTML final. Etant donné que cette boite n'est utilisée que sur le site de Saint-Privat, cela semble une solution raisonnable. Malgré tout, la boite RawContent est plutôt destinée aux petits bouts de codes de quelques lignes et là les tableaux HTML dépassent la toise.

Alors j'ai cherché s'il n'y aurait pas une autre méthode. Et TILT : XML. Ah ben ZUT alors!

Normalement, je préfère éviter d'utiliser le XML (et surtout le XSLT) parce que si c'est toujours assez facile quand on commence, on se retrouve vite avec des sacs de noeuds pour faire trois fois rien. (Ou alors il faut recourir à un collègue qui parle le XML couramment mais que quand il a fini j'ai pas toujours compris.) Mais là, l'envie de me débarrasser d'une boite quasiment inutilisée étant la plus forte, j'ai succombé. Et en fait, ça n'a pas été aussi compliqué que ce que je craignais.

Un premier bon point, c'est qu'il existe déjà une boite XmlFile qui prend un fichier XML pour générer du HTML en lui appliquant un fichier XSLT. C'est un truc qui existe depuis toujours dans IBuySpy et que j'ai adapté dans Altrr-Press. Dans la pratique, je ne m'en sers presque jamais, sauf de temps en temps pour afficher des fils RSS ou Atom ou bien des liens enregistrés dans Blogmarks.

Dans le cas présent, il fallait donc que je me débrouille pour prendre le résultat de ma requête comme source XML et surtout que je réussisse à créer un fichier XSLT qui transforme ce résultat en tableau HTML.

Pour la source XML, c'était vraiment trop facile : quelques minutes à passer dans l'aide et 2 lignes de codes ont suffit (merci le .Net) :

DataSet ds = Data.Base.ExecuteDataSet(sqlQuery);
string xml = ds.GetXml();

Ce qui donne :

<NewDataSet>
  <Table>
    <categories>Electricien</categories>
    <organization>Ets Martin</organization>
    <legalName />
    <givenName />
    <streetAddress>Le Pré-Vert</streetAddress>
    <postalCode>12345</postalCode>
    <placeName>Enville</placeName>
    <workPhone>01 02 03 04 05</workPhone>
    <faxPhone />
  </Table>
  ...
</NewDataSet>

Puis en partant de fichiers XSLT existants et après pas mal d'essais et de messages d'erreurs, j'ai réussi à obtenir un fichier XSLT qui reproduisait le résultat de mon futur ex-système de template :

<xsl:stylesheet version='1.0' xmlns:xsl='http://www.w3.org/1999/XSL/Transform'>
  <xsl:template match="/">
    <table class='repertoire'>
    <xsl:for-each select='NewDataSet/Table'>
      <tr>
        <td class='col1'>
          <xsl:value-of select='categories'/>
          <br />
        </td>
        <td class='col2'>
          <xsl:value-of select='organization'/>
          <xsl:if test="givenName != ''">
            <xsl:if test="organization != ''">
              <xsl:text> - </xsl:text>
            </xsl:if>
            <xsl:value-of select='givenName'/>
            <xsl:text> </xsl:text>
            <xsl:value-of select='legalName'/>
          </xsl:if>
          <br />
          <xsl:value-of select='streetAddress'/>
        </td>
        <td class='col3'>
          Tél: <xsl:value-of select='workPhone'/>
          <br />
          <xsl:if test="faxPhone != ''">Fax: <xsl:value-of select='faxPhone'/></xsl:if>
        </td>
      </tr>
    </xsl:for-each>
    </table>
  </xsl:template>
</xsl:stylesheet>

Et même que grâce à l'instruction <code><xsl:if test="faxPhone != ''"> ... </xsl:if></code>, le résultat obtenu est encore mieux que l'original. Si je ne me retenais pas, je passerais tout en XML.

Mais pour l'instant, je vais me contenter de supprimer la boite SqlRepeat et ses 3 fichiers sources devenus inutiles. C'est toujours ça de pris (et au final ça fait quand même 6 boites de moins !).

Ce fichier permet de transformer le fil atom de Blogmarks (par exemple http://api.blogmarks.net/user/ms_michel) en code html afin de pouvoir l'intégrer à une page web.

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" 
        xmlns:atom="http://www.w3.org/2005/Atom" 
        xmlns:xsl="http://www.w3.org/1999/XSL/Transform" 
        xmlns:dc="http://purl.org/dc/elements/1.1/">
  <xsl:output method="html" />
  <xsl:template match="/">
    <xsl:apply-templates select="/atom:feed/atom:head" mode="before" />
    <xsl:apply-templates select="/atom:feed/atom:entry" />
    <xsl:apply-templates select="/atom:feed/atom:head" mode="after" />
  </xsl:template>
  <xsl:template match="atom:feed/atom:head" mode="before" >
    <!-- <h3><xsl:value-of select="atom:title" /></h3> -->
  </xsl:template>
  <xsl:template match="atom:feed/atom:head" mode="after">
    <p><a href="{atom:link[@rel='alternate']/@href}"><img src="http://blogmarks.net/img/88x31_neg.png" alt="blogmarks.net" /></a></p>
  </xsl:template>
  <xsl:template match="atom:feed/atom:entry">
    <div>
      <xsl:choose>
        <xsl:when test="position() mod 2 = 1">
          <xsl:attribute name="class">bm_blogmarks bm_odd</xsl:attribute>
        </xsl:when>
        <xsl:otherwise>
          <xsl:attribute name="class">bm_blogmarks bm_even</xsl:attribute>
        </xsl:otherwise>
      </xsl:choose>
      <a href="{atom:link[@rel='related']/@href}"><img src="{atom:link[@rel='image']/@href}" alt="" /></a>
      <h4><a href="{atom:link[@rel='related']/@href}"><xsl:value-of select="atom:title" /></a></h4>
      <p><xsl:value-of select="atom:summary" disable-output-escaping="yes" /></p>
      <p class="blogmarks-tags">
        <xsl:value-of select="substring(atom:published, 0, 11)" />
        <xsl:if test="atom:category">
          <xsl:for-each select="atom:category">
            <xsl:text> - </xsl:text><a href="{@term}{@sheme}"><xsl:value-of select="@label" /></a>
          </xsl:for-each>
        </xsl:if>
      </p>
    </div>
  </xsl:template>
</xsl:stylesheet>

Le code html généré est inspiré par celui de Hot Links. Il peut ensuite être présenté grâce à la feuille de style CSS suivante :

.bm_blogmarks {
  margin: 10px auto;
  padding: 1%;
  background-color: #f5f5f5;
  border: 1px solid #d9d9d9;
  width: 97%;
  overflow:auto;
}
.bm_even {
  background-color: #fcfcfc;
}
.bm_blogmarks h4 {
  margin-top: 0;
}
.bm_blogmarks p.bm_tags {
  margin-bottom: 0;
  display: block;
  clear: left;
}
.bm_blogmarks img {
  margin: 0 0px 5px 10px;
  float: right;
  border: 0;
  clear: none;
  width: 144px;
  height: 107px;
}
.bm_even img {
  margin: 0 10px 5px 0px;
  float: left;
}

(publié à l'origine sur http://www.bigbold.com/snippets/pos...)

Ce fichier permet de transformer un fil RSS (version 0.9x ou 2.0) en code html afin de pouvoir l'intégrer à une page web.

<?xml version="1.0"?>
<xsl:stylesheet version="1.0"
 xmlns:xsl="http://www.w3.org/1999/XSL/Transform"
 xmlns:wfw="http://wellformedweb.org/CommentAPI/">
    <xsl:output method="html"/>
    <xsl:template match="/">
        <xsl:apply-templates select="/rss/channel"/>
    </xsl:template>
    <xsl:template match="/rss/channel">
        <h3><xsl:value-of select="title"/></h3>
        <p><xsl:value-of select="description"/></p>
        <ul>
            <xsl:apply-templates select="item"/>
        </ul>
    </xsl:template>
    <xsl:template match="/rss/channel/item">
        <li>
            <a href="{link}" title="{substring(pubDate, 0, 11)}"><xsl:value-of select="title"/></a>
            <p><xsl:value-of select="description" disable-output-escaping="yes" /></p>
        </li>
    </xsl:template>
</xsl:stylesheet>

(publié à l'origine sur http://www.bigbold.com/snippets/pos...)

Amélioration en ce qui concerne la méthode utilisée pour gérer la transformation d'un document xml via xslt. Jusqu'à présent, c'était fait quasi-automatiquement à l'aide des propriétés DocumentSource et TransformSource du contrôle Xml. Après modification, la boite Xmlfeed fonctionne de la façon suivante :

• la source est chargée dans un objet XmlDocument puis affectée à la propriété Document du contrôle Xml,
• la fichier xsl est chargé dans un objet XslTransform qui est ensuite affecté à la propriété Transform du contrôle XML.

Cette solution permet d'avoir une meilleure gestion des erreurs, et aussi :

• de reconnaitre le type de fil et donc de sélectionner automatiquement la feuille de style adéquate si besoin est,
• de “bidouiller” le fil atom de Blogmarks car la mention "draft-ietf-atompub-format-05″ dans xlmns=”http://purl.org/atom/ns#…" (mais sans message d'erreur pour trouver comment gérer ça plus proprement).

En configuration, les types de fils xml sont passés de 6 (atom, sommaire atom, rss2, rss1, rdf et rss0.9) à 4 (atom, rdf, rss et automatique).

Par ailleurs, une feuille de style spéciale a été créée pour convertir le fil atom de Blogmarks en html, afin de gérer la miniature écran et la liste des tags.

Note : l'utilisation des propriétés Document et Transform en lieu et place de DocumentSource et TransformSource a été également mise en place au niveau de la boite Xmlfile.