Wikini

ReglesFormatageTableau

PagePrincipale :: DerniersChangements :: DerniersCommentaires :: ParametresUtilisateur :: Vous êtes ec2-54-226-209-201.compute-1.amazonaws.com
Retour :

Les règles de formatage des tableaux dans les wiki


But de la page


Lister l'ensemble des règles de formatage de tableaux utilisés par les wikis, afin de définir laquelle utiliser pour Wikini.

Les Wikis sans règle de formatage pour les tableaux



OpenWiki?


Sur le site en anglais : http://openwiki.com/ow.asp?HelpOnTables
Sur le site en français : http://www.fecondcarcan.com/tools/openwiki-fr/default.asp?AideSurLesTableaux

Extrait 1 :

Règle :
|| **ID** || **Nom** || **Occupation** ||
|| 123 || Bernard Laurendeau || Puissant Financier ||
|| 456 || Christophe Lacroix || Premier Ministre ||
|| 789 || Mathieu Prescott || Attaché politique ||

Ce qui donne le code html suivant :

<div class="table" align="center">
</div>

et l'affichage suivant sans le formatage css :
ID Nom Occupation
123 Bernard Laurendeau Puissant Financier
456 Christophe Lacroix Premier Ministre
789 Mathieu Prescott Attaché politique


Extrait 2 :

Règle :
|| **ID** |||| **Nom** || **Occupation** ||
|| 123 || Bernard || Laurendeau || Puissant Financier ||
|| 456 || Christophe || Lacroix || Premier Ministre ||
|| 789 || Mathieu || Prescott || Attaché politique ||

Ce qui donne le code html suivant :

<div class="table" align="center">
</div>

et l'affichage suivant sans le formatage css :
ID Nom Occupation
123 Bernard Laurendeau Puissant Financier
456 Christophe Lacroix Premier Ministre
789 Mathieu Prescott Attaché politique


Phpwiki


Règle :
|| __Name__ |v __Cost__ |v __Notes__
| __First__ | __Last__
|> Jeff |< Dairiki |^ Cheap |< Not worth it
|> Marco |< Polo | Cheaper |< Not available


Ce qui donne le code html suivant :

<table cellpadding="1" cellspacing="1" border="1">
</table>

et l'affichage suivant :
 Name  Cost  Notes 
 First  Last 
 Jeff  Dairiki  Cheap  Not worth it 
 Marco  Polo  Cheaper  Not available 


DevWiki?


Les règles de formatage des tableaux semble être en test sur ce Wiki :

Règles :
|:header 1|:header 2|:header 3|
|cell 1|cell 2|cell 3|
|left | center | right|
|+colspan 2|-rowspan 2|
|:+-colspan 2`<BR>`
rowspan 2 header|
|cell 4|

Ce qui donne le code html suivant :
<table border="1" cellspacing="0" cellpadding="3">
</table>

et l'affichage suivant :
header 1header 2header 3
cell 1cell 2cell 3
left center right
colspan 2rowspan 2
colspan 2
rowspan 2 header
cell 4


WackoWiki


Sur le site en russe : http://wiki.oversite.ru/Wacko-Dokumentacija-/Wacko-Sintaksis#TOC_6

Extrait:

Règle :
#|
|| **ID** | **Nom** | **Occupation** ||
|| 123 | Bernard Laurendeau | Puissant Financier ||
|| 456 | Christophe Lacroix | Premier Ministre ||
|| 789 | Mathieu Prescott | Attaché politique ||
|#

Ce qui donne le code html suivant :

<table class="usertable" border="1">
<tr class="userrow"><td class="usercell"> <strong>ID</strong> </td><td class="usercell"> <strong>Nom</strong> </td><td class="usercell"> <strong>Occupation</strong> </td></tr>
<tr class="userrow"><td class="usercell"> 123 </td><td class="usercell"> Bernard Laurendeau </td><td class="usercell"> Puissant Financier </td></tr>
<tr class="userrow"><td class="usercell"> 456 </td><td class="usercell"> Christophe Lacroix </td><td class="usercell"> Premier Ministre </td></tr>
<tr class="userrow"><td class="usercell"> 789 </td><td class="usercell"> Mathieu Prescott </td><td class="usercell"> Attaché politique </td></tr>
</table>


et l'affichage suivant sans le formatage css :
ID Nom Occupation
123 Bernard Laurendeau Puissant Financier
456 Christophe Lacroix Premier Ministre
789 Mathieu Prescott Attaché politique


