Doc: Installation, Warning, Principe, Famille d'images
[svganimation.git] / doc / page.md
index 1da4cdb..a77c386 100644 (file)
@@ -21,17 +21,58 @@ constitué à partir de l'exploration de différents scénarios de
 présentation de ces animations et des modes de construction des fichiers
 SVG.
 
+<div class="alert alert-warning">
+<p>Les différents exemples se charge en cliquant sur le bouton
+dédié. Ceci **n'est pas** le comportement par défaut. Il s'agit
+d'éviter de charger toutes les animations présentes sur cette page,
+cela serait bien trop lourd.</p>
+<p>Nous présentons, dans la section XX, le code qui permet de charger
+l'animation sur demande.</p>
+</div>
+
 ## Installation
 
-Le fichier `SVGAnimation.js` (que l'on supposera dans le répertoire `js`) est à charger dans la page `html` en mettant les lignes suivantes :
+Le fichier `SVGAnimation.js` (que l'on supposera dans un répertoire nommé `js`) est à charger dans la page `html` en mettant les lignes suivantes :
 
     <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
     <script type="text/javascript" src="js/SVGAnimation.js"></script>
 
-La librairie `SVGAnimation.js` dépend de `JQuery`, il faut donc charger charger cette bibliothèque JavaScript avant. 
+La librairie `SVGAnimation.js` dépend de `JQuery`, il faut donc charger cette bibliothèque JavaScript avant.
+
+## Principe
+
+Le principe est simple : on dispose d'un ensemble d'images au format
+SVG qui constituent, par une suite chronologique, une animation à
+visionner. La libraire `SVGAnimation` permet de visionner cette
+animation dans une page HTML.
+
+### La famille d'images
+
+Les différentes images composant l'animation doivent se nommer avec un
+*prefixe* suivit d'un tiret puis d'un nombre (celui-ci pouvant être
+formater de différente façons).
+
+    monfichier-1.svg  monfichier-2.svg monfichier-3.svg ...
+
+ou
+
+    monfichier-001.svg  monfichier-002.svg monfichier-003.svg ...
+
+Nous verrons comment gérer le formatage de l'indice des images dans
+les sections suivantes.
+
+<div class="alert alert-info">
+<p>L'idée d'une telle librairie est venue du fait que le logiciel
+MetaPost permet de produire des images SVG, et nous l'utilisons
+abondamment pour la production d'animations.</p>
+</div>
+
 
 ## L'objet `Animation`
 
+La librairie `SVGAnimation` définit le *prototype* javascript
+`Animation`. Pour l'utiliser il faut déclarer
+
 <div id="anim1" style="margin:10px auto;padding:10px;width:350px;border:2px solid #AAA;border-radius:4px">
   <img src="../ellipsographe/svg/ellipsographe-1.svg" alt="animation1" style="width:330px;height:240px"/>
   <div class="message" id="anim1_message">Ellipsographe</div>
@@ -39,6 +80,7 @@ La librairie `SVGAnimation.js` dépend de `JQuery`, il faut donc charger charger
 </div>
 
 
+### L'utilisation
 
 ### Les paramètres
 
@@ -47,7 +89,3 @@ La librairie `SVGAnimation.js` dépend de `JQuery`, il faut donc charger charger
 ### `SVGPlayerOne.js`
 
 ### `SVGPlayerButtons.js`
-
-
-
-

Licence Creative Commons Les fichiers de Syracuse sont mis à disposition (sauf mention contraire) selon les termes de la
Licence Creative Commons Attribution - Pas d’Utilisation Commerciale - Partage dans les Mêmes Conditions 4.0 International.