Discussions sur l'action Sommaire
Cette page discute d'évolutions possibles pour l'action sommaire.
Se référer à la page
ActionSommaire pour savoir ce qu'est cette action.
12/05/2005 --
JmPhilippe
Voici ce qui me semble à améliorer dans cette action :
- l'ancre <a name="..."></a> encadre le texte du titre dans le corps de la page, ce qui fait que le style du tag A joue sur le rendu des titres de la page lorsqu'on installe l'action (et ce n'est bien sûr pas le cas sinon)
- les listes de liens créées pour générer le sommaire utilisent des tags H1, H2, etc., ce qui génère un sommaire assez encombrant vu la taille des titres, de plus si on change le style des titres, ça change aussi le style du sommaire...
- si le titre contient des caractères de formatage, ils ne sont pas transformés en code Html (par ex. //Titre// reste tel quel au lieu de devenir Titre)
- encore plus d'esthétisme dans le code Html généré !
Voici donc ce que je propose :
- il suffit de placer l'ancre sans texte dans le titre : <h1><a name="..."></a>...</h1>.
- je propose d'utiliser des classes dans les tags LI afin de dissocier les niveaux de titre, exemple :
- <li class="t1"><a href="#1">...</a></li>
- <li class="t2"><a href="#2">...</a></li>
- <li class="t2"><a href="#3">...</a></li>
- NB: on pourrait faire plus souple en imbriquant des listes les unes dans les autres (voir les Listamatic de http://css.maxdesign.com.au/ par exemple), mais cela nécessite de réécrire notablement le code.
- il faut passer le texte à la moulinette de $this->Format() à la fin, en prenant garde au code Html qui a été ajouté entre temps dans le texte du sommaire...
- il s'agit juste d'ajouter des tabulations et des retour chariot pour avoir un beau bloc dans le code Html !
Argh ! Les CSS et le Html n'ont été testés que sous Firefox 1.02/Linux, dont on sait qu'il respecte méticuleusement les standards du web, ce qui n'est pas le cas de tout le monde, si vous voyez ce que je veux dire... S'il y a des volontaires pour tester sur d'autres plateformes, ils seront les bienvenus.
Fichier formatters/wakka.php
- La fermeture du tag A est simplement déplacée afin de ne pas mettre de texte dedans.
// header level 5
else if ($thing == "==")
{
static $l5 = 0;
$br = 0;
// Nouvelle occurence
++$l5;
// Ouverture d'une balise de titre
if ($l5 % 2)
{
++$numTitre;
return "<h5><a name=\"$numTitre\"></a>";
}
// Fermeture du titre precedent
else
{
return "</h5>\n";
}
}
// header level 4
else if ($thing == "===")
{
static $l4 = 0;
$br = 0;
// Nouvelle occurence
++$l4;
// Ouverture d'une balise de titre
if ($l4 % 2)
{
++$numTitre;
return "<h4><a name=\"$numTitre\"></a>";
}
// Fermeture du titre precedent
else
{
return "</h4>\n";
}
}
// header level 3
else if ($thing == "====")
{
static $l3 = 0;
$br = 0;
// Nouvelle occurence
++$l3;
// Ouverture d'une balise de titre
if ($l3 % 2)
{
++$numTitre;
return "<h3><a name=\"$numTitre\"></a>";
}
// Fermeture du titre precedent
else
{
return "</h3>\n";
}
}
// header level 2
else if ($thing == "=====")
{
static $l2 = 0;
$br = 0;
// Nouvelle occurence
++$l2;
// Ouverture d'une balise de titre
if ($l2 % 2)
{
++$numTitre;
return "<h2><a name=\"$numTitre\"></a>";
}
// Fermeture du titre precedent
else
{
return "</h2>\n";
}
}
// header level 1
else if ($thing == "======")
{
static $l1 = 0;
$br = 0;
// Nouvelle occurence
++$l1;
// Ouverture d'une balise de titre
if ($l1 % 2)
{
++$numTitre;
return "<h1><a name=\"$numTitre\"></a>";
}
// Fermeture du titre precedent
else
{
return "</h1>\n";
}
}
Fichier actions/tableofcontent.php
- La modification principale ici est le changement de <li><h1>...</h1></li> en <li class="t1">...</li>, et ainsi de suite pour les autres niveaux de titre. J'ai aussi ajouté un nombre conséquent de guillemets doubles afin de protéger le code Html inséré avant d'invoquer $this->Format(). Il y a certainement plus astucieux, mais je ne connais pas suffisamment le moteur de Wikini. Enfin quelques tabulations et retours chariot par-ci, par-là pour obtenir un code Html bien indenté !
- NB: je n'ai pas trouvé où est appelée la fonction creerSommaire, serait-elle inutile ?
Fichier wakka.css
- On peut ajouter le code CSS suivant pour obtenir un rendu agréable - enfin au moins selon mes critères personnels ! Remarque : j'utilise le titre H1 pour le titre de la page, c'est pourquoi je ne l'affiche pas dans le sommaire (display: none).
/* ******************
Action Sommaire
*******************
CSS author: JM. Philippe (c) 2005
*/
/* table of content main frame */
div#sommaire {
float: left; /* suppress both 1st lines to make a classical table of content - not floating */
width: 50%;
margin: 0 1em 0 0.5em;
font-size: 75%;
background-color: #fffffa;
border: 1px dashed gray;
}
/* frame title */
div#sommaire h2{
margin: 0.5em 0.5em 0 0.75em;
font-size: 150%;
text-align: center;
}
/* the link list of the table */
div#sommaire ul{
margin-left: 0;
padding-left: 0;
}
/* the link entries of the table */
div#sommaire li{
list-style-type: none;
margin: 0;
padding: 0;
}
/* use margins to mimic the title hierarchy */
div#sommaire li.t1{
display: none;
}
div#sommaire li.t2{
margin-left: 0;
}
div#sommaire li.t3{
margin-left: 1em;
}
div#sommaire li.t4{
margin-left: 2em;
}
div#sommaire li.t5{
margin-left: 3em;
}
../..