<?xml version="1.0" encoding="iso-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
      "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="content-type"
  content="application/xhtml+xml; charset=iso-8859-1" />
  <title>Éditer avec des modèles</title>
  <meta name="generator" content="amaya 9.53, see http://www.w3.org/Amaya/" />
  <link href="style.css" rel="stylesheet" type="text/css" />
</head>

<body xml:lang="fr" lang="fr">

<div class="PageHead">
Amaya<img alt="logo" src="../../resources/icons/22x22/logo.png" class="logo" /> 

<p class="nav"><a href="EditChar.html.fr" accesskey="p"><img alt="previous"
src="../../resources/icons/misc/left.png" /></a> <a href="Manual.html.fr"
accesskey="t"><img alt="top" src="../../resources/icons/misc/up.png" /></a> <a
href="Changing.html.fr" accesskey="n"><img alt="next"
src="../../resources/icons/misc/right.png" /></a></p>
</div>

<div class="PageBody" id="modèles">
<h2 id="Templates">Éditer avec des modèles</h2>

<h3 id="What">Qu'est-ce qu'un modèle ?</h3>

<p>Les modèles sont utilisés pour produire plusieurs documents du même type. Un
modèle est un squelette représentant ce type de document, exprimé dans le
format du document final à produire (par exemple XHTML). Le format du document
final est appelé le langage cible et doit être un langage XML.</p>

<p>Dans un modèle, le squelette du document contient des déclarations,
exprimées dans le langage XTiger (eXtensible Templates for Interactive Guided
Editing of Resources), qui spécifient comment le document minimal peut évoluer
et grossir, en respectant le type de document final désiré.</p>

<p>Les documents produits à partir de ce squelette en suivant les déclarations
XTiger sont appelés des <em>instances</em> du modèle. Certaines parties du
modèle peuvent être figées, si elles doivent apparaître dans les instances
telles quelles. Certaines parties peuvent être modifiées quand une instance de
document est produite, certaines autres peuvent être ajoutées, librement ou
sous certaines contraintes.</p>

<p>Le fichier contenant le modèle doit avoir l'extension <code>.xtd</code>.</p>

<p>Un modèle est souvent accompagné d'un ensemble de ressources attachées
(images, feuilles de style, scripts). Un modèle est une ressource web, qui peut
être stockée dans le système de fichiers local ou partagé sur un serveur
web.</p>

<h3 id="L65">Créer un modèle</h3>

<p>Vous pouvez créer vos propres modèles, en utilisant le langage XTiger.
Cependant, Amaya fournit un support spécifique pour la création et la mise à
jour des modèles.</p>

