Jaxe: un éditeur XML configurable

Introduction

Le métalangage XML permet de définir des langages à balises adaptés à des usages particuliers, avec des éléments et une structure spécifiques.

Un document XML utilisant un petit nombre d'éléments ayant chacun un sens bien défini est à la fois lisible directement par un être humain, et par un programme ayant besoin de l'analyser (par exemple pour extraire des informations ou transformer un document dans un autre format de façon automatique).

Pourtant, les langages XML les plus utilisés ont des centaines d'éléments et d'attributs, ce qui rend les documents illisibles et très difficiles à utiliser automatiquement avec un programme. Par exemple:

HTML (qui permet de définir des pages Web) comporte 91 éléments,
Docbook (qui sert à créer des documentations) comporte 390 éléments,
OpenDocument (le format utilisé par OpenOffice) comporte 526 éléments.

Pourquoi ces langages comportent-ils autant d'éléments ? On peut y voir 2 origines importantes :

Dans le cas de Docbook, l'objectif initial était d'unifier plusieurs formats de documentation pour faciliter les transformations d'un langage à l'autre, et pour permettre une chaîne de production du type "langage spécifique transformé en Docbook puis publication HTML ou PDF grâce aux feuilles de style de Docbook". Mais le succès de Docbook en a fait un langage utilisé directement pour la rédaction, alors qu'il n'est pas adapté à cet usage.
L'usage d'éditeurs "WYSIWYG" (What You See Is What You Get) est populaire parce-qu'ils sont généralement plus accessibles pour des non-informaticiens. OpenOffice est WYSIWYG, et son langage XML contient donc des éléments définissant un affichage graphique au lieu d'un sens particulier. Comme OpenOffice sert à de nombreux usages, cela requiert de nombreux éléments XML, et rend aussi très difficile la réutilisation automatique de documents.

La solution idéale, pour l'édition d'un grand nombre de documents ayant une cohérence structurelle et éditoriale, est de créer un langage XML adapté, ainsi qu'un éditeur correspondant facile à utiliser par des non-informaticiens, et des transformations automatiques vers d'autres formats. Mais il y a quelques années, ceci nécessitait un investissement considérable en développement, et n'était donc rentable que pour un très grand nombre de documents.

En 2001, l'Observatoire de Paris s'est confronté à cette problématique: il avait en projet la création de plusieurs cours en ligne comportant des centaines de pages, par un grand nombre d'auteurs, avec l'objectif de créer des sites de formation en ligne ayant une présentation pédagogique uniforme. L'objectif était aussi de pouvoir faire évoluer la charte graphique indépendamment des contenus (ce qui n'est pas possible en éditant directement des fichiers HTML). N'ayant pas trouvé de solution logicielle sur le marché, l'Observatoire de Paris s'est lancé progressivement dans la création d'un éditeur XML adapté aux cours en ligne, Jaxe. Cet éditeur a ensuite été rendu configurable pour d'autres langages XML que ceux utilisés à l'Observatoire de Paris, de manière à répondre entièrement à la problématique.

Comment créer son propre éditeur XML

Jaxe est un éditeur qui permet de créer à la fois son propre langage XML et un environnement d'édition personnalisé pour ce langage. Jaxe est donc configurable pour un langage XML donné, il faut tout d'abord créer un fichier de configuration dans lequel on définit cet environnement d'édition des éléments du langage XML.