Because we use different symbols for table row beginning and for table cells separators, we can use any formatting inside cells. See WackoWiki:Test/Tablicy.

There are also tables without border.



Syntaxe des logiciels bureautique


Lorsque l'on fait un "copier" d'un tableau d'un logiciel bureautique, le "coller" produit le résultat suivant :
A1 B1 C1
A2 B2 C2
A3 B3 C3
Les champs sont séparés par des tabulations. De la même manière, un copier du tableau ci-dessus depuis n'importe quel formulaire HTML (et donc de WikiNi), peut donner un tableau selon les logiciels bureautique.
Cette fonctionnalité est présente dans :
Cette fonctionnalité est à vérifier dans certains logiciels bureautiques :
Cette fonctionnalités n'est pas présente dans :


Lorsque l'on réalise le "copier" d'un tableau contenant des cases "fusionnées", ces cases fusionnées ne sont pas représentées.
Ex. 1
A1 B1&C1
A2 B2 C2
A3 B3 C3

Ex. 2
A1 B1 C1
A2 B2&B3 C2
A3 C3

Malgré le fait que les cases fusionnées ne sont pas gérées, je pense que cette syntaxe est intéressante du fait de la facilité d'échanges entre logiciels bureautiques et wikis. Un wiki n'est pas le meilleur outil pour faire un tableau... il me paraît plus intéressant de réaliser ou "maquetter" les tableaux avec des outils bureautiques et les "copier/coller" ensuite simplement dans un wiki.
-- CharlesNepote

Voici mon code pour gérer les tableaux à partir d'un copier/coller d'un logiciel de bureautique.
/formaters/wakka.php

<?php

// Ajouter cette partie avant "//code text"

        // Tables
        
else if (preg_match("/^(\|\|)(.*?)(\|\|)$/s"$thing$matches))
        {
            
$result "\n<table border=\"1\">\n";
            
//print
            
$matches[2] = trim($matches[2]);
            
$lignes split ("\n"$matches[2]);
            
print_r($lignes);
            
$n 0;
            foreach (
$lignes as $ligne)
            {
                
$result .= "<tr>\n";
                
$colonnes split ("\t"$ligne);
                
print_r($colonnes);
                foreach (
$colonnes as $colonne) {
                    
$result .= "<td>".$colonne."</td>\n";
                    }
                
$result .= "</tr>\n";
            }
            
$result .= "</table>\n\n";
            return 
$result;
        }

//


// Changement à l'avant dernière ligne
$text preg_replace_callback(
    
"/(\%\%.*?\%\%|".
    
"\"\".*?\"\"|".
    
"\[\[.*?\]\]|".
    
"\b[a-z]+:\/\/\S+|".
    
"\*\*|\#\#|@@|&pound;&pound;|__|<|>|\/\/|".
    
"======|=====|====|===|==|".
    
"-{4,}|---|".
    
"\n(\t+|([ ]{1})+)(-|[0-9,a-z,A-Z]+\))?|".
    
"^(\t+|([ ]{1})+)(-|[0-9,a-z,A-Z]+\))?|".
    
"\{\{.*?\}\}|".
        
"\b[A-Z][A-Z,a-z]+[:]([A-Z,a-z,0-9]*)\b|".
    
"\b([A-Z][a-z]+[A-Z,0-9][A-Z,a-z,0-9]*)\b|".
        
"\|\|.*?\|\||"
    
"\n)/ms""wakka2callback"$text);

?>


Il faut encadrer le tableau par deux ||. Par exemple :
||
A1 B1 C1
A2 B2 C2
A3 B3 C3
A4 B4 C4
A5 B5 C5
||
Je n'ai pas encore testé à fond... je compte sur vos commentaires.
-- CharlesNepote

Commentaire : il faut commenter les lignes contenant print_r(...)
-- Djakoni

Questions :
--GarfieldFr

Réponses ;)
Ma solution est assez rustique mais peu rendre de grand services... je ne pense pas qu'elle soit la meilleure. On peut envisager de la combiner avec d'autres solutions. Je ne suis pas contre la remise en cause des marqueurs de début et de fin de tableau : ||. J'ai choisi ces caractères parce qu'ils sont rarement utilisés en double et qu'ils respectent la règle informelle de WikiNi selon laquelle les marqueurs sont presque toujours des doubles caractères : %% ** __ [[ ##, etc.
-- CharlesNepote

