User Guide

Guide SCENARIbuilder
Tutoriel HelloWorld & HelloUniverse pour SCENARIbuilder
2.3 (SCENARIbuilder 3.6)
scenari-platform.org 2009
Version du document Date Editeur Rdacteurs
2.3 (SCENARIbuilder 3.6) 12/11/2009 UTC
Stphane Poinsart <stephane.poinsart@utc.fr> Contributions : Julie Wojcicki <julie.wojcicki@kelis.fr> Latitia Leboeuf <laetitia.leboeuf@utc.fr> Licence Creative Commons - Paternit - Pas d'Utilisation Commerciale 2.0 France
I Sommaire
I Sommaire..............................................................................................................................3 II Introduction.........................................................................................................................5 .................................................................................................................................................5 III HelloWorld..........................................................................................................................6 .................................................................................................................................................6

1 Structure du modle..............................................................................................................................8 2 Gnrateur Open Document Text........................................................................................................14 3 Gnrateur HTML................................................................................................................................22 4 Diffusion...............................................................................................................................................27 5 Bilan.....................................................................................................................................................28
IV HelloUniverse...................................................................................................................30 ...............................................................................................................................................30
1 Mthodologie.......................................................................................................................................30 2 Mise en place.......................................................................................................................................34 3 Les donnes de type "formulaire"........................................................................................................42 4 Pages de la publication........................................................................................................................49 5 Les axis...............................................................................................................................................55 6 Stylage HTML......................................................................................................................................60 7 Stylage OpenDocument Text...............................................................................................................70 8 Stylage Interface Auteur......................................................................................................................75 9 Constructeur d'application...................................................................................................................75 10 Conclusion.........................................................................................................................................77
Sommaire
V Glossaire...........................................................................................................................78 ...............................................................................................................................................78 VI Copies d'cran.................................................................................................................79 ...............................................................................................................................................79
Sommaire
II Introduction
Ce guide : Vous apprend crer des modles documentaires Scenari, des gnrateurs OpenDocument Text et HTML. N'est pas exhaustif (la quantit de chose apprendre est importante et volue rgulirement). S'adresse aux personnes profils techniques, qui maitrisent bien les outils informatiques, le HTML / CSS, l'utilisation d'OpenOffice... N'hsitez pas demander de l'aide sur les forums.
Introduction
III HelloWorld
Objectif Cette partie vous apprendra en quelques heures concevoir un modle le plus simple possible (la tradition souhaite qu'un tel exemple soit appel HelloWorld, mais appliqu aux chanes ditoriales ce n'est pas prendre au sens strict). En rsultat, vous aurez donc un micro modle, avec la structure suivante : un ensemble de parties, avec pour chacune un titre. Ce petit modle n'en sera pas moins une vraie chane ditoriale, ce qui explique sa complexit : il faut assembler certains composants indispensables toute chane, mais une fois en place les modifier ou en rajouter est une opration relativement simple.
cran 1 L'interface d'dition du modle Helloworld
HelloWorld
cran 2 Les deux suports de publication du modle Helloworld
La structure du modle HelloWorld Nous allons dcouper le modle HelloWorld en 4 tapes de conception.
HelloWorld
Au menu : 1. Structure du modle : les items, les parties, les champs de donnes utilisables dans l'interface de l'auteur. C'est la partie indispensable tout modle, et par celle-l que nous allons commencer. 2. Gnrateur OpenDocument Text : la transformation du contenu en un fichier .odt (ou pdf) et son stylage. 3. Gnrateur HTML : la transformation du contenu en un site web et son stylage. 4. Diffusion : crer des WSPpack pour SCENARIchain, crer des applications standalone*.
1 Structure du modle
Mise en place
Objectifs Vous avez un projet "HelloWorld", techniquement la premire tape dans le dbut de chaque projet, c'est de prparer un atelier, ce qui est dcrit dans cette premire partie "mise en place". Prrequis Vous devez avoir SCENARIbuilder et OpenOffice.org installs sur votre ordinateur avant de commencer ce tutoriel.
Cration de l'atelier Dans SCENARIbuilder, il est courant de faire un atelier par nouveau modle ou par famille de modles. Vous allez crer un atelier HelloWorld en cliquant dans le menu sur Atelier/Ajouter un atelier.
Votre nouvel atelier est totalement vide, vous allez crer un espace* helloworld l'aide du bouton Les modelets Les modelets sont des bibliothques d'items prfabriqus, des listes de fichiers (.model ou .transf...) qui permettent un modlisateur d'avoir des lments prts tre intgrs dans le modle, ce qui est plus pratique que de commencer avec un atelier totalement vide.
Les modelets Commencez par cliquer sur le lien ci-dessus modelets base et binaries permettant de tlcharger le fichier zip qui regroupe ces modelets. Pour trouver le rpertoire dans lequel l'extraire : Faites un clic droit sur l'espace helloworld que vous avez cr ; Puis cliquez sur rvler dans le systme de fichier ; Remontez au rpertoire parent helloworld qui contient deux rpertoires respectivement ~gen et sources ; Copiez votre fichier zip nomm binaries_base.zip dans le rpertoire sources et extrayez-le cet emplacement ;
Actualisez l'atelier en passant par le bouton d'action
situ sur la barre de titre de l'atelier.
Vous devriez obtenir l'arborescence suivante : Les autres modelets Pour d'autres besoins spcifiques, d'autres modelets sont disponibles sur le wiki du projet modelet.
HelloWorld
cran 4
cran 3
Composants du modle
Les items Comme dans SCENARIchain, un atelier contient des items, et chaque item a : un nom de fichier ; un type. En gnral, les items SCENARIbuilder ont aussi des proprits du type : code * : identifiant utilis en interne par le systme SCENARI. Cela doit tre une suite de caractres alphabtiques, courte de prfrence, o il est d'usage de le faire correspondre au nom du fichier (sauf cas particulier).
HelloWorld
name : le nom tel que l'auteur peut le lire dans l'interface d'dition. Il peut contenir des espaces et des caractres accentus. Pour dfinir la structure de votre premier modle, vous allez devoir crer 3 items, et faire appel 2 items du rpertoire modelets.
les fichiers .wspdef Dans l'atelier qui reprsente un espace de travail, vous pouvez avoir plusieurs dclinaisons d'un modle ou plusieurs modles diffrents (par exemple, SCENARIdiscovery est compos de 6 modles, mais les sources SCENARIbuilder sont dans un mme atelier). Le fichier qui sert de point central chaque modle est un fichier .wspdef, chacun reprsente un modle ou une variation de modle distinct.
helloworld.wspdef Nous commencerons donc par crer le fichier helloworld.wspdef en cliquant sur le Bouton puis gestion des ateliers -> wspDefinition. Saisissez en premier tous les champs suivants :
cran 5
10
HelloWorld
Dans le fichier wspdef vous dfinissez : keyWsp : le code* de l'atelier. majorVersion, mediumVersion, minorVersion : par exemple, nous crons le modle helloworld version 0.0.1. Le changement de version peut avoir des consquences sur les mises jours lors de la diffusion du modle, hors propos pour ce simple exemple. mainView : liste les onglets qui apparaissent pour un item externe de l'interface d'dition. Pour ce dbut de helloworld, mettez simplement l'onglet dition, nous ajouterons plus tard l'onglet publication. La capture d'cran suivante vous permet de visualiser les deux onglets :
publicClasses : liste des items que l'auteur va avoir le droit de crer en item externe. Il faut donc au minimum spcifier un item qui dans le cas de helloworld sera la racine* du document. Dans notre modle, nous allons permettre l'auteur de crer des items de type "helloworld" partir de l'interface d'dition, nous devons donc crer dans SCENARIbuilder un item correspondant qui est list dans les <publicClasses>. Procdez par clic droit sur l'item vide pour raliser cette opration :
Les fichiers .model Les fichiers .model servent spcifier quels champs ou paragraphes de donnes seront disponibles l'intrieur de l'diteur, de les paramtrer et de choisir comment ils seront organiss entre eux (et implicitement quel sera la structure XML des documents crits par l'auteur lorsqu'ils sont enregistrs).
helloworld.model C'est le moment de choisir un type pour l'item racine. Faites un clic droit sur l'item vide se situant ct de la balise <class> et choisissez Crer un nouvel item, comme sur l'image ci-dessous :
Dans le reste de ce tutoriel, cette mthode sera utiliser pour la plupart des crations d'items. L'cran de cration des items s'ouvre, vous allez choisir Primitives -> Primitives d'organisation -> compositionPrim . Les compositionPrim sont utilises pour tous les contenus organiss en parties, chapitres, blocs d'informations, sections...
cran 6
11
HelloWorld
Reproduisez la structure de la capture d'cran prcdente. Quelques particularits des compositionPrim : namespace, prefix : En plus du code, elles sont mises en commun par un namespace, et sa version abrge, le prfixe. Dans les cas courants, vous allez dclarer toujours le mme namespace et prfixe pour tous les fichiers d'un atelier builder. L'intrt principal de ces informations est de permettre diffrents modlisateurs de partager des modles avec le mme nom. Ces noms sont utiliss en interne dans les fichiers de contenu que l'auteur va enregistrer par les diteurs SCENARI. Le prfixe doit tre court et ne pas commencer par la lettre "s" qui est rserve (s pour scenari). part : Une "part" est un champ de contenu qui pourrait avoir une sous-structure, en faisant appel par exemple d'autres compositionPrim. allowedModel : C'est la liste des modles que l'auteur va pouvoir placer l'intrieur de ce champ. Ne crez pas un nouvel item, mais placez-y par glisser-dposer depuis le volet d'exploration * l'lment "paragraphe de texte" du modelet /base/sTxt/sTxt.model que vous avez install au dbut de ce tutoriel. meta : Des mta-donnes associes la <part>. Dans notre modle, les parts ont des titres, nous allons donc utiliser dans les modelets : /base/sTitle/sTitle.model set : Un set signifie que l'auteur pourra crer autant de parts qu'il le souhaite (dans l'diteur, cela dclenche l'ajout d'un bouton * gauche de la part). En l'absence de set, le document ne pourrait contenir qu'une seule partie. usage -> optional, usage -> required : Dans l'interface d'dition, l'auteur de contenu devra obligatoirement remplir toutes les parts qui ont t paramtres par le modlisateur en tant que "required", si ce n'est pas le cas, des croix rouges apparaissent dans le contenu. internalized : En fonction du choix du modlisateur, l'auteur pourra ventuellement, ou sera oblig de crer les parties en tant qu'item externe*. Rappel : il faut aussi que les <allowedModel> des parts soit dclares en tant que <publicClasses> dans le wspdef pour que cette cration d'item soit autorise.
Tester
helloworld.wsptest Flicitation, vous avez cr votre premier modle helloworld... Maintenant, pour l'essayer : crez un fichier wsptest dans l'espace helloworld (toujours par le bouton ); ouvrez le wsptest et par glisser-dposer, reprenez votre fichier wspdef, pour spcifier quel modle vous allez tester ; choisissez compiler et tester.
12
HelloWorld
cran 7 L'interface SCENARItest s'ouvre. C'est une interface d'dition ddie aux tests rapides lors du dveloppement des modles partir de SCENARIbuilder, elle ressemble fort celle de SCENARIchain. Vous pouvez y crer du contenu respectant les rgles de votre modle documentaire : un espace, un item helloworld, des parties... L'cran de contrle En cas d'erreur, ou juste pour vrifier si tout va bien, faites appel l'cran de contrle partir de l'onglet correspondant sur l'item helloworld.wspdef:
13
HelloWorld
cran 9
cran 8 L'interface d'dition du modle Helloworld La gnration A la fin de cette premire partie, votre modle fonctionne dans l'diteur, mais vous n'avez aucun moyen de publier votre contenu. Nous allons maintenant poursuivre notre conception de la chane ditoriale helloworld par la cration de gnrateurs dans la suite de ce document.
2 Gnrateur Open Document Text

Mise en place
Les gnrateurs Si vous crez un modle sans gnrateurs, les auteurs vont pouvoir crire du contenu, mais il ne sortira jamais de sa forme "source XML". Pour transformer les donnes saisies, l'auteur utilise les gnrateurs intgrs au modle. Vous devez crer ces gnrateurs dans SCENARIbuilder, les lier et les adapter la structure de votre modle.
14
HelloWorld
Schma de fonctionnement Dans le schma suivant, nous allons expliquer le fonctionnement commun aux 2 gnrateurs du modle helloworld. Les gnrateurs sont dclars dans le wspdef, en ajoutant un onglet de publication. Un gnrateur possde un ou plusieurs templates, un gabarit qui agence la mise en forme globale d'une page. Pour chaque champ de contenu publier, les gnrateurs font appel au paramtrage des transformeurs : les composants qui permettent le passage des donnes des primitives .model vers un support spcifique. Des fichiers de stylage interviennent aussi, pour dfinir couleurs, polices et images de fond.
Composants du gnrateur
A partir de helloworld.wspdef Vous allez crer le gnrateur HwOd partir du wspdef. A la fin de ce tutoriel, votre wspdef pointera vers 2 gnrateurs comme on peut le voir sur l'cran suivant :
15
HelloWorld
cran 10 Crez le premier en faisant un clic droit sur l'espace helloworld puis choisissez Ajouter un item, puis
Publication -> Gnrateurs 'open document' -> odGenerator

Les fichiers .generator Pour chaque entre souhaite dans les onglets "publication", on cre en gnral 1 fichier .generator. Vous pouvez avoir 2 publications diffrentes dans le format de fichier de sortie, dans le stylage, dans l'agencement des parties, vous pouvez avoir une publication avec les "corrigs" et une sans, et chaque fois cela donne lieu la cration d'un nouveau .generator, qui est le point de dpart de toute nouvelle publication ou dclinaison d'une publication existante.
hwOd.generator Recopiez tous les champs suivants :
16
HelloWorld
cran 11 modelRoot : Dclarez ici les modles autoriss en tant que racine* dans le gnrateur. Vous n'tes pas oblig de dclarer tous les .model s'ils sont utiliss en tant que sous-modles. transformerList : Crez un nouvel item de type publication -> transformerList. Pour cela, faites un clic droit sur l'item vide se situant ct de la balise <transformerList> et choisissez Crer un nouvel item puis publication -> transformerList. Ce fichier sera expliqu dans la partie suivante. odTemplate : De la mme faon ct de la balise <odTemplate>, crez un nouvel item de type publication -> Gnrateurs 'open document' -> odTemplates (modle openDocument) -> odTemplateText. odStyle : Laissez ce champ vide pour l'instant, il dfinit le stylage de chaque lment publi, mais il faut finir les autres parties du gnrateur avant de pouvoir le crer par un mcanisme spcial. Les fichiers .transf Les transformeurs sont utiliss pour traduire une donne crite par l'auteur en donne l'intrieur d'un document publi. Dans les cas les plus simples, on doit en crer un par .model et par gnrateur. Ils sont rfrencs par des listes de transformeurs (fichiers .transflist) pour pouvoir tre exploit par le gnrateur.
hwOd.transflist Le fichier hwOd.transflist permet de lister tous les transformeurs que le gnrateur va utiliser. Ouvrez ce fichier puis cliquez sur l'toile d'insertion se trouvant sous la balise <transformerList> et choisissez <sm :transformer>. Ensuite, faites un clic droit sur l'item vide se situant ct de la balise <transformer> et slectionnez crer un nouvel item de type Publication -> Gnrateurs 'open document' -> Transformers OpenDocument -> compositionOdtTransf. De la mme manire recrer deux balises <transformer>, et par glisser-dposer reprenez les 2 transformeurs, en version _od, ayant une extension .transf contenu dans les modelets (l'un contenu sous /base/sTitle/ et l'autre sous /base/sTxt/).
17
HelloWorld
cran 12
helloworld.transf
cran 13
18
HelloWorld
Le transformeur <compositionOdtTransf> est systmatiquement li un fichier <compositionModel>. Ouvrez le fichier helloworld.transf et glissez-dposez le fichier helloworld.model sur l'item vide se situant ct de la balise <model>. A chaque fois que vous souhaitez voir l'apparition d'un contenu du .model dans votre gnration, vous allez ajouter un sm:for codes="nom_de_partie". Maintenant que notre tranformeur "dtecte" la part, il faut prciser ce qu'il en fait : l'intrieur du <for>, plaons par exemple une balise <heading> (utilise pour faire des parties titres) ; en guise de titre (<title>), nous allons mettre le titre de la part (<partTitle>), ce titre est dfini par les mtas de la part du fichier .model et fera automatiquement appel sTitle_od.transf contenu dans le modelet base, point par notre hwOd.transflist; en guise de contenu, nous allons appeler le modle qui a t dtect par le for : <callSubModel>. Le transformeur sText_od.transf se chargera de ce traitement. Les transformeurs dans les modles plus compliqus Pour helloworld, le rseau de .transf correspond exactement au rseau .model et notre unique <sm:part> de contenu. Ce n'est pas le cas pour tous les modles plus complexes, vous pouvez avoir par exemple, des transformeurs qui ne vont pas dtecter toutes les parts comme dans SimpleSlideShow o des commentaires pour l'orateur n'apparaissent pas dans les publications pour le lecteur. Vous pouvez les rorganiser, par exemple les champs d'tat civil d'un CV ne seront pas forcment publis dans le mme ordre que celui de l'interface d'dition, en plaant les <for> dans un ordre diffrent dans le transformeur. Les templates Les templates dfinissent les proprits du document publi (pour les publications OpenOffice) ou d'un type de page publie (pour les publications HTML), et posent tous les blocs dfinis en dehors des transformeurs, un niveau "au dessus" du contenu.
hwOd.odTemplate Proccupez vous maintenant de lier votre racine de contenu une page. Nous allons faire au plus simple dans ce template de document : un seul type de page ; juste un appel au modle racine du gnrateur (<callRootModel>).
19
HelloWorld
cran 14
Stylage
Les styles Crer un style, c'est appliquer une charte graphique aux lments de contenu et du template. Techniquement, le style est constitu d'un fichier .odStyle.odt pour les gnrateurs OpenOffice ou un ensemble de fichiers .css pour les gnrateurs HTML.
Construire le style Pour obtenir la premire version du fichier de style, vous allez retourner sur le gnrateur, choisir l'onglet Styles et le bouton construire.
20
HelloWorld
cran 15 Une fois la construction des styles termine, suivez les instructions suivantes : Cliquez sur le bouton rvler ; Une nouvelle fentre type "explorateur de fichier" doit s'ouvrir, elle contient le nouveau fichier .odt ; Copiez-le dans l'arbre gauche, de votre atelier builder (par glisser-dposer ou par copier-coller) au niveau de l'espace helloworld ; Retournez sur le fichier hwOd.generator dans l'onglet dition et glissez-dposez le fichier .odStyle.odt depuis l'arbre de SCENARIbuilder vers l'item vide se situant ct de la balise <odStyle>. Quand reconstruire le fichier de style ? A chaque fois que vous modifiez les transformeurs, en particulier si vous en ajoutez ou si vous dclarez des nouveaux codes et que vous souhaitez les restyler, vous devez revenir effectuer une nouvelle construction du fichier odStyle, le retlcharger, et le recopier l'intrieur de votre atelier SCENARIbuilder en crasant l'ancien. A partir du moment o le gnrateur est bien li au style, reconstruire le style n'crasera pas toutes les personnalisations que vous avez pu y effectuer. La reconstruction sert uniquement rajouter les parties manquantes par rapport aux volutions de votre modle dans l'odStyle pour que vous puissiez ensuite les styler. Il n'est pas ncessaire par exemple de le reconstruire aprs l'tape de personnalisation qui est dcrite ci-dessous.
21
HelloWorld
Personnaliser le style Les personnalisations de l'odStyle.odt se droulent dans OpenOffice : il s'ouvre par clic droit sur l'item dans le volet d'exploration, puis rvler dans le systme de fichier. En gnral, le stylage consiste placer son curseur dans le document, sur le contenu d'une zone jaune, faire clic droit > edit paragraphe style. Pour diter d'autres types de styles ou mieux les visualiser, appelez la fentre des styles : pressez [F11]. Les blocs jaunes crs automatiquement sont juste l pour mieux identifier les parties stylables par le modlisateur, mais n'apparaissent pas dans le document qui va exploiter votre style.
cran 16
22
HelloWorld
cran 17 Ne pas slectionner Passez toujours par les modifications du style, ne slectionnez pas directement le texte pour lui attribuer une mise en forme : elle ne serait pas rutilise. Passez toujours par les styles.
3 Gnrateur HTML
Si vous avez russi la partie prcdente "Gnrateur OD" qui est vivement recommande en tant que prrequis celle-ci, vous n'aurez aucun mal faire un gnrateur HTML.
Mise en place
Schma de fonctionnement Les lments du schma pour un gnrateur HTML sont trs semblables notre prcdente ralisation pour la publication OD.
23
HelloWorld
Les diffrences entre gnrateurs HTML et OD Pour effectuer une comparaison (applique notre exemple helloworld) : Le type et le contenu de tous les items sont spcifique la publication HTML (et videment, vous ne pouvez pas faire de copier-coller entre les 2 ou les mlanger). L'odStyle est remplac par un dossier contenant un fichier CSS. Un item uiservice fait son apparition.
Composants du gnrateur
hwWeb.generator Crez un webSiteGenerator partir du wspdef., en suivant la procdure ci-dessous : Ajoutez une balise <genBox> l'aide de l'toile d'insertion ; Faites un clic droit sur l'item vide se situant ct de la balise <genBox> puis cliquez sur Crer un nouvel item et choisissez publication -> Gnrateurs 'web' -> webSiteGenerator. Voici son contenu :
24
HelloWorld
cran 18 Dans un webSiteGenerator, le template correspond un layout de page (l'agencement des lments HTML l'intrieur de la page). Chaque template est associ un code.
hwWeb.uiframe Crez l'uiframe, de type <TransparentUiFrame> pour cela faites un clic droit sur l'item vide se situant ct de la balise <uiFrame>. Ne changez pas le contenu du fichier cr, il est utilis pour les services spciaux (scorm, assessements...) dont nous n'avons pas besoin pour cet exemple. hwWeb.transflist Retourner sur le fichier hwWeb.generator puis faites un clic droit sur l'item vide se situant ct de la balise <transformerList> puis cliquez sur Crer un nouvel item et choisissez publication ->transformerList. Cliquez sur l'toile d'insertion se trouvant sous la balise <transformerList> et choisissez <sm :transformer>. Ensuite, faites un clic droit sur l'item vide se situant ct de la balise <transformer> et slectionnez crer un nouvel item de type Publication -> Gnrateurs 'web' -> Transformers Web -> compositionXhtmlTransf pour notre helloworld.model. De la mme manire recrer deux balises <transformer>, et par glisser-dposer placez les 2 transformeurs, sTitle_web.transf et sTxt_web.transf du modelet base, au niveau des items vides. helloworldWeb.transf La structure souple d'un site web ncessite de dclarer chaque nouvelle page et d'associer cette page un template, en reprenant le mme code que celui spcifi dans le webSiteGenerator. Nous retrouvons ensuite le mme mcanisme <for codes="hello">. Pour ce document qui n'utilise qu'un seul type de partie, nous pouvons aussi crire <for codes="*">. En contenu du <for>, on dclare un <WHeadingBlock>. Lorsque l'on spcifie un class dans un bloc, cela va rajouter dans l'HTML produit un attribut "class=..." que l'on pourrait exploiter l'tape du stylage. Recopiez sur votre fichier les paramtres ci-dessous :
25
HelloWorld
cran 19
26
HelloWorld
hwWeb.uitemplate Retournez sur le fichier hwWeb.generator puis faites un clic droit sur l'item vide se situant ct de la balise <uiTemplate> puis cliquez sur Crer un nouvel item et choisissez publication -> Gnrateurs 'web' -> uiTemplates (modles de pages web) -> openUiTemplate. En crivant un <openUiTemplate>, vous dcrivez assez librement la structure de votre page web : En entte, spcifiez un nom de fichier du type main.css qui sera extrait du rpertoire de ressources hwWeb.doss que vous devez crer aussi. A l'intrieur du body, cliquez sur l'toile d'insertion et slectionnez lments pour faire les <div> suivant vos dsirs de mise en page. Ajoutez un <callMainZone> pour que le rseau de transformeurs prenne la main sur la publication du contenu. Enfin allez au niveau de la balise <resources>, faites un clic droit sur l'item vide se situant ct de cette balise puis cliquez sur Crer un nouvel item et choisissez Ressources -> Dossier de ressources (.doss)
cran 20
Stylage
main.css A l'aide de votre diteur de texte favori crer le fichier main.css. Ensuite, glissez-dposez le fichier main.css dans l'atelier l'intrieur du rpertoire .doss spcifi auparavant dans le template. Cette partie fait appel vos connaissances HTML et CSS, mais voici un petit exemple :
27
HelloWorld
cran 21 Tester plus vite les rsultats des CSS Vous pouvez faire une gnration HTML dans SCENARItest, et modifier le fichier CSS dans cette gnration pour voir les modifications en "temps rel", puis une fois satisfait du rsultat, recopiez ce fichier CSS dans votre rpertoire .doss de builder. Soyez juste prudent car les gnrations sont crases chaque nouvelle rgnration.
28
HelloWorld
Retrouvez plus vite les noms des classes dans le document Si vous utilisez firefox, vous avez la chance de pouvoir profiter d'extensions bnfiques tout dveloppeur web, en voici 2 exemples : Web Developer : une fois install, tapez ctrl+shift+f puis cliquez sur un lment de la page pour voir ses proprits et sa classe. Firebug : ouvrez le par l'icne dans la barre d'tat, choisissez l'onglet HTML, inspect, et cliquez sur un lment de la page.
4 Diffusion
Redistribuez des wsppacks
Votre helloworld n'aura peut-tre pas des millions d'utilisateurs partout travers le monde, mais dans l'optique de raliser des futurs modles plus importants, vous allez apprendre les redistribuer aux auteurs. La premire option est de fournir un wsppack, que l'utilisateur va pouvoir installer sur SCENARIchain. Rien de plus simple : crez un nouvel item helloworld.wspmake, et comme vous l'avez fait pour le wsptest, un glisser-dposer du wspdef vous permet de lancer l'export de votre atelier et d'obtenir le fichier helloworld_0.0.1.wsppack.
Redistribuez des applications

SCENARI permet aussi de transformer une ou plusieurs chanes ditoriales en une application standalone*. Vous devez pour cela crer un fichier appmake et utiliser un sckit. Vous obtenez un programme pour linux, windows et/ou mac. Ceci sort du cadre de notre simple exemple helloworld.
5 Bilan
Mission accomplie !
29
HelloWorld
Vous avez russi construire toute la chane ditoriale du modle HelloWorld. C'est un premier pas vers l'entre dans la petite communaut de modlisateur SCENARI. Vous pouvez maintenant dchiffrer une partie des pages du wiki pour SCENARIbuilder et des posts du forum modeller qui vous taient jusqu'ici incomprhensible.
Voulez vous continuer ? La suite du programme si vous souhaitez raliser des modles srieux est la matrise de nouveaux concepts ou items, vous avez quelques exemples pour vous aider dans SCENARIdiscovery. Savoir analyser la structure d'un document : cette prsentation helloworld est trs technique et ne vous apprend pas prendre du recul pour crer un rseau de .model ; Les dataform : elles se substituent aux primitives compositionPrim si vous souhaitez traiter des champs de donnes (par exemple les information d'tat civil dans CV) ; Les autres primitives binaries : pour inclure des images, du son, et paramtrer leur transformation (showorg) ; La DTD complte des transformeurs : dans cet exemple nous n'avons utiliss les transformeurs qu' 10% de leur capacits ; Les axis : l'intrieur du mme gnrateur, crez plusieurs version d'un mme transformeur ; Particularits du support Open Document : table des matires, indexes, annexes, rfrence des illustrations, enttes et pieds de pages, recto-verso... (report) ; Particularits du support HTML : les widget de menu, le fonctionnement des zones (showorg) ; HtmlToOd : mettre un pdf partir d'une page web (CV) ; Les genDeploy : upload FTP des gnrations ou autres actions de dploiement ; Les gnrateurs flash : ils ncessitent l'criture la main de feuilles XSL (SimpleSlideShow) ; Le stylage de l'diteur : faire des petites modifications sur le style des parties de contenu dans l'diteur et les icnes des items (CV) ; Exploiter les extension : sound, assessements, SCORM (webradio, iris). Ce chapitre 1, le "helloworld de base", est juste une introduction. Cette documentation est pour l'instant excessivement incomplte et insuffisante, mais se poursuivra avec d'autres chapitres et documents complmentaires prochainement.
Voir aussi... > cf "Gnrateur HTML", page 29.
30
HelloWorld
IV HelloUniverse
Introduction Dans cette seconde partie, nous allons utiliser notre exprience HelloWorld pour aller plus loin, et crer un "HelloUniverse". Nous nous plaons dans une problmatique de modlisation : crer une mini-rfrence des plantes de l'univers. Puis, ce sera galement l'occasion de faire des publications plus originales, un vrai "mini site", une vraie "mini publication" papier. Aprs helloworld, modle qui ne fait aucun sens et dont aucun auteur n'aurait besoin, nous adoptons le thme : faire un modle pour dcrire des plantes de l'univers. The world is not enough ! Objectifs Dans ce tutoriel, nous allons apprendre : Utiliser quelques pistes pour se reprsenter un modle complexe ; Traiter les donnes de type "formulaire" avec les DataForms, les publier sous forme de tableau avec des images ; Concevoir un site HTML multi-pages avec un menu, et un document ODT avec une table des matires ; Dcliner un transformer en diffrents "axis" en fonction du contexte ; Trouver des informations sur le stylage de l'diteur et la diffusion sous forme d'application autonome.
1 Mthodologie
Analyse
Lorsqu'un concepteur de base de donnes se lance dans la cration d'un schma de donnes, il va rflchir sur les informations et leur place "logique" avant de faire une "mise en contexte technique". Pour crer des modles Scenari, il est important de se reprsenter la structure globale du modle avant de passer la conception dans SCENARIbuilder. Mais tant donne que la conception de modles de documents est un domaine assez nouveau et que Scenari offre un champ de possibilits trs ouvert, nous n'avons pas encore de mthode miracle, de rgles de modlisations que nous pourrions vous "imposer". Cette partie d'analyse est donc plutt voir comme un ensemble non exhaustif de pistes ou d'ides.
Etude du domaine Documentez vous sur le thme de votre modle. Vous devez devenir un "expert" des plantes et de tout ce qui se trouve dans l'univers pour pouvoir tre l'aise avec les choix de modlisation de ces donnes. Soyez attentif aux informations de ces documents modliser : y a-t-il souvent des parties de textes qui ont le mme type de contenu pour toutes les plantes ? Devant une masse trs volumineuse d'informations, lesquelles doivent tre prsentes sur vos documents et lesquelles ne vous intressent pas ? Partir de documents existants est une source d'inspiration trs prcieuse, ci-dessous des liens vers des documents pour votre modle "helloUniverse": http://fr.wikipedia.org/wiki/Plan%C3%A8te http://fr.wikipedia.org/wiki/Astre http://fr.wikipedia.org/wiki/Univers
31
HelloUniverse
http://fr.wikipedia.org/wiki/Mars_(plan%C3%A8te) http://fr.wikipedia.org/wiki/Mercure_%28plan%C3%A8te%29#_note-3
Identifiez les donnes A partir de votre tude, identifiez les "objets" utiliser, la structure gnrale de vos donnes. Soyez raisonnable et n'hsitez pas simplifier quand vous le pouvez. Dans notre cas par exemple, nous avons diffrents types de corps clestes mais avons-nous besoin de les distinguer par 2 types d'objets diffrents ? Lors de la rdaction, l'auteur a-t'il besoin d'avoir des types de parties trs diffrentes dans le cas d'une toile ou dans le cas d'une plante ? Doit-on crer un type d'item spcifique pour les "plantes naines" ? Nous allons choisir la solution la plus simple : le mme type d'item est utilis par l'auteur pour les toiles, les plantes et les plantes naines : la structure sera la mme mais l'intrieur du contenu, rien ne nous empche de prvoir un moyen pour l'auteur de spcifier le type de l'astre. Il n'y a pas de bonne rponse ou de mauvaise, c'est vraiment en fonction des besoins. Autre question se poser : doit-on crer des objets comme les galaxies ou les systmes ? Raisonnablement, nos auteurs n'ont pas trop de connaissances capitaliser pour des plantes en dehors du systme solaire, donc nous allons nous limiter celui-ci dans un premier temps et nous n'avons pas besoin de reprsenter ces lments. Si nous avions placer d'autres toiles, il serait intressant de sparer les astres du systme solaire des autres, donc d'adopter une structure en galaxie / systmes. Par contre, nous dcrivons plusieurs plantes et il leur faut imprativement un conteneur, nous allons les placer dans une racine "univers". Quelques exemples de structures possibles, nous choisissons la premire qui offrira largement assez de complexit cet exemple.
32
HelloUniverse
A l'intrieur de Scenari, vous serez peut-tre amen dcouper ces "objets" en plusieurs .model SCENARIbuilder mais vous avez dj prpar cela par l'tape "abstraite" du travail.
Le contenu des objets L'univers contient des plantes, nous ne lui associerons pas d'autres donnes. Chaque astre est associ une srie d'informations prcises : nom photo nature la liste de ses satellites et leurs distances orbitales diamtre masse priode de rotation priode sidrale Ensuite, nous allons ajouter du contenu textuel sous forme de paragraphe pour dcrire les plantes. Question se poser sur les paragraphes : peut-on les pr-dfinir (forcer un titre ? un ordre ?) ou est-ce l'auteur de les crire librement. Les choix suivants s'offrent nous : 1. Libert total de l'auteur sur les paragraphes : on laisse choisir l'auteur le rle de chaque paragraphe et leur nombre sans lui proposer des parties spcifiques. 2. Sans ordre prcis, parties libres et ventuellement parties prdfinies : l'auteur cre des parties comme bon lui semble, mais il peut utiliser certaines parties avec un rle prdfini. 3. Parties prdfinies en ordre fixe + parties libres : on spcifie d'avance les rles de 4 paragraphes et l'auteur peut en ajouter librement la fin. 4. Restriction total des parties : nous crons et choisissons d'avance les rles de 4 paragraphes (avec un titre par dfaut ou mme un titre fixe). Essayant d'identifier les besoins de nos auteurs, nous allons identifier 4 parties qui reviennent couramment : introduction, atmosphre, surface, noyau. Mais chaque plante a des particularits que l'auteur peut souhaiter dcrire dans des paragraphes qu'il cre lui mme et dont on ne peut pas forcment anticiper le rle. Nous retenons donc la 3me solution. Schma du modle Nous allons au fil de ce tutoriel construire un rseau de fichiers .model respectant ce schma (en plus des autres items ici masqus par soucis de simplification). Nous avons vu que l'on pouvait dcomposer notre domaine en objets, mais aussi identifier des types de parties rpts l'intrieur d'un modle ou les redcomposer, ce qui explique ce niveau supplmentaire en dessous de astreobj.model.
33
HelloUniverse
Remarques
Ne pas commencer par trop compliqu Lorsque vous faites un document, dterminez les concepts qui peuvent tre mis en commun : par exemple, pour nos 4 parties "introduction, atmosphre..." , leur structure est identique. Il ne faut donc pas faire 4 .model diffrents pour reprsenter chacun, mais un .model global qui va couvrir les 4 cas d'usages.
34
HelloUniverse
Les autres notions Il vous faudra dcouvrir quelques autres notions de modlisation mais cette analyse peut se poursuivre. L'objectif tant d'anticiper le plus possible les difficults, si vous matrisez bien SCENARIbuilder et que vous savez ce que vous voulez, vous pouvez vous en sortir en continuant les essais dans SCENARIbuilder. Mais si vous concevez un modle en fonction des besoins d'un tiers sur un sujet que vous connaissez mal, il vous faudra tre bien plus spcifique dans les questions que vous allez lui poser, et obtenir des indications comme les types de donnes, le format des ressources, leur hirarchie... Il y a ensuite pleins de choix facilement modifiables par la suite, comme autoriser ou interdire l'internalisation, modifier un nom de champ, donc mme si c'est plus simple de faire bien du premier coup, ne soyez pas trop angoiss par des dtails. Mthodes de schmatisation Les schmas fournis dans ce guide ont un rle de dmonstration, il est aussi possible de faire des diagrammes "type UML" Scenari pour reprsenter le modle avec plus d'informations. Il n'existe pas encore d'outil pour les gnrer automatiquement partir d'un modle SCENARIbuilder (et encore moins de gnrer un modle SCENARIbuilder partir d'un schma !). Notez qu'il est tout de mme possible d'exporter la DTD du modle sous forme de schma RelaxNG (crer un item -> wspRelaxNg). Pour l'instant il n'y a pas de mthode de reprsentation de modle qui nous satisfait totalement, mais pas non plus une sensation de besoin pour les modlisateurs dj forms passer systmatiquement par ce type d'outils.
2 Mise en place
Structure
Introduction Dans cette partie, nous allons copier HelloWorld sous le nom HelloUniverse, et travailler sur cette copie en ajoutant et modifiant des fichiers .model pour que l'diteur Scenari prenne en compte nos nouveaux paragraphes de donnes. Point de dpart
Vous partez du mme atelier que celui du tutoriel prcdent

