X-Git-Url: https://melusine.eu.org/syracuse/G/git/?a=blobdiff_plain;f=doc%2Fpage.md;h=0ef33edf45db04ea7d41e7a34f43d90e4fca5d58;hb=73c1423ab31887669bb5fcbfcd5003abe74a0c87;hp=9e3503b736c8c0e9b14ca5953755a779e4cc8f4f;hpb=6a9b3b4d49e62b9a57eff23c820c74141f1c0a05;p=svganimation.git

diff --git a/doc/page.md b/doc/page.md
index 9e3503b..0ef33ed 100644
--- a/doc/page.md
+++ b/doc/page.md
@@ -1,4 +1,3 @@
-<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
 <script type="text/javascript" src="../SVGAnimation.js"></script>
 <script type="text/javascript" src="../SVGPlayerOne.js"></script>
 <script type="text/javascript">
@@ -9,7 +8,7 @@
     player.connect();
   }
   function charge_anim2() {
-    var a = new Animation('anim2');
+    var a = new Animation('anim2','../ellipsographe/svg/ellipsographe-',1,91);
     a.loopOnload();
     var b = new Controle(a);
     b.connect();
@@ -41,8 +40,9 @@ JavaScript qui permettra de choisir quand l'animation se charge. 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>
+<p>Nous présentons, dans la section <a
+href="#chargement-différé">Chargement différé</a>, le code qui permet de
+charger l'animation sur demande.</p>
 </div>
 
 ## Installation
@@ -91,7 +91,8 @@ La librairie `SVGAnimation` définit le *prototype* javascript
 `Animation`. Pour l'utiliser il faut déclarer une balise HTML `div`
 avec un identifiant (`id`) unique. Choisissons pour l'exemple `XXXX`.
 À l'intérieur de ces balises, il
-faut :
+faut&#8239;:
+
 * une balise `img` contenant un image `svg` qui servira de vignette à
   l'animation;
 * une balise `div` avec l'identifiant `id="XXXX_message"` où `XXXX` est
@@ -202,22 +203,25 @@ dont l'affichage est :
 </div>
 
 
-Il est possible de différer le chargement de l'animation en créant une fonction Javascript.
+#### Chargement différé
+
+On peut laisser le chargement d'une animation à la demande en créant une
+fonction Javascript.
 
 ~~~~~~~ { .javascript }
 function charge_anim2() {
-  var a = new Animation('anim2');
+  var a = new Animation('anim2','svg/ellipsographe-',1,91);
   a.loopOnload();
   var b = new Controle(a);
   b.connect();
 }
 ~~~~~~~
 
-Fonction qui sera liée à l'*événement* `onclick` d'un bouton proposant, à
-l'internaute, le chargement de l'animation...
+Fonction qui sera liée à l'*événement* `onclick` d'un bouton proposant
+justement le chargement de l'animation...
 
 ~~~~~~~ { .html }
-<div id="anim2"  
+<div id="anim2"
   style="margin:10px auto;padding:10px;width:354px;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="anim2_message">Ellipsographe</div>
@@ -225,18 +229,42 @@ l'internaute, le chargement de l'animation...
 </div>
 ~~~~~~~
 
-On peut en profiter pour adapter le *style* des éléments englobants.
+Dans le même temps, le *style* des éléments englobants a été adapté.
 
-<div id="anim2"  style="margin:10px auto;padding:10px;width:350px;border:2px solid #AAA;border-radius:4px">
+<div id="anim2"  style="margin:10px auto;padding:10px;width:354px;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="anim2_message">Ellipsographe</div>
-  <div id="anim2_boutons"><button onclick="charge_anim2">Charger l'animation</button></div>
+  <div id="anim2_boutons"><button onclick="charge_anim2()">Charger l'animation</button></div>
 </div>
 
 
 
 ### Les paramètres
 
+L'objet `Animation` ne possède que deux propriétés configurables, autres
+que celles (4) qui lui sont passées en argument.
+
+&bull; **delai** *(valeur par défaut : 50)* &mdash; C'est la durée, en millisecondes, entre deux images.
+
+~~~{.javascript}
+var a = new Animation('anim','svg/pre',1,100);
+a.delai = 200;
+a.loopOnload();
+~~~
+Ceci fixera le défilement à 5 images/s. Un *player* comme ceux que nous vous proposons ci-dessus peut
+modifier cette valeur.
+
+&bull; **pad** *(valeur par défaut : 0)* &mdash; Ce paramètre n'a d'effet
+que s'il est supérieur ou égal à 2, il permet de fixer la longueur des
+index des images en complétant avec des 0.
+
+~~~{.javascript}
+var a = new Animation('anim','svg/pre',1,100);
+a.pad = 3;
+a.loopOnload();
+~~~
+Les images chargées seront, successivement, `svg/pre001.svg`, `svg/pre002.svg`, ..., `svg/pre100.svg`.
+
 ## Les *players*
 
 ### `SVGPlayerOne.js`