On pourrait aussi supporter plusieurs formes de descriptions de tableau en testant si les premiers et derniers caractères de $ligne sont des | ou non : si c'est le cas on inteprète la ligne comme ayant des | comme séparateurs de cellules, sinon on considère d'office que c'est du format Office ! ;-) -- ProgFou


Contribution :
Charles, j'ai exploité ton code mais celui-ci élude une difficulté de taille : le formattage wiki dans les cases du tableau. Pour obtenir ce formattage, il est en effet nécessaire d'appeler récursivement la fonction Format(). Cela se passerait sans problème si l'usage de variables statiques dans wakka2callback() n'en interdisait pas l'appel récursif. Pour lever cette difficulté, j'ai donc ajouté dans mon implémentation le support de la réentrance pour la fonction wakka2callback() :

<?php

// au début de wakka2callback(), modifier les 5 déclarations statiques par ceci :

        
static $oldRecurseLevel 0;
        static 
$recurseLevel 0;

        
// les variables statiques sont maintenant des tableaux que je vais utiliser comme des piles
        
static $AoldIndentLevel = array(0);    // le préfixe "A" rappelle qu'il s'agit de tableaux
        
static $AoldIndentLength= array(0);
        static 
$AindentClosers = array(array());
        static 
$AnewIndentSpace= array(array());
        static 
$Abr = array(1);

        
// il n'y a que lorsque j'arrive dans un niveau de récursion supérieur qu'il me faut repartir sur de nouvelles bases
        
if ($oldRecurseLevel $recurseLevel) {
            
$AoldIndentLevel[$recurseLevel] = 0;
            
$AoldIndentLength[$recurseLevel]= 0;
            
$AindentClosers[$recurseLevel] = array();
            
$AnewIndentSpace[$recurseLevel]= array();
            
$Abr[$recurseLevel] = 1;
        }

        
// les alias suivants permettent le bon fonctionnement du reste de wakka2callback(), sans autre modification
        
$oldIndentLevel =& $AoldIndentLevel[$recurseLevel];
        
$oldIndentLength=& $AoldIndentLength[$recurseLevel];
        
$indentClosers  =& $AindentClosers[$recurseLevel];
        
$newIndentSpace =& $AnewIndentSpace[$recurseLevel];
        
$br =& $Abr[$recurseLevel];

        
// il est important pour pouvoir détecter les changements de niveau de récursion
        
$oldRecurseLevel $recurseLevel;

// [...]

// le support des tables (à placer avant "//code text") devient ceci :

        // Tables
        
else if (preg_match("/^(\|\|)(.*?)(\|\|)$/s"$thing$matches))
        {
            
$result "\n<table border=\"1\">\n";
            
//print
            
$matches[2] = trim($matches[2]);
            
$lignes split ("\n"$matches[2]);
            
//print_r($lignes);   // j'ai désactivé les affichages utiles au déverminage
            
$n 0;
            ++
$recurseLevel;   // et ici se place le support de la réentrance pour wakka2callback()
            
foreach ($lignes as $ligne)
            {
                
$result .= "<tr>\n";
                
$colonnes preg_split ("/[\t\|]/"$ligne);   // ici, je gère les tabulations et les séparateurs | simples
                //print_r($colonnes);
                
foreach ($colonnes as $colonne) {
                    
$result .= "<td>".$wiki->Format(trim($colonne))."</td>\n";  // le fameux appel récursif
                    
}
                
$result .= "</tr>\n";
            }
            --
$recurseLevel;   // second temps du support de la réentrance pour wakka2callback()
            
$result .= "</table>\n\n";
            return 
$result;
        }

// [...]

// Changement à l'avant dernière ligne (c'est le même chode que celui de Charles)
$text preg_replace_callback(
    
"/(\%\%.*?\%\%|".
    
"\"\".*?\"\"|".
    
"\[\[.*?\]\]|".
    
"\b[a-z]+:\/\/\S+|".
    
"\*\*|\#\#|@@|&pound;&pound;|__|<|>|\/\/|".
    
"======|=====|====|===|==|".
    
"-{4,}|---|".
    
"\n(\t+|([ ]{1})+)(-|[0-9,a-z,A-Z]+\))?|".
    
"^(\t+|([ ]{1})+)(-|[0-9,a-z,A-Z]+\))?|".
    
"\{\{.*?\}\}|".
        
"\b[A-Z][A-Z,a-z]+[:]([A-Z,a-z,0-9]*)\b|".
    
"\b([A-Z][a-z]+[A-Z,0-9][A-Z,a-z,0-9]*)\b|".
        
"\|\|.*?\|\||"
    
"\n)/ms""wakka2callback"$text);