Copiez le rpertoire helloworld la racine de votre atelier (cliquez sur son titre pour slectionner la racine). Collez ce rpertoire la racine de votre atelier et renommezle en helloUniverse.
Ensuite, quelques renommages sont effectuer
Vous devez changer les codes des fichiers .wspdef pour que chaque code soit unique.
.model,
.generator et
Vous pouvez renommer les fichiers, changer les name des items pour plus de clart.
35
HelloUniverse
cran 22
cran 23
Vrification
36
HelloUniverse
Vrifiez l'cran de contrle et assurez vous par test que votre copie est pleinement fonctionnelle.
Namespace Vous n'avez pas besoin de changer les namespaces et prefix tant que les codes sont uniques. Vous pourriez aussi faire l'inverse : changer uniquement les namespaces mais garder le mme code. C'est le couple namespace + code qui identifie un item.
Mais pour faire une dclinaison de modle Pour faire une dclinaison d'un modle, vous n'tes pas oblig de faire toute cette srie de renommage, mais vous pouvez aussi copier vos fichiers dans un atelier diffrent. Ou prendre le risque de conserver les 2 rpertoires cte cte sans changer les codes, partir du moment o il n'y a aucune interaction d'items entre les 2 rpertoires il n'y aura pas d'erreur. Mais alors, surveillez bien l'cran de contrle et assurez vous que les auteurs n'utiliseront pas l'autre version du modle sans avoir conscience des risques ou diffrences (ceci est toutefois dconseill). Les librairies En cas de modles diffrents qui partagent des .model ou ressources communes, le mieux est de crer un rpertoire "librairie" qui contiendra l'intersection des 2 modles, un ensemble d'items SCENARIbuilder rutilisables l'intrieur de .model d'un mme atelier. Ce n'est pas le cas entre nos 2 modles puisque notre micro-helloworld ne contient qu'un seul fichier .model.
Nouvelle compositionPrim pour astrobj.model et partie.model Copiez 2 fois le fichier universe.model et nommez les copies part.model et astrobj.model dans le mme rpertoire. Nous allons simplifier l'ensemble "titre + contenu" en un seule composition partie. Ouvrez le fichier part.model et mettez <sTitle> en tant que <meta> et ajouter le contenu de la part comme ci-dessous :
cran 24
astrobj.model Nous dfinissons les blocs de texte suivant la mthode que nous avions choisie prcdemment : un astre est souvent dcrit par 4 parties de texte prdfinies, et plusieurs paragraphes libres.
37
HelloUniverse
cran 25 Les 4 premiers paragraphes sont l'extrieur du <set>, ce qui force l'auteur respecter leur ordre. Ils sont en usage="optional", l'auteur peut choisir d'en laisser certaines vides par manque d'information. Contrairement au helloworld, notre titre est plac dans la composition du "sous-modle" et non l'intrieur du paragraphe, il est intgr l'item part.model.
Rfrencer astrobj.model depuis universe.model Il ne reste plus qu' modifier notre lment racine* pour faire appel astrobj.model (car tout simplement : l'univers contient des astres). Un choix intressant est d'obliger l'auteur crer un fichier distinct par plante : Internalized = never.
cran 26 Dernire tape, pour que astrobj.model puisse tre utilis en tant qu'objet externe*, il faut qu'il soit dans les <publicClasses> de notre hellouniverse.wspdef. Pour cela, cliquez sur l'toile d'insertion se situant sous la balise <publicClasses> et choisissez la balise <class> ensuite glissez-dposez le fichier astrobj.model sur l'item vide se situant ct de cette balise. Sous la balise <publicClasses>, vous avez maintenant deux balises <class> pointant vers les fichiers astrobj.model et universe.model. Comme sur la capture d'cran cidessous :
38
HelloUniverse
cran 27 Tests Vous pouvez nouveau tester votre modle mais attention : les transformeurs sont "casss"... Ils ne correspondent plus aux .model et les gnrateurs ne fonctionnent plus. Pour le moment, seul l'diteur est fonctionnel.
Publication HTML
Introduction Nous avons modifi la structure du modle, mais les transformeurs utilisent toujours les anciennes donnes : rsultat, le gnrateur ne fonctionne plus du tout ou ne publie presque rien. Il faut donc aussi modifier les transformeurs, les "rparer" pour que les publications fonctionnent nouveau.
universe.transf Que ce soit en HTML ou en OD, le transformeur est toujours partiellement exact, avec juste une diffrence : le titre est intgr dans les metas du sous modle, et non intgr la part. Modifiez le fichier universe.transf contenu dans l'espace web, comme ci-dessous :
cran 28
39
HelloUniverse
Les commentaires Comme dans SCENARIchain, il est possible de dsactiver des lignes en les passant en commentaire par clic droit -> passer en commentaire. Les lignes en commentaire sont alors affiches en vert dans l'diteur. Mode "navigation" et mode "content" Lorsque vous crez un transformer ( universe.transf) pour faire de l'HTML, il y a 2 possibilits principales de contexte : Navigation : vous n'avez pas encore cr la page, vous dfinissez l'arborescence de votre site en <folder> et <pages> Content : votre page existe et vous allez maintenant rajouter du contenu dans les transformeurs universe.model (et helloworld.model) est notre item racine de la publication et nous devons commencer en mode <navigation>. Nous y avons dfini une page, et n'en dfinirons aucune autre l'avenir, donc dans les transformers des submodels, nous devons utiliser le mode <content>. sm:page <sm:page> permet de crer physiquement les fichiers html qui constitueront le site web.
astrobj.transf Le transformer pour astrobj.model pourrait tre ralis de manire trs simple : <for code="*" > WHeadingBlock > (title > subModelTitle) | callSubModel> Mais nous voulons que chaque partie "Atmosphre", "Surface"... ait un titre par dfaut si l'auteur ne le prcise pas. Pour cela, crez ce nouveau transformer en faisant un clic droit dans l'atelier helloworld sur l'espace web puis choisissez Ajouter un item et slectionnez l'item de type Publication -> Gnrateurs 'web' -> Transformers Web -> compositionXhtmlTransf que vous nommerez astrobj.transf. Faites ensuite les modifications suivantes :
40
HelloUniverse
cran 29
41
HelloUniverse
On slectionne avec plusieurs <for> chaque part une par une grce au code. Lorsque vous prcisez plusieurs <title> la suite l'un de l'autre, c'est le premier existant qui est choisi : si le <subModelTitle> existe, le titre de l'auteur sera utilis. Pour les parties libres nous ne leur donnons pas de titre si l'auteur ne le spcifie pas.
part.transf Cette fois-ci, c'est plus simple : il s'agit juste de transfrer le travail de transformation la primitive texte : <for code="*" > callSubModel> :
cran 30 Mettez jour les transflists Mettez jour le fichier .transflist du gnrateur HTML, ajoutez-y les 2 nouveaux transformers. checklist En cas d'erreur, pensez toujours vrifier : Les crans de contrles ; La correspondance entre les codes des .model et .transf ; Que les codes des parts et les codes des .models sont uniques ; Que vos TransfList sont compltes ; Que vous n'avez pas mis de transformers OD dans un gnrateur HTML ou inversement ; Que vous avez fait les bons choix entre navigation ou content dans les XhtmlTransf (l'cran de contrle peut vous aider sur ce point) ; Que vous n'avez pas mlang les appels : entre callSubModelTitle et callPartTitle par exemple ; Que vous n'avez pas d'accent dans les noms de fichier : les accents sont nuisibles et sources d'incompatibilit entre les plateformes (conseil aussi valable pour SCENARIchain) ; Que votre modle ne comporte pas de nom de code, de fichier ou d'axis anormalement long : si la longueur totale du chemin d'un fichier dpasse 255 caractres, cela peut crer des problmes sous Windows. SCENARIbuilder cre des sous rpertoires de travail avec les codes que vous utilisez dans votre modle, restez donc raisonnable ; Que vous n'avez pas oubli d'enregistrer vos modifications avant de lancer vos nouvelles compilations.
42
HelloUniverse
Publication OD
Pour l'OpenDocument Text, il n'y a aucune difficult supplmentaire, vous devez faire les mmes changements ou nouveaux transformers (en crant un nouvel item de type Publication -> Gnrateurs 'open document' -> Transformers OpenDocument -> compositionOdtTransf) que pour le HTML. Pensez modifier le <for> dans universe.transf : il y a toujours <for code="hello">, qu'il faut mettre en <for code="*">. Vous devez aussi refaire le stylage pour obtenir un rsultat plus esthtique, mais cela fera l'objet d'une autre partie dans ce guide.
3 Les donnes de type "formulaire"

Les bases des dataforms
dataForms Les dataforms sont une primitive de donnes saisies sous forme de "champs de formulaires" (par opposition aux champs de type paragraphes).
Quand utiliser des dataforms ?

Cette section vous fera dcouvrir une deuxime primitive importante de modlisation : les dataforms. Comme vous avez pu le voir dans l'analyse, les plantes ont aussi des donnes prcises : nom, diamtre, masse, que nous qualifierons de mta-donnes. Ce type d'information n'est pas bien adapt une structure type "bloc de contenu" ou "ensemble de paragraphes", nous n'utiliserons donc pas les <compositionPrim>, mais un nouveau type de primitive de contenu : les <dataformPrim>.
Intgration des dataforms Vous avez dj fait usage de mta-donnes : le titre est en quelque sorte, une meta donne avec une seule information. Dans astrobj.model, vous allez supprimer la rfrence sTitle.model et la place, crer un nouvel item : dans l'cran de cration des items : Primitives -> Primitives de mtadonnes -> dataFormPrim. Nommez le par exemple astrobjMeta.model : il est d'usage de rajouter le mot Meta ou simplement la lettre M aux nom et code de la composition pour choisir ceux des mtadonnes. Recopiez les lments suivants dans le fichier astrobjMeta.model:
43
HelloUniverse
cran 31
44
HelloUniverse
Le premier champ texte Aprs avoir dfini les informations de namespace et le code, vous allez crer le premier <field> (champ de donnes) de la dataform : le nom de l'astre. Pour dterminer le caractre obligatoire ou facultatif d'un champ, il faut spcifier une valeur l'attribut occurences. one : obligatoire. one or more : obligatoire combin plusieurs occurences ; zero or one : optionnel ; zero or more : optionnel combin plusieurs occurences. Il n'y a pas d'attribut required ou optional mais plutt occurrence. Les champs de type refItem Si vous voulez crer un champ qui pointe vers un autre item, comme par exemple pour associer une image vos mta-donnes de l'astre, vous allez dfinir un 2me champ "photo" avec un type refItem. Comme pour les parts des compositions, vous y placez des <allowedModel> : dans notre cas, 2 formats d'images aller chercher dans les modelets. Pensez aussi mettre jpeg.model et png.model dans le <publicClasses> de votre wspdef, comme sur la capture d'cran ci-dessous, pour que l'auteur puisse les crer.
45
HelloUniverse
cran 32
46
HelloUniverse
Les champs de type enum Nous souhaitons maintenant demander l'auteur le type de plante, ce type va toujours appartenir un ensemble fini de possibilits : "toile", "tellurique" ou "chtonienne". Dans les dataforms SCENARI, cela se traduit par des champs de type <enum>. Un champ enum contient des couples <key> / <name>, le premier tant l'identifiant utilis l'intrieur du fichier XML de stockage produit par SCENARI, le deuxime tant le nom tel qu'affich dans l'interface auteur (il est aussi possible de le rutiliser en publication). Les groupes et sets Pour les satellites qui contiennent 2 donnes : le nom et la distance, l'approche la plus intuitive serait de crer une autre dataform et au lieu de dclarer un nouveau <field>, de faire un <subData>. Cette approche est tout fait valable, mais comme nos donnes sont relativement simples, nous pouvons plutt faire un <group> "satellite" et ajouter l'intrieur 2 <field> "nom" et "distance".
Autres points de dparts pour les dataforms Il existe au moins 3 mthodes pour intgrer des dataforms : sm:meta : rattach l'ensemble de la composition (comme c'est le cas ici) sm:part -> sm:meta : rattach uniquement une part subdata : l'intrieur d'une dataform, permet de pointer vers une autre dataform. Titrez vos meta Nous avons vu que les dataforms sont une liste de champs. Lorsque le contexte s'y prte, vous devez choisir un des champs de la dataform qui sera utilis en tant que titre. Dans notre exemple, c'est le champ ayant pour code name (le nom de l'astre) qui sera utilis comme titre. Dans le fichier astrobjMeta.model, allez au niveau de la balise <storage> puis double-cliquez sur la balise <fullTitleBuilder> et taper name dans refCode.
cran 33 Jusqu' prsent nous avons uniquement parl de "titres simples". Dans certains cas, nous pourrions tre amen demander l'auteur 2 types de titres, un fullTitle et un shortTitle, pour pouvoir soit tre exhaustif lorsque l'on dispose d'une ligne complte pour publier le titre, soit de faire un petit lien de menu ou synthtiser encore plus lorsque l'on doit faire tenir ce titre en quelques caractres. Pour utiliser ce genre de "double titre", insrer dans le fichier part.model soit le fichier title.model des modelets la place de <sTitle>, soit une dataform dans laquelle vous allez dfinir les 2 mcanismes <fullTitleBuilder> et <shortTitleBuilder>.
Rsultat dans SCENARItest
47
HelloUniverse
cran 34
Publication HTML
Les tableaux La premire particularit de ce type de transformeur est qu'il est orient sur la cration de tableau. Bien qu'on puisse aussi conserver une approche "blocs de contenu" par les WBlocks, 2 types de tableau font leurs apparitions : WTable et W2Cols. Pour cela, faites un clic droit sur votre espace hellouniverse puis slectionnez Ajouter un nouvel item et choisissez Publication -> Gnrateurs 'web' -> dataFormXhtmlTransf. Dans ce fichier, aprs avoir prcis encore une fois le comportement <content> au lieu de <navigation> pour la dataform, nous allons imbriquer les 2 types, un tableau 2 cellules "photo + tableau 2" et un tableau 2 avec une liste des noms et valeurs du reste de la dataform.
48
HelloUniverse
cran 35
49
HelloUniverse
WTable Le WTable est un tableau "libre", le modlisateur va crer des lignes + des colonnes et les remplir. Il est adapt des tableaux contenus varis ou des tableaux en largeur. Nous allons crer un tableau 2 cellules : gauche, la photo et droite, les autres informations de la dataform. Un <WTable> contient des <WTableRow> puis des <WTableCell>. W2Cols Le W2Cols est un tableau 2 colonnes, couramment utilis pour publier des lignes "nom / valeur" des champs d'un formulaire. Pour le remplir, utilisez un <W2ColsFreeRow> l'intrieur d'un <forField>, il en rsultera 2 points d'entre pour le contenu : les labelCell et les valueCell. Les conditions d'existance : Choose / When Dans ce tutoriel, nous voulons, si une plante a un ou des satellites, ajouter un bloc avec pour titre "satellites" dans notre publication HTML, mais que cette partie n'apparaisse pas dans le cas contraire. Nous utilisons pour cela l'ensemble <choose> / <when> / <otherwise>. La condition est dtermine dans le <when> : elle peut tre l'existence d'un code dans les donnes (donc, qu'une <part>, qu'un <field> ou qu'un <group> existe), avec l'attribut <codes>, si les codes existent ce qui est dans le <when> est appliqu, dans le cas contraire ce qui est dans le <otherwise> est appliqu. <When> ne slectionne pas les donnes, il faut donc refaire un <for> aprs. Si nous rcrivons le transformer de la mme manire sans choose / when, le titre "satellites" sera publi mme pour les parties n'en ayant pas.
cran 36 Des conditions plus complexes avec xpath A l'aide d'expressions xpath, nous avons plus de libert pour poser des conditions sur le contenu des champs, sur le nombre d'lments... Exemple de condition XPATH sur la valeur d'un champ enum.
50
HelloUniverse
Conserver la structure et la hirarchie Pour publier la liste des satellites, nous avons 3 balises de structure dans le dataform.model :