<p>L'approche proposée est de :</p>
<ul>
  <li>Créer d'abord un squelette d'instance de document (fichier .html) vous
    voulez engendrer.</li>
  <li>Sélectionner l'onglet Modèle (Tpl) de l'outil <strong>Eléments</strong>
    et cliquer sur la première entrée "<em>Créer un modèle depuis le document
    courant</em>" pour engendrer un modèle (fichier .xtd) à partir du squelette
    de document.</li>
  <li>Vous pouvez aussi créer une nouvelle librairie XTiger (fichier .xtl) vide
    avec l'entrée "<em>Créer une librairie</em>".</li>
  <li>Quand un document modèle ou une librairie XTiger est sélectionné,
    plusieurs entrées de l'outil Modèle sont disponibles : 
    <ul>
      <li>L'entrée "<em>Créer un composant</em>" engendre un élément
        <code>component</code> qui sera affiché dans la section
        <code>head</code> du document modèle. 
        <p>Si la sélection n'est pas vide, le contenu de la sélection devient
        le contenu du composant. Un élément <code>use</code> est créé à la
        position courante du document pour indiquer que composant est utilisé à
        cette position. La sélection doit être valide (seulement des éléments
        complets ou une chaîne de caractères). La commande demande à
        l'utilisateur de saisir le nom du <code>component</code>. Ce nom doit
        être unique et est utilisé pour afficher la structure des documents
        instances du modèle.</p>
        <p class="Note"><strong>Note :</strong> Le contenu du composant ne
        pourra pas être édité dans les instances du modèle. L'utilisateur doit
        insérer des éléments <code>use</code> et/ou <code>bag</code> dans le
        composant pour définir des zones éditables. Ces zones peuvent être
        définies avant ou après la création du composant.</p>
        <p></p>
      </li>
      <li>L'entrée "<em>Créer une nouvelle union de types</em>" engendre un
        élément <code>union</code> qui définit un nouveau type comme le choix
        entre des types de base (<code>number</code>, <code>string</code>), ou
        des éléments du langage cible (div, h1, h2, p, ...) et des noms de
        <code>component</code>. La sélection courante n'a aucun effet. La
        commande demande à l'utilisateur de saisir le nom de
        l'<code>union</code>. Ce nom doit être unique. 
        <p></p>
      </li>
      <li>L'entrée "<em>Importer une librairie</em>" engendre un élément
        <code>import</code> qui insère les déclarations de la librairie
        référencée à cette position. 
        <p></p>
      </li>
      <li>L'entrée "<em>Créer une zone de texte</em>" engendre un élément
        <code>use</code> qui permet d'insérer une chaîne de caractères dans les
        instances du modèles. La commande demande à l'utilisateur un
        <em>label</em>. Ce label est libre et est utilisé pour afficher la
        structure des documents instances du modèle. La sélection doit être une
        chaîne de caractères qui devient la <em>valeur initiale</em> de
        l'élément <code>use</code>. 
        <p></p>
      </li>
      <li>L'entrée "<em>Utiliser un composant ou un élément</em>" engendre un
        nouveau élément <code>use</code>. 
        <p>Si la sélection est vide, un dialogue propose la liste des éléments
        qui peuvent être insérés à cette position et demande à l'utilisateur le
        <em>label</em> associé à élément <code>use</code> (comme pour l'entrée
        précédente). Un élément <code>use</code> vide est engendré.</p>
        <p>Si un élément du langage cible (div, h1, h2, p, ...) est
        sélectionné, un élément <code>use</code> qui permet d'insérer ce type
        d'élément est engendré à cette position. L''élément sélectionné devient
        le <em>contenu initial</em> de l'élément <code>use</code>. La commande
        demande seulement à l'utilisateur un <em>label</em>.</p>
        <p></p>
      </li>
      <li>L'entrée "<em>Répéter l'utilisation courante"</em> engendre une
        répétition (<code>repeat</code>) de l'élément <code>use</code>
        sélectionné. La commande demande à l'utilisateur un <em>label</em>. Ce
        label est libre et est utilisé pour noter la répétition dans la
        structure des documents instances du modèle. 
        <p></p>
      </li>
      <li>L'entrée "<em>Créer et répéter un composant</em>" engendre à la fois
        un élément <code>use</code> et un élément <code>repeat</code>. 
        <p></p>
      </li>
      <li>L'entrée "<em>Créer une zone d'édition libre</em>" engendre un
        élément <code>bag</code>. La commande demande à l'utilisateur un
        <em>label</em>. Ce label est libre et est utilisé pour afficher la
        structure des documents instances du modèle. 
        <p>Par défaut l'élément <code>bag</code> autorise l'insertion multiple
        de n'importe quel élément du langage cible et de tous les composants
        définis dans le modèle (<code>types="any"</code>). L'utilisateur doit
        éditer l'attribut <code>types</code> dans le panneau <em>Attributs</em>
        pour modifier cette valeur par défaut.</p>
      </li>
    </ul>
  </li>
  <li>Le modèle ou la librairie XTiger créé peut être enregistré n'importe où,
    dans votre système de fichiers local ou à distance.</li>
</ul>

<h3 id="Visualizin">Visualisation des éléments du modèle</h3>

<p>Quand un modèle est affiché, Amaya montre les éléments XTiger sous la forme
de cadres colorés qui englobent les éléments XHTML.</p>
<ul>
  <li>L'élément head qui englobe les éléments <code>component</code>,
    <code>union</code>, and <code>import</code> est affiché avec un fond
  gris.</li>
  <li>Un élément <code>use</code> est une boîte avec un cadre hachuré bleu.
    Quand son contenu est du texte, la boîte a un fond bleu clair.</li>
  <li>Un élément <code>bag</code> est une boîte à fond vert clair avec un cadre
    hachuré vert.</li>
  <li>Un élément <code>repeat</code> est une boîte avec une icône <img
    alt="icône repeat" src="../../resources/icons/16x16/TEMPLATE_repeat.png"
    width="16" height="16" /> en haut à gauche.</li>
  <li>Un élément <code>attribute</code> n'est pas affiché dans la Vue
  formatée.</li>
</ul>

