Structuration des thèmes Wikini
Le système de thèmes graphiques Wikini n'est pour le moment pas très adapté lorsqu'il faut ajouter un ou plusieurs thèmes car il n'y a pas d'emplacement prévu pour cela dans l'arborescence. La discussion sur ce sujet avait en fait démarré indirectement dans la page
Rendre modulaires les feuilles de styles et maintenant le besoin de modifier significativement le fonctionnement des thèmes se fait d'autant plus sentir que le nouveau
va prochainement entrer au CVS... Des discussions ont eu lieu à ce propos sur la liste de développement, en voici le résumé.
Les différents problèmes à résoudre sont les suivants :
- Pouvoir installer facilement un thème, typiquement on décompresse une archive quelque part et c'est fini, il n'y a plus qu'à aller à l'interface de sélection du thème à utiliser !
- Prévoir un emplacement pour le style par défaut d'une action, qu'elle soit officiellement supportée ou non
- Permettre de fournir facilement un style alternatif pour une action sans avoir à écraser son thème par défaut dont on pourrait de toute façon avoir encore besoin
- Autoriser d'une manière plus générale la spécification d'une feuille de style par défaut et d'une version spécifique à un thème, par exemple pour l'impression (voir Feuille de style pour l'impression)
- Éviter que les régles CSS issues de thèmes différents ne s'enchaînent les unes les autres, ce qui compliquerait la tâche d'écriture d'un thème
Les autres problèmes qui ne sont pas liés directement à la structure de répertoire des thèmes sont :
- des feuilles de style pour les Internet Explorer
- une feuille pour l'impression
-
NB: merci de discuter dans les commentaires plutôt que dans la page afin de ne pas alourdir son contenu.
Structure proposée
- le répertoire wikini/themes/ accueille un sous-répertoire par thème
- chaque thème doit fournir un fichier et deux répertoires obligatoires
- main.css est le fichier CSS principal du thème
- actions/ contient les styles spécifiques aux actions, les fichiers CSS portent le nom du fichier Php de l'action (ex. include.css pour l'action include), ce répertoire peut être vide mais doit exister
- handlers/ contient les styles spécifiques aux handlers et fonctionne de la même manière que actions/
- chaque thème peut fournir des fichiers standards en remplacement de ceux fournis par le thème par défaut :
- print.css fournit une version imprimable des pages
- IE50Fixes.css, IE55Fixes.css, IE60Fixes.css et IE70Fixes.css fournissent des styles corrigeant les problèmes des IE concernés
- generic.css fournit des classes CSS génériques, par exemple pour les boîtes flottantes
Le thème par défaut
default/ contient de plus un répertoire
install/ contenant tous les fichiers de style spécifiques à l'installation de Wikini, y compris les images (on est censé les utiliser très rarement). A priori c'est tout à fait inutile de prévoir son écrasement par celui d'un thème.
Le principe de base pour mettre ceci en œuvre dans le moteur Wikini est relativement simple :
- le moteur Wikini liste les actions existant dans wikini/actions/ et les handlers existant dans wikini/handlers/, puis il liste les fichiers CSS existant dans wikini/themes/<montheme>/actions/ et dans wikini/themes/<montheme>/handlers/
- pour chaque action et chaque handler, Wikini détermine s'il utilise le style par défaut ou le style alternatif du thème
- Wikini écrit dans l'entête de la page un code permettant de charger les bons fichiers CSS, par exemple :
- <style type="text/css" media="all">
- @import "themes/<montheme>/main.css";
- @import "themes/default/actions/include.css";
- @import "themes/<montheme>/actions/trail.css";
- @import "themes/<montheme>/handlers/revisions.css";
- etc.
- </style>
Noter que le principe décrit ici n'engage nullement la solution technique qui sera effectivement mise en œuvre, il s'agit surtout d'illustrer concrètement les propos.
wikini/
|
|- themes/
| |
| |- default/
| | |
| | |- images/
| | |
| | |- actions/
| | |
| | |- handlers/
| | |
| | |- install/
| | |
| | |- main.css
| | |
| | |- print.css
| | |
| | |- generic.css
| | |
| | |- IE60Fixes.css
| | |
| | ...
| |
| |
| |- theme1/
| | |
| | |- actions/
| | |
| | |- handlers/
| | |
| | |- main.css
| | |
| | ...
| ...
|
...
Remarque : le répertoire
images/ contient toutes les images du thème et peut être organisé à souhait, renommé voire supprimé si d'aucune utilité pour le thème.
Préparation des thèmes dans le CVS
Pour permettre de travailler les thèmes sans interférences avec le moteur Wikini, il a été créé un deuxième projet dans le dépôt Gna!, il porte le nom de wikini_style. Pour le récupérer en utilisateur anonyme et en commande CVS ça donne :
cvs -d :pserver:anonymous@cvs.gna.org:/cvs/wikini co wikini_style
Structure
Le projet wikini_style comporte deux répertoires svg et html qui permettent de travailler respectivement d'abord sur la partie dessin du thème, puis sur la partie implémentation Html. On retrouve un découpage similaire à celui des thèmes dans Wikini afin de faciliter la transposition une fois que tout est au point.
wikini_style/
|
|- svg/
| |
| |- default/
| | |
| | |- install/
| | | |
| | | |- install.svg
| | | |
| | | ...
| | |
| | |- actions/
| | | |
| | | |- trail.svg
| | | |
| | | ...
| | |
| | |- handlers/
| | | |
| | | |- revisions.svg
| | | |
| | | ...
| | |
| | |- page.svg
| | |
| | |- page+comments.svg
| | |
| | ...
| |
| |- theme1/
| ...
|
|- html/
| |- default/
| | |
| | |- images/
| | |
| | |- actions/
| | |
| | |- handlers/
| | |
| | |- install/
| | |
| | |- main.css
| | |
| | ...
| |
| |- theme1/
| ...
|
| |- install.html
| |
| |- page.html
| |
| |- page+comments.html
| |
| ...
Gestion des branches
Une possibilité pour exploiter les possibilités de CVS est de créer des branches dans le module wikini_style correspondant aux versions de Wikini. Ceci permettrait de travailler sur des aspects ergonomiques futurs dans la version de développement, tout en élagant ce qui ne colle pas avec une version donnée dans les branches.