Le groupe sat En sous niveau de sat, le champ name (nom du satellite)
En sous niveau de sat, le champ dist (distance) Il est trs important de conserver la mme hirarchie : commencer par un <forGroup> puis des <forField>. Pour cette partie, au lieu de tableaux, nous utilisons des <WBlock> qui se traduisent dans le HTML par des <div> ou des <span>. Rappel Pour intgrer ce dataFormXhtmlTransf, pensez : Le rajouter dans le huWeb.transfList Aller dans astrobj.transf, dans sm:content et rajouter : sm:CallCompositionMeta Publication des images ainsi que : Afin que les images soient publies lors de la gnration html, pensez : Aller dans huWeb.transflist Rajouter sm:transformer -> jpeg_web.transf Rajouter sm:transformer -> jpeg_web@inline.transf Rajouter sm:transformer -> png_web.transf Rajouter sm:transformer -> png_web@inline.transf
Publication ODT
Mme procd mais... Pour crer la version OD du transformer, vous pouvez adopter approximativement la mme mthode, mais attention, prenez en compte les risques suivants : Il est trs dangereux de proposer l'auteur de rentrer des paragraphes longs dans des tableaux, la gestion des tableaux tendus sur plusieurs pages peut poser problme lors de l'ouverture du document avec OpenOffice. Il est dconseill d'imbriquer les tableaux ou les WBox pour les mmes raisons. En rsum, utilisez les tableaux avec parcimonie.
4 Pages de la publication
HTML : menu et hirarchie de pages
Introduction Nous partons d'un document compos uniquement d'une seule page. Tout le contenu est l'intrieur de cette page. Nous allons chercher faire un document en plusieurs pages HTML : une page par plante, avec un menu pour naviguer entre les plantes.
51
HelloUniverse
Cration de la page au niveau des plantes Pour tenir notre cahier des charges, nous devons modifier l'emplacement de la cration de page : passer de une page pour la composition universe.model une page par part de cette composition. Dans votre espace web, ouvrez l'item universe.transf et modifiez les donnes suivantes :
cran 37 Solution alternative : nous aurions pu juste faire un <<for codes="*"><callSubModel>> dans universe.transf pour dcharger ce transformer de la cration des pages, puis la reporter dans astrobj.transf, qui dans ce cas doit tre en mode <navigation> et non <content>.
Cration du menu Nous avons dfini les pages, mais il n'y a aucun moyen d'accs pour les choisir. Nous allons donc dclarer un menu (ou outline) dans huWeb.uiTemplate. On cre une div "menu" qui sera positionne sur la page lors de l'tape de stylage. Cette div contient un widget* de type outlineUiWidget.
cran 38 Nous allons modifier 2 paramtres de ce widget : le scope : Les lments visibles ou non dans le menu. Un scope "all" dvoilera tous les lments du menu (Slctionnez le et consultez les diffrentes possibilits dans la partie droite de la fentre : liste de toutes les pages parentes, liste des fils...). Les classes : Permettent de choisir des styles CSS appliquer dans les lments du menu, en fonction de conditions prcises (position dans l'arbre par rapport la page courante, profondeur, type d'lments...).
52
HelloUniverse
cran 39 La premire page est affiche par dfaut Dans une publication HTML, la premire page est toujours affiche, si vous voulez insrer une page d'accueil fixe, au lieu d'afficher la premire plante, vous devez dclarer une nouvelle page dans universe.transf avant le <for>.
53
HelloUniverse
cran 40
Rsultat Notre contenu n'ayant pas une structure extra-ordinaire, vous devriez simplement voir apparatre une liste des pages en dbut de votre publication HTML, et le contenu de la premire sera affiche par dfaut.
54
HelloUniverse
Les folders Pour crer une vraie hirarchie de page avec des sous-niveaux, on dclare des Folders et on y cre les pages l'intrieur. L'option <folderPreview> est la page qui s'affiche lorsque l'utilisateur clique sur le dossier dans le menu, sans <folderPreview> c'est la premire page de contenu du folder qui est utilise.
ODT : Page de garde, table des matires, numrotation