Contrairement à d'autres éditeurs qui sont, soit en mode texte, soit en mode "WYSIWYG", Jaxe est un éditeur "WYSIWYM" (What You See Is What You Mean) : l'environnement d'édition est graphique, mais ne correspond pas directement à la publication, qui est une opération indépendante de l'édition. Jaxe facilite la création de documents XML valides (c'est à dire conformes au schéma XML) grâce à une validation en temps réel des documents en cours d'édition.

L'utilisation de Jaxe suit donc les étapes suivantes :

Création de l'environnement d'édition
- fichier de configuration de Jaxe
- éventuellement le fichier du schéma XML (si le langage n'est pas défini dans le fichier de config)
- éventuellement la feuille de style XSLT
Édition des documents
Publication

Jaxe est libre et gratuit, téléchargeable sur SourceForge : http://jaxe.sourceforge.net/Jaxe.html

Cette présentation explique comment créer un fichier de configuration pour Jaxe incluant le langage XML, la définition des menus d'insertion des éléments XML, et la méthode d'affichage des éléments. Il donne aussi un exemple de feuille de style XSLT. L'exemple donné a permis de créer avec Jaxe ce fichier que vous êtes en train de lire.

Création du fichier de configuration de Jaxe

Les fichiers de configuration se situent dans le dossier config de Jaxe, et leur nom se termine en _config.xml. Par exemple, le fichier de configuration des fichiers de configuration (dont l'élément racine est CONFIG_JAXE), se nomme CONFIG_JAXE_config.xml. On commence donc par lancer Jaxe, choisir le bouton "Nouveau" et sélectionner "CONFIG_JAXE - Fichier de configuration de Jaxe".

Il existe deux options possibles pour la création d'un fichier de configuration de Jaxe:

Utiliser un fichier de schéma XML pour définir le langage XML à utiliser, et définir juste les menus et la méthode d'affichage des éléments dans le fichier de configuration.
Définir un langage XML en utilisant une syntaxe simplifiée à l'intérieur du fichier de configuration.

On commencera ici par la syntaxe simplifiée, qui se contente de définir les éléments, leurs attributs, les sous-éléments, et quels éléments peuvent contenir du texte. On montrera ensuite comment cela peut être fait avec un schéma XML dans un fichier externe au fichier de configuration.

Définition du langage XML à l'aide d'un schéma simplifié

On commence la définition du langage XML de la configuration en insérant un élément Langage sous Configuration Jaxe. A l'intérieur de l'élément Langage, on choisit d'insérer un Schéma simple pour pouvoir définir le langage XML dans le fichier de config.

Il faut alors définir tous les éléments du langage XML. Commençons par l'élément racine, que l'on appellera DOCUMENTATION. On insère un élément Elément sous Schéma simple, en donnant son nom et en spécifiant qu'il ne peut pas contenir de texte (d'autres sous-éléments pourront contenir du texte, mais pas l'élément racine) (attention à ne pas mettre d'espace dans les noms d'éléments).

On indique ensuite quels éléments seront autorisés sous DOCUMENTATION. En l'occurrence, on prévoit déjà l'ajout des éléments TITRE et SECTION, dont on peut ajouter la référence sous forme de sous-éléments.

Ces éléments TITRE et SECTION doivent maintenant être définis. On procède de la même façon, en autorisant le texte sous TITRE mais pas sous SECTION.

Voilà la liste des éléments que l'on va définir, avec les sous-éléments autorisés :

DOCUMENTATION
- TITRE
- SECTION
TITRE
SECTION
- TITRE
- PARAGRAPHE
- LISTE
- IMAGE
PARAGRAPHE
- TITRE
- EMPHASE
- CODE
- LIEN
LISTE
- EL
EL
- LISTE
- EMPHASE
- CODE
- LIEN
IMAGE
EMPHASE
CODE
LIEN

Certains éléments auront des attributs, que l'on définira à chaque fois avec l'élément Attribut.

IMAGE aura un attribut fichier (obligatoire) pour spécifier le fichier de l'image.
LIEN aura un attribut href (obligatoire) avec l'URL du lien.

Le texte sera autorisé sous : TITRE, PARAGRAPHE, EL, EMPHASE, CODE et LIEN.

Pour éviter de répéter les élément mélangés au texte à la fois dans PARAGRAPHE et dans EL, on pourra définir un ensemble contenant les éléments EMPHASE, CODE et LIEN, et indiquer cet ensemble comme sous-ensemble dans les éléments PARAGRAPHE et EL.

On peut remarquer à ce point que l'élément Langage s'affiche en orange dans Jaxe, ce qui signifie qu'il n'est pas valide. En effet, il est obligatoire de spécifier au moins un élément racine possible pour le langage (ceci est obligatoire même quand on a spécifié un fichier de schéma XML WXS au lieu de définir un langage simplifié). Dans notre exemple, la racine est DOCUMENTATION. On l'indique avec l'élément Racine dans le fichier de config, juste après Schéma simple.

Voilà ce que donne la définition du langage XML dans Jaxe à ce point :

Définition du langage XML à l'aide d'un fichier de schéma

L'autre option pour la définition du langage XML consiste à utiliser un fichier de schéma "WXS" (W3C XML Schema). On le crée dans Jaxe en choisissant "nouveau" puis en sélectionnant la configuration "schema - Schéma XML du W3C".

A la création du fichier, Jaxe demande les attributs à mettre sur l'élément racine. On pourrait ici définir un espace de noms pour les éléments du langage, mais ce n'est pas nécessaire dans notre cas. On peut se contenter de préciser que la langue utilisée sera le français, en mettant la valeur fr à l'attribut xml:lang.

A l'intérieur de l'élément racine, chaque élément est défini avec l'élément element. Cet élément des schémas s'affiche dans Jaxe sous le nom Elément. On le voit apparaître dans les éléments du panneau d'insertion quand le curseur est à l'intérieur de Schéma.

Commençons donc par définir l'élément racine, DOCUMENTATION. Il suffit de créer un Elément et de donner la valeur "DOCUMENTATION" à l'attribut name. Si c'était un type simple (comme un nombre ou une chaîne de caractères), on pourrait utiliser l'attribut type pour définir le type de l'élément DOCUMENTATION. Comme l'élément DOCUMENTATION peut avoir plusieurs sous-éléments, on insère à l'intérieur de Elément un élément complexType qui s'affiche dans Jaxe sous le nom Type complexe.

A l'intérieur de Type complexe, on doit définir les règles à respecter pour l'ordre et le nombre de sous-éléments possibles. Ici, on décide de définir une séquence avec un titre optionnel, et un certain nombre de sections après (au moins une). Ces règles sont impossibles à définir de façon aussi précise avec la syntaxe simplifiée de Jaxe, et l'on voit donc rapidement l'intérêt d'utiliser des fichiers de schémas.

On insère donc une Séquence sous Type complexe, dans laquelle on place des références vers les éléments TITRE et SECTION. Les références se créent avec un Elément dont on utilise l'attribut ref au lieu de l'attribut name. Pour chacun de ces éléments Séquence et Elément, on peut utiliser les attributs minOccurs et maxOccurs pour choisir le nombre minimum d'occurrences et le nombre maximum d'occurrences. Pour un nombre maximum infini, on utilise la valeur spéciale unbounded.

Voilà ce que cela donne dans Jaxe :

L'élément TITRE est plus simple à définir : on crée juste un Elément au même niveau que l'autre avec les attributs name="TITRE" et type="xs:string". Le préfixe xs ici est lié à l'espace de noms des schémas, ce qui signifie qu'il s'agit d'un type de base et non d'un type défini dans le nouveau schéma.

La définition de l'élément SECTION est l'occasion d'utiliser des règles un peu plus complexes : on souhaite ici définir une séquence commençant par le titre, suivi d'un mélange sans limite d'éléments PARAGRAPHE, LISTE et IMAGE.

Voilà ce que cela donne dans Jaxe :

L'élément PARAGRAPHE, que l'on définit ensuite, a une particularité : il peut contenir du texte, mais aussi d'autres éléments. Son type doit être un Type complexe avec l'attribut mixed="true". Pour référencer les éléments que l'on peut mélanger à du texte, on peut utiliser un Groupe, une sorte d'élément virtuel permettant de référencer plus facilement un ensemble d'éléments dans le schéma, sans que cela apparaisse dans les documents XML conformes à ce schéma. On peut par exemple nommer ici ce groupe "texte", et y faire référence dans les règles de l'élément PARAGRAPHE avec un Groupe avec l'attribut ref="texte".

Les autres éléments sont définis un peu de la même manière : LISTE est une séquence de EL, EL est un choix de LISTE et du groupe texte (pour permettre la création de sous-listes), EMPHASE et CODE sont définis comme TITRE sous la forme d'un simple xs:string.

Les éléments IMAGE et LIEN ont aussi une particularité : ils ont un attribut. Un élément avec des attributs peut être défini comme type complexe même s'il n'a pas de sous-élément, les attributs étant définis à l'intérieur de Type complexe. Par exemple, l'attribut "fichier" de l'élément IMAGE est défini avec un élément Attribut ayant les attributs name="fichier", type="xs:string" et use="required".

Pour finir, le groupe texte est défini ainsi :

On obtient au final le fichier suivant : DOC2.xsd.

Dans le fichier de config, on fait référence au fichier du schéma en indiquant le chemin relatif, et en précisant quel est l'élément racine du langage. On place en général le fichier du schéma au même endroit que le fichier de config, dans le répertoire config de Jaxe.

Un éditeur moyen...

Une fois le langage défini, on peut déjà éditer des documents avec dans Jaxe... mais l'interface d'édition n'est pas terrible : il n'y a pas de menu pour le langage, tous les éléments sont affichés de la même façon, etc...

La différence entre Jaxe et un éditeur quelconque est justement qu'il est possible de configurer l'interface pour le langage XML choisi. C'est ce qui vient dans les étapes suivantes.

Si vous êtes arrivé jusque là, vous pouvez quand même déjà faire un essai : choisissez le menu "Ouvrir la configuration..." dans Jaxe, et sélectionnez votre nouveau fichier de config (une autre manière de faire est de placer le fichier de config dans le dossier config, de faire "Nouveau...", et de sélectionner la racine DOCUMENTATION). Les 3 panneaux de gauche fonctionnent déjà : on voit la liste des éléments que l'on peut insérer à un endroit donné, l'arbre du document et les attributs de l'élément courant. On peut aussi insérer des éléments avec le menu contextuel.

Définition des menus

Lorsque l'on commence à avoir de nombreux éléments dans le langage, il devient important de les organiser pour pouvoir insérer les éléments plus facilement qu'à partir d'une liste de 100 éléments dans l'ordre alphabétique : c'est l'objectif des menus d'insertion dans Jaxe.

On va préparer des menus d'insertion pour tous les éléments du langage (à part la racine qui est automatiquement ajoutée aux nouveaux documents), en les organisant dans 3 menus : Organisation, pour l'organisation du document, Blocs pour les éléments de bloc (qui ne sont pas mélangés avec du texte), et Texte pour les éléments que l'on peut mélanger avec du texte. On peut en profiter pour spécifier des raccourcis clavier pour insérer très rapidement des éléments que l'on utilise fréquemment : p pour PARAGRAPHE, et t pour TITRE.

Voilà ce que ça donne :

Affichage des éléments

Cette section est peut-être la plus importante dans Jaxe : il s'agit de définir la façon dont les éléments vont être affichés et édités dans Jaxe. Il existe un certain nombre de types d'affichage, définis en détail dans la documentation sur la syntaxe. Le type d'affichage par défaut est string : il affiche juste une balise de début et une balise de fin pour entourer le contenu de l'élément, sans aucune indentation automatique.

Voilà quelques types d'affichage que l'on peut choisir pour notre exemple :

DOCUMENTATION : division (deux grandes barres pour les balises)
TITRE : string (deux balises normales)
SECTION : division
PARAGRAPHE : zone (deux balises avec des sauts de ligne)
LISTE : liste (liste à puces)
EL : item (puce)
IMAGE : fichier (image)
EMPHASE : string
CODE : string
LIEN : string

Le type fichier, par exemple, permettra l'affichage automatique de l'image pointée par l'élément IMAGE. Pour que Jaxe sache quel attribut pointe vers le fichier, il faut cependant ajouter un paramètre à l'affichage d'élément : en l'occurrence, il faut utiliser un paramètre avec le nom srcAtt et la valeur fichier (le nom de l'attribut de IMAGE qui pointe vers le fichier).

D'autres paramètres peuvent être utilisés pour obtenir une interface d'édition agréable : "style" "GRAS" pour l'élément TITRE, "style" "ITALIQUE" pour l'élément EMPHASE, et "police" "MONOSPACED" pour l'élément CODE.

Voilà comment cette partie de la configuration apparaît dans Jaxe :

Un point à ne pas oublier est que si l'on ne trouve pas son bonheur parmi les types d'affichage prédéfinis de Jaxe, il est toujours possible d'en créer un nouveau sous forme de plugin, comme décrit dans le "guide développeur". Jaxe est capable d'afficher n'importe quel composant graphique Java dérivant de la classe JComponent pour permettre l'édition d'un élément XML.

Exports

Tout ceci permet de faire de beaux fichiers XML, mais ils ne sont pas très utiles en tant que tels. Il reste donc à les exporter vers d'autres langages, en particulier HTML pour pouvoir obtenir des pages web. Pour cela, on ajoute au fichier de config un élément Exports qui contient un Export avec la sortie HTML. A l'intérieur, on pointe vers un fichier XSL qui définit la transformation depuis notre langage vers HTML. Ce fichier XSL peut être créé avec Jaxe, à partir de la config "XSLT" (voir plus loin comment faire).

L'ajout d'un export HTML dans la config provoquera l'activation du menu Fenêtre HTML dans le menu Fenêtres de Jaxe. La transformation sera effectuée à chaque fois que le menu sera invoqué, et à chaque fois qu'une mise à jour sera demandée par l'utilisateur.

Textes

L'interface obtenue à ce point est utilisable, mais on peut souhaiter aller plus loin avec les textes affichés, pour :

choisir un texte affiché dans le dialogue "Nouveau" de Jaxe
changer les titres des menus
changer les titres des éléments sur les balises quand ils sont affichés dans Jaxe
ajouter une documentation pour chaque élément, facilement accessible pour les utilisateurs
changer les titres pour les valeurs d'attributs
faire tout ceci dans plusieurs langues sans avoir à changer le schéma (la langue étant choisie automatiquement pour l'utilisateur en fonction de la langue sélectionnée dans son système d'exploitation)

Tout ceci peut se faire avec l'élément Textes des fichiers de config. Dans cet exemple, on se contentera juste de définir un petit texte affiché dans le dialogue de création d'un nouveau document, avec Description de la config.

Création de la feuille de style

On crée un document XSLT en choisissant le menu "Nouveau" et en choisissant "stylesheet - XSLT". Les fichiers XSLT mélangent plusieurs langages XML dans un document. On voit ici des menus pour XSLT et des menus pour XHTML (la configuration de Jaxe pour XSLT inclut la configuration pour XHTML).

Il faut commencer par préciser la version de XSLT que l'on utilise en mettant la valeur "1.0" à l'attribut version de la racine. On précise ensuite quelle sortie on veut obtenir pour la transformation. Par exemple, pour obtenir du XHTML, on utilise xsl:output avec les attributs :

doctype-public="-//W3C//DTD XHTML 1.0 Strict//EN"
doctype-system="http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"
encoding="ISO-8859-1"
indent="yes"
method="xml"

Remarque : Internet Explorer (avant la version 9) ne sait pas afficher un document XHTML quand il est envoyé avec le type MIME correct, application/xhtml+xml. On peut donc souhaiter utiliser la méthode de sortie html avec une DTD pour HTML 4 à la place. XSLT permet de réaliser une sortie au format HTML bien qu'il s'agisse d'un langage SGML et non d'un langage XML comme XHTML. La solution consistant à envoyer des documents XHTML avec le type MIME de HTML est déconseillée.

De manière générale, il suffit ensuite d'indiquer pour chaque élément un équivalent HTML. Par exemple, pour que CODE soit affiché comme avec tt en HTML, on utilise un élément template de XSLT avec la valeur "CODE" pour l'attribut match, et on place à l'intérieur l'élément tt de HTML, en appliquant récursivement les autres règles à l'intérieur avec l'élément apply-templates de XSLT :

Peu d'éléments XSLT sont nécessaires pour cet exemple. Il n'est en effet pas difficile de créer des feuilles de style XSLT pour des transformations XML simples, et XSLT est bien adapté à ce genre de transformations. Voilà la liste des éléments XSLT qui sont utilisés ici :

stylesheet : l'élément racine de la feuille de style
template : un modèle de transformation, pour un élément du langage de départ (avec l'attribut match) ou pour l'élément courant (quand on utilise le nom du template avec l'attribut name). Ici on n'aura besoin que de l'attribut match.
if : bloc de test utilisant une expression XPath.
value-of : renvoie la valeur de l'expression XPath.
apply-templates : applique les règles des templates pour les éléments donnés par l'attribut select. Un attribut select vide signifie simplement l'application des règles pour tous les éléments enfants de l'élément courant.

Voyons donc la liste des templates utilisés.

DOCUMENTATION

Ici on crée la structure du document XHTML, avec les éléments html, head et body. Le titre du document est extrait de l'élément TITRE sous DOCUMENTATION, et il est aussi utilisé à l'intérieur de body dans un élément h1 (quand il est défini). Les règles sont appliquées ensuite à l'intérieur de body.

TITRE

Comme la sortie du titre dépend de l'élément parent, on gère sa sortie dans les éléments parents, DOCUMENTATION, SECTION et PARAGRAPHE. On doit quand même définir le template pour TITRE, sinon le texte du titre sortirait au moment du apply-templates utilisé dans les éléments parents (le template par défaut sort le contenu d'un élément sous forme de texte, et applique les règles pour les enfants).

SECTION

On utilise un élément div pour les sections, avec le titre dans un h2 au début.

PARAGRAPHE

La règle pour l'élément PARAGRAPHE est très similaire.

LISTE

L'élément LISTE correspond à l'élément ul en XHTML.

EL

L'élément de liste (EL) correspond à l'élément li en XHTML. Comme spécifié dans la config Jaxe de XHTML, li s'affiche sous forme de pastilles.

IMAGE

Pour les images, on utilise l'élément XHTML img à l'intérieur d'un div. Le chemin vers l'image vient de l'attribut fichier de l'élément IMAGE, que l'on écrit @fichier avec XPath. L'affichage de l'image ne marche pas bien ici : en effet, Jaxe essaye d'afficher directement l'image comme spécifié dans la configuration pour XHTML, mais le fichier "{@fichier}" n'est bien sûr pas trouvé. On pourrait corriger ce problème en faisant une configuration XHTML spéciale que l'on n'utiliserait qu'avec XSLT, et qui n'essayerait pas d'afficher l'image. Mais le problème n'est pas très grave: c'est juste l'affichage du fichier XSLT dans Jaxe qui n'est pas très beau.

CODE, EMPHASE, LIEN

Les templates pour les éléments CODE, EMPHASE et LIEN s'écrivent facilement avec leurs correspondants XHTML : tt, em et a. On utilisera l'attribut href="{@href}" pour a, pour faire référence à l'attribut href de LIEN.

Voilà le fichier XSL terminé.