<p>Les éléments XTiger peuvent aussi être vus dans la <em>Vue structure</em>
(ouvrez cette vue avec l'entrée <strong>Montrer la structure</strong> dans le
menu <strong>Affichage</strong>). Dans la Vue structure, les éléments XTiger
sont affichés en doré, alors que les éléments XHTML sont affichés en bleu. Les
éléments XTiger sont aussi montrés dans la vue source, mais sans couleur
spéciale.</p>

<p>Un autre moyen de comprendre la structure imbriquée des éléments XTiger avec
les éléments XHTML est le <strong>chemin de la sélection</strong> affiché dans
la barre de statut (en bas de la fenêtre). Là, vous pouvez voir tous les
éléments de la structure du document depuis l'élément racine jusqu'à la
sélection. Ce chemin est mis à jour chaque fois que la sélection change. Dans
ce chemin, les éléments XTiger sont affichés en doré et les éléments XHTML sont
affichés en noir. Pour les éléments XTiger, ce n'est pas le nom de l'élément
qui est affiché ici (<code>use</code>, <code>bag</code>, <code>repeat</code>)
mais le label attaché à ces éléments, comme déclaré dans le modèle.</p>

<p></p>

<h3 id="Selecting">Sélectionner un modèle</h3>

<p>Vous pouvez sélectionner vos propres modèles ou utiliser les modèles
disponibles sur le site web d'Amaya <a
href="http://www.w3.org/Amaya/Templates/">http://www.w3.org/Amaya/Templates/</a>.</p>

<p>Pour faciliter la sélection parmi vos modèles préférés, il y a une section
<strong>Modèles</strong> dans le dialogue des Préférences
(<strong>Édition/Préférences</strong>, ou <strong>amaya/Préférences</strong>
sous Mac OS X). Utilisez ces préférences pour enregistrer les modèles qu'Amaya
proposera quand vous créerez un nouveau document.</p>

<p>Quand vous voulez enregistrer un modèle local, vous pouvez appeler
l'explorateur de fichiers avec le bouton pour localiser et sélectionner les
modèles à ajouter. Vous pouvez aussi entrer l'URI des modèles distants dans la
zone d'entrée en dessous de la liste. Utilisez les boutons situés sur le côté
droit de la liste pour retirer le modèle sélectionné ou changer l'ordre dans la
liste des modèles.</p>

<p>L'enregistrement des modèles n'est pas obligatoire. Quand vous créez une
nouvelle instance, vous pouvez aussi choisir un modèle qui n'est pas dans cette
liste.</p>

<h3 id="Creating">Créer une instance de document</h3>