Introduction Nous allons amliorer notre publication ODT avec les fonctionnalits suivantes : Page de garde Table des matires Saut de page aprs chaque plante dcrite Cration de la page de garde Pour dclarer une page de garde, on cre un nouveau <pagemaster> dans huOd.template. On y met un <WflowTextArea> : une zone dont la position est dfinie librement par le modlisateur, dans l' odStyle. Si vous voulez afficher le titre "L'univers" au centre de votre page de garde, re-gnrez l'odstyle, ouvrez le et dplacez la nouvelle zone rectangulaire sa bonne position sur la page. Cette opration se fait la souris, sans passer par la fentre de paramtrage des styles.
cran 41
Table des matires OpenOffice permet de gnrer automatiquement une table des matires partir des diffrents textes de titre, dans le cas de documents Scenari, partir des <WHeading>. On dclare la table des matires dans l'odtemplate :
cran 42
55
HelloUniverse
On peut paramtrer le style et le comportement de cette table des matires dans l'odstyle. Allez dans l'espace helloUniverse et faites un clic droit sur l'item huOd.odStyle.odt puis choisissez Ouvrir dans l'diteur par dfaut du systme. Le fichier s'ouvre sous OpenOffice, allez dans le menu Insert -> Indexes and Tables -> Indexes and Tables, on obtient cet cran en simulant l'insertion d'une nouvelle table des matires l'intrieur de celle dj existante. Dans notre cas, nous allons uniquement mettre le nom de l'astre et non les titres des sous-parties, on rgle donc l'option Evaluate up to level 1.
cran 43
56
HelloUniverse
Numrotation des pages Toujours dans le odtemplate, on ajoute un pied de page au format "numro de page" / "nombre total de pages du document" :
cran 44 La gestion des headers / footers permet de couvrir toutes les options OpenOffice : distinguer les pages paires / impaires, utiliser 3 zones gauche / droite / centre. En contenu, sont disponibles les "variables" relatives au document ou la page : numro, total, titre, nom de fichier...
5 Les axis
Problmatique Pour publier un document, nous avons souvent besoin de publier une donne plusieurs fois, et de plusieurs manires diffrentes. Lorsque l'on fait un appel classique un transformer, c'est toujours le mme qui est appel, et il publie toujours les donnes de la mme manire, avec toujours les mmes classes pour le stylage.
Axis Le rle des axis est de dfinir plusieurs versions d'un mme transformer, qui vont publier la mme donne de plusieurs manires diffrentes. Exemple Par exemple, dans notre liste de plantes, nous pouvons rajouter une page "galerie" qui va afficher des miniatures de toutes les photos des plantes.
Appeler des transformeurs avec axis A partir d'un transformer ou du template, lorsque l'on utilise <callSubModel>, <callRootModel>, <callSubMeta>, <callMeta>, ou autre appel un transformer fils, nous avons la possibilit de prciser un axis. Par exemple, dans universe.transf, on rajoute un appel la liste des astres avec l'axis gallery.
57
HelloUniverse
cran 45
La hirarchie des transformeurs avec axis Vous allez maintenant crer les transformers fils pour reproduire toute une hirarchie jusqu' arriver au niveau "image". Par convention, on nomme les fichiers axis avec transformers sous la forme codeObjet@codeAxis.transf. Pour passer d'un transformer un autre en restant sur le mme axis, il faut que celui-ci soit spcifi en deux endroits : Dans l'entte du transformeur : <sm:axis code="..."> Dans l'appel aux autres transformeurs partir de celui-ci, par exemple : <sm:callCompositionMeta axis="gallery">
cran 46
58
HelloUniverse
Les 2 premiers items crer sont donc astrobj@gallery.transf et astrobjMeta@gallery.transf. Pour crer ces fichiers, allez sur l'espace web contenu dans votre espace helloUniverse, faites un clic droit sur cet espace puis choisissez Ajouter un item et slectionnez Publication -> Gnrateurs 'web' -> Transformers web -> compositionXhtmlTransf pour le premier item. Pour le second item crer, suivez la mme procdure mais choisissez Publication -> Gnrateurs 'web' -> Transformers web -> dataFormXhtmlTransf.
cran 47
cran 48
59
HelloUniverse
Les axis pour les ressources binaires Utiliser les axis sur les ressources binaires permet de spcifier leurs proprits de publication dans un cas d'usage, par exemple changer la taille d'une image dans la version "galeries de miniatures". Nous allons utiliser cette possibilit pour forcer la taille des images 200 pixels de large (200 en min et en max). On copie les transformeurs jpeg_web.transf et png_web.transf du modelet binary pour avoir un point de dpart, puis on modifie ces 2 transformeurs.
cran 49 On pourrait aussi appeler les transformeurs des images sans axis une fois arrivs dans astrobjMeta@gallery.transf mais dans ce cas, nous n'aurions pas l'image la taille personnalise que nous souhaitons.
Rsultat Crez un contenu de test avec 3 plantes et autant de photos. Si vous avez russi, les 3 photos devraient apparatre sur la page d'introduction.
Mettre jour le fichier transflist Comme toujours, pensez rajouter vos nouveaux transformeurs dans le fichier transflist de votre modle (comme vous pouvez le voir sur la fentre ci-dessous), c'est valable aussi pour les transformeurs avec axis, chacun doit tre ajout.
60
HelloUniverse
cran 50
61
HelloUniverse
6 Stylage HTML
Apprendre les CSS Il existe une multitude de sites internet traitant le sujet, voici ceux que je peux vous recommander : Leons CSS sur HTML.net (trs complet, convient parfaitement aux dbutants ambitieux, le sujet est trait de A Z) Tutoriel de cration d'un style pour une page simple (si vous ne savez pas par o commencer aprs avoir suivi les leons, c'est un bon exemple, la mthodologie pour faire des skins HTML pour modles Scenari est similaire) Aide HTML / CSS avanc (astuces sur des sujets prcis et pointus) Ressources supplmentaires (programmes, graphisme...)
Pour modifier un style dj existant