?>


Grâce au code ci-dessus, j'obtiens une bonne gestion des indentations, sans interférence entre les cellules de tableau et le texte environnant. Dans cet exemple, suivant la même idée que ProgFou, j'ai implémenté des tableaux qui acceptent à la fois le séparateur vertical | et les tabulations (AlexandreF a fait de même, voir son commentaire du 2005-02-19). Je pense que le support des tabulations est une très bonne idée, et puisque cela n'empêche pas le support des séparateurs verticaux, autant ne pas se priver.

Pour aller plus loin, la proposition d'AlexandreF pour le support des colspan me semble bonne car elle apporte un peu de souplesse tout en restant simple. Au début et à la fin des tableaux, elle oblige à n'avoir aucun espace entre les marqueurs || et le retour chariot qui suit ; cela peut s'avérer être un piège pour les débutants, mais une simple précision dans la documentation de Wikini devrait convenablement y remédier. Pour ma part, je n'ai pas intégré cette fonctionnalité de colspan dans mon code car je n'en n'éprouvais pas le besoin pour mon projet.

En réponse aux propositions Phpwiki, Devwiki, GarfieldFr et DavidDecotigny, faites pour davantage de possibilités, je dirai juste qu'il me semble qu'elles se perdent dans des syntaxes alambiquées, donc trop complexes.

Pour finir, je considère le support des tabulations comme un petit plus sympathique et utile. En réponse à OlivierB, je voudrais mentionner qu'il est possible de créer des tabulations avec les navigateurs. Il suffit de copier/coller un caractère de tabulation depuis un éditeur de texte [Il y a aussi la possibilité de mettre en oeuvre l' HackTabulationDansMozilla, proposé par FranckExeprod, quelqu'un a testé ? -- DavidDelon] Enfin, en réponse à BenoitAudouard, certaines applications de bureautiques ajoutent certes d'impromptus retours chariot dans l'opération de copier/coller d'un tableau, mais il me semble plus simple d'enlever rapidement ces retours chariot que de tout reprendre pour mettre des séparateurs verticaux.
-- BenjaminGandon (2005-05-05)



En attendant les tableaux

Ma petite contribution : pour ceux qui sont pressé d'avoir des tableaux, http://codedb.delphicenter.com/wiki/ (Le lien est cassé [Jey]- voila c'est réparé [GarfieldFr]). J'ai modifié le formatter wakka.php pour qu'il supporte les tableaux.
Pour les sources, vous pouvez me contacter par email ( webmaster@codedb.fr.st )
-- GarfieldFr

Je trouve que la syntaxe que tu proposes est relativement complexe. Je pense que les wikis en général et WikiNi en particulier doivent rester simple, sinon pourquoi ne pas utiliser directement du HTML qui a l'avantage d'avoir une syntaxe standardisée ? C'est la raison pour laquelle je pense que la création de tableau n'a pas vocation à offrir toutes les possibilités des tableaux HTML : il faut au contraire une manière intuitive et rapide de créer de simple petits tableaux.
Pour toutes ces raisons, j'aime bien les propositions d'OpenWiki?, mais plus encore de WakkoWiki? et des logiciels bureautique. Je vais aller jeter un oeil sur le code de WakkoWiki? mais je pense qu'on peut aussi ajouter un marqueur type ||(office) pour les tableaux importés des logiciels bureautique. -- CharlesNepote

La syntaxe que j'ai utilisé est plutôt simple à mon avis. Un marqueur de début de tableau et de fin de tableau, un marqueur de séparateur de cellule...c'est assez basic je trouve. Le fait que toute les options des tableaux HTML soit utilisable est un "effet de bord" que je n'avais pas prévu au départ, j'avais simplement besoin de faire des tableaux basic. Ceci dis, il est vrai qu'une syntaxe plus simple pour la définitions des attributs des cellules devrait pouvoir être envisagé.
Ma contribution n'est juste la que pour ceux qui sont pressé d'avoir des tableaux ce n'est pas vraiment le résultat d'une reflexion intense sur la syntaxe des tableaux. -- GarfieldFr



Encore une nouvelle règle de formatage


Pourquoi pas essayer de partir de l'indentation visuelle ?

On peut imaginer ceci :


Et qui donnerait, la présentation suivante :