<p>Pour créer un nouveau document depuis un modèle, utilisez l'entrée
<strong>Nouveau/Nouveau document</strong> du menu <strong>Fichier</strong>. Un
<a href="Document.html.fr">dialogue</a> s'affiche dans lequel vous pouvez
sélectionner :</p>
<ul>
  <li>Le modèle, soit en sélectionnant dans la liste des modèles enregistrés,
    soit en tapant l'URI ou le nom de fichier d'un modèle qui n'est pas dans la
    liste,</li>
  <li>L'URI ou le nom du fichier du document instance à créer,</li>
  <li>Où ouvrir le nouveau document (Remplacer le document courant, Dans un
    nouvel onglet, Dans une nouvelle fenêtre),</li>
  <li>Le titre du nouveau document qui sera affiché par les navigateurs (un
    titre par défaut est engendré quand l'utilisateur le ne spécifie pas).</li>
</ul>

<h3 id="Editing">Editer un document instance</h3>

<p>Quand une instance de modèle est créée ou ouverte, Amaya affiche côte à côte
la <em>Vue formatée</em> et la <em>Vue structure</em> du document.</p>

<p>Dans la <em>Vue formatée</em> :</p>

<p>L'édition n'est autorisée que dans les éléments <code>repeat</code>,
<code>use</code>, et <code>bag</code>, c'est-à-dire dans les boîtes colorées
hachurées. Le reste du document est la partie figée du modèle et ne peut pas
être modifié.</p>
<ul>
  <li>Les zones où l'utilisateur peut éditer sont entourées de cadres colorés :
    <ul>
      <li>Un cadre bleu entoure une zone où l'utilisateur peut insérer du texte
        (élément <code>use</code>).</li>
      <li>Un cadre vert entoure une zone où l'utilisateur peut insérer des
        éléments ou des chaînes de caractères (élément <code>bag</code>).</li>
    </ul>
  </li>
  <li>Des boutons <strong style="color:#7f7f7f">+</strong> permettent
    d'afficher un menu et insérer un des nouveaux éléments proposés dans le
    menu à la position courante (dans des éléments <code>repeat</code> ou
    <code>bag</code>).</li>
  <li>Les éléments <code>attribute</code> agissent seulement sur l'outil
    <strong>Attributs</strong>.</li>
</ul>

<p>Dans la <em>Vue structure</em> :</p>
<ul>
  <li>Les labels des éléments XTiger sont affichés sur un fond coloré :
    <ul>
      <li>Un fond gris pour des éléments <code>use</code> non actifs.</li>
      <li>Un fond doré pour des éléments <code>use</code> actifs.</li>
      <li>Un fond doré clair pour des éléments <code>repeat</code> actifs.</li>
      <li>Un fond vert clair pour des éléments <code>bag</code> actifs.</li>
    </ul>
  </li>
  <li>Avec les éléments actifs,
    <ul>
      <li>Un clic sur le label, ou la moitié haute de la barre verticale
        associée, affiche un menu qui permet d'insérer un nouvel élément
        proposé avant.</li>
      <li>Un clic sur la moitié basse de la barre verticale associée, affiche
        un menu qui permet d'insérer un nouvel élément proposé après.</li>
    </ul>
  </li>
</ul>

<h4 id="Editing1">Edition dans un élément <code>repeat</code></h4>

<p id="Editing11">Dans une boîte <code>repeat</code>, vous pouvez créer de
nouvelles instances de la structure répétée ou en détruire une. Ceci est
contrôlé par le modèle, qui peut imposer un nombre minimum et/ou maximum
d'occurrences de la structure répétée.</p>

<p id="Editing111">Quand la création de nouvelles occurrences de la structure
répétée est autorisée, des icônes <strong style="color:#7f7f7f">+</strong> sont
affichées aux emplacements où cette création est possible. Cliquez sur une des
ces icônes pour créer une nouvelle occurrence. Un menu vous donne la liste des
éléments qui peuvent être créés à cette position. En sélectionnant une entrée
de ce menu, vous créez une nouvelle occurrence du type correspondant. Dans
certains cas, le modèle n'offre qu'un seul type. Le menu ne contient alors
qu'une seule entrée, pour clairement informer l'utilisateur de ce qui va être
créé. Si vous cliquez en dehors du menu, rien ne sera créé.</p>

<p>Une autre façon de créer des occurrences de la structure répétée est de
sélectionner une occurrence existante, ou d'ajouter un point d'insertion à la
fin d'une occurrence, et d'appuyer sur la touche <kbd>Entrée</kbd>. Une
nouvelle instance de la structure répétée est ainsi créée, à condition que le
nombre maximum d'occurrences ne soit pas déjà atteint. La nouvelle occurrence
créée est alors du même type que l'occurrence sélectionnée quand on a appuyé
sur la touche <kbd>Entrée</kbd>.</p>

<p>Quand une occurrence existante est vide ou complètement sélectionnée et que
la touche <kbd>Arrière</kbd> ou <kbd>Suppr</kbd> est pressée, l'élément est
détruit, à condition que le nombre minimum d'occurrences de la structure
répétée ne soit pas déjà atteint.</p>

<h4 id="Editing3">Edition dans un élément <code>use</code></h4>

<p>La plupart des éléments <code>use</code> (bleu) vous permettent juste
d'insérer du texte libre ou de remplacer/éditer le texte existant. D'autres
éléments <code>use</code> offrent le choix parmi différents types d'éléments
qui peuvent être insérés à cette position. Dans ce cas, une icône triangulaire
bleue est affichée dans le coin haut gauche de la boîte. En cliquant sur cette
icône, vous pouvez choisir un de ces types dans le menu affiché. Quand le type
est choisi, la structure correspondante est engendrée et vous pouvez librement
éditer son contenu.</p>

<h4 id="Editing4">Edition dans un élément <code>bag</code></h4>

<p>Dans une boîte <code>bag</code> (verte), vous pouvez insérer n'importe quel
nombre d'éléments des types spécifiés par le modèle. Quand vous voulez insérer
un élément XHTML, faite le de la façon habituelle, à condition que le modèle
autorise ce type d'élément. Il se peut que des éléments ne soient pas
autorisés. Les éléments autorisés sont proposés dans les sous-menus
<strong>Insérer</strong> et <strong>Ajouter</strong> du menu contextuel. Les
<em>composants</em> définis par le modèle sont aussi proposés dans les
sous-menus <strong>Insérer</strong> et <strong>Ajouter</strong> du menu
contextuel.</p>
</div>
</body>
</html>