Pr-requis Cette partie a t volontairement simplifie pour vous permettre de modifier un style sans avoir lu tout le reste du guide. Vous devez cependant : avoir rcupr le modle avec un systme de partage de fichiers (par exemple, sur un repository subversion) : Procdure sur le wiki avoir cr l'atelier dans SCENARIbuilder en choisissant d'utiliser le rpertoire de source que vous venez de tlcharger : Procdure sur le wiki Reprage des fichiers
Vous partez de l'arbre gauche, l'explorateur des items, ouvrez les dossiers, et trouvez le fichier .wpsdef qui identifie votre modle qui va servir de point de dpart pour explorer le modle. Pour chacun des items cidessous, il peut y en avoir plusieurs exemplaires : plusieurs wspdef pointant vers plusieurs gnrateurs qui ont chacun plusieurs templates. Essayez de vous reprer par rapport au "<name>" de chacun des items ou par rapport au contenu pour "trouver le bon", ou demandez au modlisateur de vous expliquer lequel vous devez utiliser pour arriver faire vos changements. N'hsitez pas poser vos questions sur les forums de scenari-platform.org.
62
HelloUniverse
Pour passer du .wspdef au .generator par exemple, alors que l'item wspdef est slectionn, allez dans l'onglet edition si vous n'tes pas sur celui ci, puis faites [CTRL]+clic (ou double clic) sur l'icne du .generator l'intrieur du contenu. En passant d'un item un autre, vous devriez arriver aux CSS.
Se reprer dans les fichiers CSS