ID Nom Occupation
123 Bernard Laurendeau Puissant Financier
456 Christophe Lacroix Premier Ministre
789 Mathieu Prescott Attaché politique


-- DavidDelon

Une autre proposition (qui se veut simple)


En reprenant le schema de tableaux classique qu'on retrouve dans d'autres wiki ci-dessus, je souhaitais obtenir un truc du genre :
Demo

Bref, je voulais que ce soit simple, avec le minimum de regles d'ecriture possible, sans fioritures compliquées (genre colspan & co en html dans le texte), mais qui soit un minimum "évolué" (émulation des colspan). Bilan : seulement rajouter des balises || avant et après le tableau, rajouter un & pour tracer une colonne, et un $ pour accoller 2 ou plusieurs cellules sans tracer de colonne.

Marche à suivre :
@@ -112,11 +125,63 @@
+		// Tables
+		else if (preg_match("/^(\|\|)(.*?)(\|\|)$/s",
+				    $thing, $matches))
+		  {
+		    $result = "\n<div class=\"wiki_table\"><table>\n";	
+		    $lignes = split ("\n", trim($matches[2]));
+		    $n = 0;
+		    foreach ($lignes as $ligne)
+		      {
+			$class = ($n % 2)?"row_odd":"row_even";
+			$n++;
+			$result .= "<tr class=\"$class\">\n";
+			$colonnes = split ("(\t|(^|[ \t]+)&)", $ligne);
+			$colonnes = preg_replace("/[\\\\]&/", "&", $colonnes);
+			foreach ($colonnes as $colonne) {
+			  $span=0;
+			  preg_match("/(^|\s+)(\\$(\\$|\s)*)$/",
+				     $colonne, $matches);
+			  if ($matches)
+			    {
+			      $span = substr_count($matches[0], "\$");
+			      preg_match("/^(([\\\\]\\$|[^\\$])*)/",
+					 $colonne, $matches);
+			      $colonne = $matches[0];
+			    }
+			  $colonne = preg_replace("/[\\\\]\\$/", "\$",
+						  $colonne);
+			  $result .= "<td";
+			  if ($span)
+			    $result .= " colspan=\"".($span+1)."\"";
+			  $result .= ">".$wiki->Format($colonne)."</td>\n";
+			}
+			$result .= "</tr>\n";
+		      }
+		    $result .= "</table></div>\n\n";
+		    return $result;
+		  }
 		// code text
 		else if (preg_match("/^\%\%(.*)\%\%$/s", $thing, $matches))
 		{
@@ -288,6 +362,7 @@
 	"\{\{.*?\}\}|".
         "\b[A-Z][A-Z,a-z]+[:]([A-Z,a-z,0-9]*)\b|".
 	"\b([A-Z][a-z]+[A-Z,0-9][A-Z,a-z,0-9]*)\b|".
+	"\|\|.*?\|\||". 
 	"\n)/ms", "wakka2callback", $text);
 
 // we're cutting the last <br />


div.wiki_table
{
  padding-top: 1em;
  padding-bottom: 1em;
}

div.wiki_table table
{
 text-align: center;
 border-collapse: collapse;
 border: solid #000000 2px;
 vertical-align: middle;
 margin-left: auto;
 margin-right: auto
}

tr.row_odd
{
 background-color: #CCCCFF;
}

tr.row_even
{
 background-color: #CCCC99;
}

div.wiki_table td
{
 border: solid #000000 1px;
 padding: 3px;
 padding-left: 1em;
 padding-right: 1em;
}


-- DavidDecotigny

Personnellement, je pense que pour rester dans un esprit wiki, il faudrait avoir une syntaxe simple pour que tout le monde puisse en créer ou en modifier sans devoir se demander ce que l'auteur à voulu faire. A vouloir trop rajouter d'options pour pouvoir faire des tableaux tarabiscotés on risque d'avoir des tableaux illisibles au niveau de la page d'édition.

Pour moi je trouve que les solutions les plus intéressantes sont celles d'OpenWiki?, de WackoWiki et de DavidDecotigny. Sinon si on veut faire plus compliqué il y a toujours possibilité de faire du HTML (pas trop dans l'esprit Wiki mais bon).

Pour les tableaux issus de logiciels de bureautiques, je n'en vois pas trop l'intérêt sauf s'ils peuvent être facilement modifiés par la suite dans la page d'édition (donc pas de tabulation).

-- OlivierB
Il n'y a pas de commentaire sur cette page. [Afficher commentaires/formulaire]