Dans le premier exemple HelloWorld, j'avais cit 2 extensions firefox pouvant tre utile au "styleur". J'en donne ici des exemples plus concrets pour montrer comment les utiliser. Il n'est pas ncessaire d'utiliser les 2 simultanment, mais en matriser un est un gain de temps considrable pour tout "styleur" srieux.
FireBug Source : http://www.getfirebug.com/ Firebug est spcialis dans l'exploration des arbres d'lments HTML (le DOM) et dans l'affichage des diffrentes relations d'hritages de classes CSS. Il permet d'avoir la liste de toutes les dclarations CSS qui vont avoir de l'influence sur un objet prcis, et de les modifier directement pour en tester l'effet. En fonctionnalit supplmentaire, il permet par exemple de "debugguer" les javascript en affichant la ligne d'erreur et des informations relative au script. Pour l'ouvrir, pressez [Ctrl] + [Alt] + [K], puis, choisissez le bouton inspect en haut a gauche du nouveau cadre "firebug" qui vient d'apparatre et enfin cliquez sur un lment de la page.
cran 51 En rsultat, on peut voir l'arborescence des lments HTML jusqu' notre div "#topleft" qui reprsente l'image dans le coin en haut gauche de l'cran, et l'ensemble des styles appliqus cet objet dans la partie de droite.
63
HelloUniverse
WebDevelopper Source : https://addons.mozilla.org/fr/firefox/addon/60 WebDevelopper est une extension mutli-fonctions pour tout ce qui concerne le dveloppement web. Il offre des informations assez basique sur le nom ou l'id d'un bloc slectionn l'cran, c'est le plus simple utiliser. En bonus, des fonctionnalits comme par exemple passer des pages local au validator W3C en un seul clic. Une fois install, pressez [Ctrl] + [Alt] + [F] puis cliquez sur un bloc pour dclencher l'affichage d'une fentre d'information.
cran 52 En rsultat, on a tout en haut en premier titre de la boite jaune, l'ID ou la classe de la div, puis les coordonnes ou la liste des noms de styles des conteneurs de cette div.
Exploiter le nouveau style Pour exploiter le nouveau style vous pouvez : Lancer un environement de test : crez un nouvel item wsptest et dposez-y par drag & drop le wspdef. Puis, lancez l'opration compiler et tester l'intrieur de ce wsptest. Crer un pack de modle installable dans SCENARIchain : crez un nouvel item wspexport et dposez-y par drag & drop le wspdef. Lancez l'opration compiler l'intrieur de ce wsptest, puis choisissez tlcharger la dernire compilation du modle .
64
HelloUniverse
cran 53 Crer un nouveau style complet
Pr-requis
Crer un nouveau style totalement diffrent des styles dj existant signifie que vous allez devoir intervenir sur les transformeurs et sur le template, on repasse ici dans des oprations qui ncessitent l'apprentissage des autres concepts de SCENARIbuilder, en particulier la publication HTML.
Premire maquette
Un graphiste cre une "maquette", une image d'une page du site dans un programme vectoriel. Si plusieurs pages ont des prsentations diffrentes, il cre alors plusieurs maquettes. L'aspect graphique d'une maquette doit tre valid rapidement (surtout si vous faites ce travail pour un client). Il est toujours possible de changer un logo la fin, mais passer une colonne de l'autre cot de la page, ou transformer par exemple un style " taille fixe 800x600" en un style "ajust la taille de la fentre du navigateur" demande beaucoup de travail supplmentaire.
65
HelloUniverse
cran 54
Simplification / Validation
Vous demandez au graphiste des simplifications en fonction de ce que vous pouvez ou ne pouvez pas faire en CSS. Certains navigateurs comme internet explorer ont des dfauts qui transforment des "ides videntes" en "casse tte d'intgration" sous certaines circonstances (objets aligns par rapport au bas de la page, hauteurs des colonnes homogne). Ne soyez pas trop ambitieux. L'aspect technique doit tre valid par vous mme, vous devez avoir en tte les diffrents blocs qui composeront l'image finale. Faites valider aussi les changements graphiques de ces simplifications.
Faire le template dans SCENARIbuilder

Crez ou modifiez les openUiTemplate correspondants, ainsi que les fichiers CSS avec les diffrents blocs, sans y mettre les images pour l'instant. Retournez l'tape prcdente si vous n'arrivez pas positionner les lments correctement. Testez la compatibilit avec diffrents navigateurs, rajoutez des bordures "de debug" pour voir les limites des blocs.
Export d'une maquette finale

66
HelloUniverse
Vous spcifiez au graphiste la rsolution des images "maquette finale" qu'il fournit, des versions diffrentes pour bien faire apparatre toute partie d'image que vous allez rcuprer (par exemple, sans le texte, sans les "puces du menu", tout ce qui recouvre l'espace)... Prcisez lui le format de l'image et sa rsolution (png ou jpeg trs haute qualit, vous allez devoir le recompresser aprs).
cran 55
Dcoupage du fond
Tracez sur papier les blocs taille fixe de la page, et isolez les avec un outil de traitement d'image (par exemple the gimp, outil "crop"), tout en notant leurs coordonnes sur papier, pour que vous puissiez reproduire le mme dcoupage ou dcouper d'autres blocs de mme hauteur / largeur. Pour les blocs de taille variable, votre image de fond doit tre rptable, ou dfaut avoir une taille maximale et apparatre correctement mme tronque. Souvent, on dcoupe une ligne de 1 pixel de large qui va tre tire. Ou alors, le plus simple reste juste les blocs avec une couleur de fond sans image. Enregistrez chaque "image de bloc".
67
HelloUniverse
cran 56
Dcoupage des objets

Il vous reste dcouper et intgrer les puces et autres images "flottantes" du contenu.
Intgration dans le CSS

Pour chaque div devant accueillir une image dcoupe, vous de rgler au moins les proprits en lien avec l'image de fond, par exemple : <background-position: top left;> <background-repeat: no-repeat;> <background-image: url(../../img/topleft.png);> Pour les noms de fichiers images, reprez vous bien dans l'arborescence des fichiers du site web HTML gnr, chaque ".." reprsente un rpertoire parent. Pour les blocs fixes, je vous recommande de donner des id de classe et des noms de fichiers en fonction de la position, ce qui rend votre layout rutilisable. Par exemple, si vous appellez "topleft.png" le bloc des toiles, c'est peut tre moins vocateur que "etoile.png" mais vous pouvez facilement remplacer l'image par une autre compltement diffrente si vous devez dcliner votre modle pour traiter un autre sujet. Exemple avec le bloc "topleft" : les toiles en haut gauche :
68
HelloUniverse
cran 57 Certains lments sont plus difficiles positionner comme le dgrad en bas droite, qui doit rester toujours cette position que le contenu de la page soit court ou que l'utilisateur ait "scroller". Le reste du design est assez classique, le layout prend une cinquantaine de lignes positionner, le reste (couleur des liens, lments internes, stylage du menu) prend peine plus, cela reste le plus simple que l'on puisse trouver. En guise d'exercice, essayez par vous mme et consultez le code source si vous n'y arrivez pas.
Rsultat
Vous devriez obtenir quelque chose qui ressemble l'cran ci dessous, tout a fait conforme ce que nous avons prvu :
69
HelloUniverse
cran 58
70
HelloUniverse
7 Stylage OpenDocument Text

Pour trouver de l'aide
Tutoriels Si vous avez dj une petite exprience d'utilisation d'un traitement de texte ou d'OpenOffice.org, vous pouvez devenir expert en la matrise des styles en suivant ce tutoriel Framasoft : Crer ses propres styles avec OpenOffice.org. Ce tutoriel est trs complet, et regroupe des informations sur le stylage des caractres, stylage des titres, de la numrotation... Gardez juste l'esprit que dans le cadre d'une utilisation Scenari, vous devez partir des styles existant l'intrieur de l'odStyle et non crer les vtres. 2me source de tutoriels : le wiki Scenari. Des parties sont spcifiques la ralisation de certaines tches avances de ralisation de gnrateur OD.
Forums Pour dvelopper vos comptences de crations d'odStyle, 2 choses sont prendre en compte : La matrise d'OpenOffice.org : la grande richesse des fonctionnalits d'OpenOffice.org ne riment pas forcment avec parfaite intuitivit d'utilisation. Fort heureusement, OpenOffice.org est aussi l'un des outils les mieux documents et avec une communaut d'utilisateurs trs active travers 2 forums : Forum OpenOffice.org / writer Anglais : http://www.oooforum.org/forum/viewforum.phtml?f=2 Forum OpenOffice.org / writer Franais : http://www.forum-openoffice.org/forum/forum3.html L'intgration avec Scenari peut encore faire l'objet de quelques faiblesses. Si vous obtenez le rsultat souhait dans OpenOffice et dans l'odStyle, mais que lors de la gnration votre style n'est pas exploit comme il se doit ou que la gnration est en erreur, dfaut d'erreur de manipulation, vous pouvez tre victime soit d'un bug, soit d'une fonctionnalit manquante, soit d'une limite de Scenari. Dans ce cas, n'allez pas ennuyer les gens de la communaut OpenOffice mais adressez vous l'quipe Scenari travers le forum "modlisateurs". Forum scenari-platform.org / modlisateur : http://scenari-platform.org/forum/viewforum.php? f=17 Quelque soit le forum, essayez de chercher avant si votre problme a dj t voqu, et si vous devez poster, essayez de formuler votre question avec prcision, contexte et dtails. Reconstruire les styles Vous l'aviez devin ? Commencez par reconstruire le fichier odStyle partir du fichier huOd.generator et remplacer l'ancien par le nouveau.
Mise en page
Accder aux styles des pages Vous pouvez choisir d'diter un style de page en slectionnant dans la barre de stylage le mode "page" :
Pour chaque pagemaster, un style correspondant a t intgr l'odStyle (dans notre cas, "first" pour la page de garde et "content" pour les autres).
Proprits Nous pouvons intervenir de diffrentes manires sur le style des pages : Changer le format de page (A3, enveloppes, paysage...) Modifier les marges Choisir une couleur ou image de fond Activer / masquer les headers / footer ...
71
HelloUniverse
Filigrane et image de fond sur toute la page Normalement, si vous choisissez un fond de type "photo grand format" pour votre page, il ne va pas recouvrir toute la surface de la page, il ne recouvrira que le contenu et pas les marges. Pour y arriver, il existe une astuce : Choisissez une taille trs petite pour les marges Ajoutez une bordure de page d'un pixel de couleur blanche Modifiez le "spacing to content" (espace avec le contenu) pour cette bordure Cette "marge intrieure" sera recouverte par votre image de fond. OpenOffice.org ne permet pas directement de changer votre image de fond avec un aspect "transparent", augmentez sa luminosit avec the-gimp ou crez un bloc blanc avec alpha 50% sous inkscape pour obtenir cette effet, avant de slectionner cette image en tant qu'image de fond dans OpenOffice.org. Ces astuces proviennent de : http://homepage.ntlworld.com/pesala/Home/html/watermarks.html
Pour notre exemple Pour notre exemple nous choisissons simplement une image positionne en haut gauche sur la page de garde :
72
HelloUniverse
cran 59
73
HelloUniverse
Sommaire et titres
Ou trouver les styles ? Style des titres de parties : comme montr dans le premier exemple helloworld, cherchez l'un des premiers blocs jaunes Template "text" (dans notre cas la troisime page de l'odStyle) Style des titres dans le sommaire : chercher dans le modle de page du pagemaster correspondant (dans notre cas, la deuxime page du fichier odStyle) Proprits spcifiques aux titres de parties : menu Tools -> Outline Numbering Proprits spcifiques au sommaire : cliquez sur une ligne de contenu l'intrieur du sommaire, puis simulez la cration d'un nouveau sommaire : insert -> Indexes and tables -> Indexes and tables Numrotation et marge des titres dans le contenu Pour supprimer la numrotation, placez vous dans l'cran Outline Numbering : Mettez le type Number None Supprimez les sparateurs "Before" et "After"... Attention, par dfaut "Before" contient un espace vide qu'il faut aussi supprimer si vous voulez que votre texte soit bien align.
cran 60 Le 2me onglet de la boite de dialogue "position" nous permettrait de rgler la marge des titres : mme si le style de la police est "align gauche et sans marge", les titres ont une marge supplmentaire dfinie par cette onglet position. Si nous souhaitions mettre tous les titres aligns gauche au mme niveau, nous devrions passer par cet onglet.
La table des matires Nous avions dj rgl prcdemment l'option Evaluate up to level 1 pour afficher uniquement le nom des plantes, ce qui est la seul personnalisation au niveau de cet cran dont nous avons besoin pour l'instant. On peut aussi modifier le style de caractre de ces titres.
74
HelloUniverse
cran 61
Saut de page avant le titre de niveau 1 Pour faire un document sous la forme "1 page par plante", nous modifions le style du titre de niveau 1 pour le faire prcder d'un saut de page :
75
HelloUniverse
cran 62
8 Stylage Interface Auteur

Zone de l'arbre L'une des premires personnalisation apporter sur son modle est de changer les icnes des items (les pages bleu et rouge par dfaut). Le format doit obligatoirement tre le suivant : PNG 18x15, 32 bits (avec canal alpha). Les petits symboles "item en erreur" y seront automatiquement superposs s'il y a lieu. L'icne doit tre mise par drag & drop dans <sm:authoring -> sm:icon> d'un fichier compositionPrim ou dataFormPrim. Zone d'dition Si vous avez essay SCENARIdiscovery, vous avez vu que les titres bnficiaient d'une mise en forme spciale. La procdure pour arriver ce type d'effet est dtaille ici : Wiki : stylage de la zone d'dition Scenari
9 Constructeur d'application
appMake Pour transformer vos modles en applications autonome, on utilise un fichier d'application. Son usage est dcrit sur la page du wiki appMake. .appMake : un constructeur
76
HelloUniverse
pour hellouniverse Pour hellouniverse, nous allons faire une application pour Linux et Windows. Nous devons : Crer les icnes l'aide de the gimp et de parties de notre maquette inkscape ; Dfinir 2 entres dans <sm:make> pour gnrer les applications pour 2 systmes d'exploitation : Linux et Windows ; Crer un atelier par dfaut avec du contenu exemple.
cran 63
77
HelloUniverse
10 Conclusion
Merci d'avoir lu ce tutoriel Parmi tous les visiteurs du site scenari-platform.org (quelques centaines par jour), seulement un pourcentage infime auront le courage d'aller aussi loin dans l'apprentissage de la cration de modles documentaires, c'est un grand gage de motivation que nous apprcions beaucoup. Comme indiqu prcdemment, les forums et mailing lists vous sont toujours ouverts si vous avez des questions, si vous voulez vous prsenter, ou parler de vos projets avec Scenari. Pour contribuer Il existe diffrentes manires parfois assez simple de faire progresser le projet Scenari : Faites connatre Scenari d'ventuels futurs utilisateurs ou modlisateurs. Signalez les difficults que vous avez rencontres lors de l'installation ou l'utilisation de Scenari et les bugs ventuels. Testez les versions alpha ou les nightlies et si vous avez des propositions d'amliorations trs simples, faites des suggestions (de prfrence avant que la version suivante n'entre en phase beta pendant laquelle les efforts sont concentrs sur la correction des bugs). Testez Scenari sur votre distribution Linux ou sur votre environnement, crez et devenez mainteneur des packages Scenari pour cette distribution. Placez (si vous le pouvez) vos modles en licence libre et faites en profiter les autres. Ecrivez des tutoriels ou de la documentation en fonction de vos expriences. Proposez de raliser des traductions de cette documentation, du site scenari-platform.org ou des plaquettes de communication. Si vous reprsentez une entreprise : Choisissez des membres de la communaut scenari-platform.org ou rclamez l'usage de Scenari vos prestataires de service si vous devez sous traiter des projets de production de documents structurs. Financez le dveloppement des nouvelles fonctionnalits qui vous intressent sur la place des volutions. Suivez une formation professionnelle Scenari : vous pouvez reprendre l'apprentissage au dpart ou demander l'approfondissement de certains thmes. Ces tutoriels ciblent un profil "super-informaticien" et ncessitent beaucoup d'autonomie, alors que les formations ont des pr-requis plus souples.
78
HelloUniverse
V Glossaire
Code
Suite de caractres alphabtiques, courte de prfrence. N'utilisez pas de caractres spciaux (&, @...), de caractres accentus (, ...) ou d'espaces. un document. L'item correspondant apparat dans le volet d'exploration et peut tre rutilis dans le document en cours ou dans un autre document.
Contenu externalis dsigne un contenu faisant l'objet d'un item distinct de l'item utilis pour structurer Espace Item externe Item racine
Un espace est un dossier de classement. Les espaces forment arborescence.
une
Un item externe est un contenu faisant l'objet d'un item autonome, apparaissant dans le systme de fichiers. Elment permettant de structurer un document en fonction du type de support de publication choisi. Il autorise la saisie de contenu en vue de sa publication. Parfois, cet item est fusionn avec l'item de gnration, on accde alors aux gnrations via un onglet Publications ou Gnrations, situ ct de l'onglet d'dition. Morceau de programme qui fonctionne tout seul (traduction de stand alone), sans que l'utilisateur ait besoin d'une autre application pour le faire fonctionner. Exemple : un modle diffus sous forme de wsppack n'est pas standalone parce qu'il ncessite l'utilisation de SCENARIchain pour tre lanc. SCENARIdiscovery est une application standalone. Volet d'exploration des ateliers : lment d'affichage permanent plac la gauche de l'cran. Il affiche, par ordre alphabtique, le contenu des ateliers actifs. Un item widget est un lment graphique complexe, fortement paramtrable et rutilisable plusieurs fois. Exemple Web: uiWidget, le menu, un bouton de navigation, un menu local etc. Exemple OD : odWidget, une structure rcurrente
Standalone
Volet d'exploration des ateliers widget
79
Glossaire
VI Copies d'cran
cran 1 L'interface d'dition du modle Helloworld - p. 6 cran 2 Les deux suports de publication du modle Helloworld - p. 7 cran 3 - p. 9 cran 4 - p. 9 cran 5 - p. 10 cran 6 - p. 11 cran 7 - p. 13 cran 8 L'interface d'dition du modle Helloworld - p. 14 cran 9 - p. 14 cran 10 - p. 16 cran 11 - p. 17 cran 12 - p. 18 cran 13 - p. 18 cran 14 - p. 20 cran 15 - p. 21 cran 16 - p. 22 cran 17 - p. 23 cran 18 - p. 25 cran 19 - p. 26 cran 20 - p. 27 cran 21 - p. 28 cran 22 - p. 36 cran 23 - p. 36 cran 24 - p. 37 cran 25 - p. 38 cran 26 - p. 38 cran 27 - p. 39 cran 28 - p. 39 cran 29 - p. 41 cran 30 - p. 42 cran 31 - p. 44 cran 32 - p. 46 cran 33 - p. 47 cran 34 - p. 48 cran 35 - p. 49 cran 36 - p. 50 cran 37 - p. 52 cran 38 - p. 52 cran 39 - p. 53 cran 40 - p. 54 cran 41 - p. 55 cran 42 - p. 55 cran 43 - p. 56 cran 44 - p. 57 cran 45 - p. 58 cran 46 - p. 58 cran 47 - p. 59 cran 48 - p. 59
80
Copies d'cran
cran 49 - p. 60 cran 50 - p. 61 cran 51 - p. 63 cran 52 - p. 64 cran 53 - p. 65 cran 54 - p. 66 cran 55 - p. 67 cran 56 - p. 68 cran 57 - p. 69 cran 58 - p. 70 cran 59 - p. 73 cran 60 - p. 74 cran 61 - p. 75 cran 62 - p. 76 cran 63 - p. 77
81
Copies d'cran

User Guide

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

User Guide

Încărcat de

Drepturi de autor:

Formate disponibile

Guide SCENARIbuilder

Tutoriel HelloWorld & HelloUniverse pour SCENARIbuilder

2.3 (SCENARIbuilder 3.6)

Version du document Date Editeur Rdacteurs

2.3 (SCENARIbuilder 3.6) 12/11/2009 UTC

cran 1 L'interface d'dition du modle Helloworld

cran 2 Les deux suports de publication du modle Helloworld

Actualisez l'atelier en passant par le bouton d'action

situ sur la barre de titre de l'atelier.

2 Gnrateur Open Document Text

Publication -> Gnrateurs 'open document' -> odGenerator

hwOd.generator Recopiez tous les champs suivants :

Redistribuez des applications

Vous partez du mme atelier que celui du tutoriel prcdent

Ensuite, quelques renommages sont effectuer

3 Les donnes de type "formulaire"

Quand utiliser des dataforms ?

Rsultat dans SCENARItest

Le groupe sat En sous niveau de sat, le champ name (nom du satellite)

ODT : Page de garde, table des matires, numrotation

Pour modifier un style dj existant

Se reprer dans les fichiers CSS

cran 53 Crer un nouveau style complet

Faire le template dans SCENARIbuilder

Export d'une maquette finale

Dcoupage des objets

Intgration dans le CSS

7 Stylage OpenDocument Text

8 Stylage Interface Auteur

Un espace est un dossier de classement. Les espaces forment arborescence.

Volet d'exploration des ateliers widget

S-ar putea să vă placă și