improve documentation
authorBenjamin Auder <benjamin.auder@somewhere>
Thu, 28 Dec 2017 14:05:38 +0000 (15:05 +0100)
committerBenjamin Auder <benjamin.auder@somewhere>
Thu, 28 Dec 2017 14:05:38 +0000 (15:05 +0100)
README [deleted file]
README.md
doc/index.css
doc/index.html
doc/index.pug

diff --git a/README b/README
deleted file mode 100644 (file)
index 9b88ac9..0000000
--- a/README
+++ /dev/null
@@ -1,25 +0,0 @@
-## Prérequis
-
-php (assez récent)
-
-## Ajustement du fichier de données
-
-Renommer joueurs.csv.dist en joueurs.csv
-Éditer joueurs.csv (ajout de joueurs, édition, suppression...)
-Format en lignes : prénom,nom[,score,pdt,présent]
-                                     pdt = points de table
-score,pdt,présent : optionnels (défaut 0, 0, 1)
-
-## Lancement de l'aplication
-
-[Linux] Double click sur "westcastle.sh", ou lancement depuis un terminal
-[Windows,MacOS] `php -S localhost:8000` puis naviguer vers index.html
-
-## Utilisation
-
-1) Cliquer sur les joueurs absents dans l'onglet "joueurs"
-2) Aller dans la section "appariements" et cliquer sur le bouton en haut
-3) À la fin d'une ronde, cliquer sur chaque table pour indiquer les points
-   Pour lancer la ronde suivante, revenir en 1)
-
-Le classement est mis à jour dans la rubrique correspondante et dans joueurs.csv
index edeb595..4654ca7 100644 (file)
--- a/README.md
+++ b/README.md
@@ -14,19 +14,8 @@ pdt = "points de table" ; session = "mini-points"
 ## Lancement de l'aplication
 
  - [Linux] Double click sur "westcastle.sh", ou lancement depuis un terminal
 ## Lancement de l'aplication
 
  - [Linux] Double click sur "westcastle.sh", ou lancement depuis un terminal
- - [Windows,MacOS] `php -S localhost:8000` puis naviguer vers index.html
+ - [Windows,MacOS] `php -S localhost:8000` puis aller &agrave; http://localhost:8000 dans un navigateur web
 
 ## Utilisation
 
 
 ## Utilisation
 
- 1. Cliquer sur les joueurs absents dans l'onglet "joueurs"
- 2. Aller dans la section "appariements" et cliquer sur le bouton en haut
- 3. Lancer le chrono (section "chronom&egrave;tre", puis click gauche, puis passer en plein &eacute;cran [F11])
- 4. &Agrave; la fin d'une ronde, cliquer sur chaque table pour indiquer les (mini-)points.
-
-Le classement est mis &agrave; jour dans la rubrique correspondante et dans joueurs.csv. Il peut &ecirc;tre r&eacute;initialis&eacute; (bouton en haut).
-
-Apr&egrave;s chaque op&eacute;ration sur les points, en cas d'erreur le bouton "Restaurer" en haut &agrave; droite annule la derni&egrave;re op&eacute;ration.
-
------
-
-Pour plus de d&eacute;tails, naviguer vers localhost:8000/doc
+Naviguer vers http://localhost:8000/doc
index 1bb5968..30b723e 100644 (file)
@@ -1,9 +1,26 @@
 @import '../vendor/Ubuntu_googlefont.css';
 
 @import '../vendor/Ubuntu_googlefont.css';
 
+.tldr {
+       color: green;
+       font-weight: bold;
+}
+
+hr {
+       margin-bottom: 15px;
+}
+
+p.small-spacing {
+       margin-bottom: 5px;
+}
+
+ul, ol {
+       margin-top: 5px;
+}
+
 body {
        font-family: Ubuntu, Verdana, sans-serif;
        font-size: 1.1rem;
 body {
        font-family: Ubuntu, Verdana, sans-serif;
        font-size: 1.1rem;
-       width: 1200px;
+       width: 800px;
        margin: 30px auto;
        line-height: 1.5rem;
 }
        margin: 30px auto;
        line-height: 1.5rem;
 }
index 27bc7de..7e870dc 100644 (file)
@@ -5,41 +5,49 @@
     <title>Westcastle usage</title>
     <link rel="stylesheet" href="doc/index.css">
   </head>
     <title>Westcastle usage</title>
     <link rel="stylesheet" href="doc/index.css">
   </head>
-  <body><span>L'application est divisée en 4 sections :</span>
+  <body><span class="tldr">TL;DR:</span>
+    <ol>
+      <li>Cliquer sur les joueurs absents dans l'onglet "joueurs"</li>
+      <li>Aller dans la section "appariements" et cliquer sur le bouton en haut</li>
+      <li>Lancer le chrono (section "chronomètre", puis click gauche [puis F11])</li>
+      <li>À la fin d'une ronde, cliquer sur chaque table pour indiquer les (mini-)points.</li>
+    </ol>
+    <p>Le classement est mis à jour dans la rubrique correspondante et dans joueurs.csv.</p>
+    <p>Voir aussi la <a href="https://auder.net/westcastle_demo.webm">vidéo de démonstration</a></p>
+    <hr><span>L'application est divisée en 4 sections :</span>
     <ul>
       <li>Participants : la liste des joueurs présents (et absents)</li>
       <li>Appariements : répartition des joueurs présents par tables</li>
       <li>Chronomètre : un chrono qui démarre à 1h30 et sonne une fois à zéro</li>
       <li>Classement : le tableau des scores (voir aussi joueurs.csv)</li>
     </ul>
     <ul>
       <li>Participants : la liste des joueurs présents (et absents)</li>
       <li>Appariements : répartition des joueurs présents par tables</li>
       <li>Chronomètre : un chrono qui démarre à 1h30 et sonne une fois à zéro</li>
       <li>Classement : le tableau des scores (voir aussi joueurs.csv)</li>
     </ul>
-    <h2>Participants</h2><img src="doc/screen_players.png">
+    <h2>Participants</h2>
     <p>
       Un clic sur un joueur présent l'enlève des joueurs actifs (il est absent) ;
       réciproquement, un clic sur un absent le ramène dans la liste des joueurs actifs.
       Les appariements sont déterminés pour les joueurs présents seulement - en revanche le classement indique tout le monde.
       
     </p>
     <p>
       Un clic sur un joueur présent l'enlève des joueurs actifs (il est absent) ;
       réciproquement, un clic sur un absent le ramène dans la liste des joueurs actifs.
       Les appariements sont déterminés pour les joueurs présents seulement - en revanche le classement indique tout le monde.
       
     </p>
-    <h2>Appariements</h2><img src="doc/screen_pairings_new.png">
+    <h2>Appariements</h2>
     <p>
       Un clic sur le bouton "Nouvelle ronde" réinitialise toutes les tables, en (re-)répartissant les joueurs aléatoirement sur celles-ci.
       Si nécessaire, un quatrième joueur "Toto" est ajouté en fin de table.
     <p>
       Un clic sur le bouton "Nouvelle ronde" réinitialise toutes les tables, en (re-)répartissant les joueurs aléatoirement sur celles-ci.
       Si nécessaire, un quatrième joueur "Toto" est ajouté en fin de table.
-      Si seulement 1, 2, ou 5 ou 6 joueurs sont présents, aucune configuration ne permet de faire jouer tout le monde : il y aura des joueurs exempts.
+      Si seulement 1, 2, ou 5 joueurs sont présents, aucune configuration ne permet de faire jouer tout le monde : il y aura des joueurs exempts.
       
       
-    </p><img src="doc/screen_pairings_scoring.png">
+    </p>
     <p>
       En fin de ronde, un clic sur une table permet de donner les scores de chaque joueur - en mini-points.
       Un clic sur "Enregistrer" valide les scores : le classement est automatiquement mis à jour dans la rubrique correspondante,
       et la table s'affiche désormais sur fond vert. Un clic sur "Fermer" annule l'opération, aucun changement n'est effectué.
       
     <p>
       En fin de ronde, un clic sur une table permet de donner les scores de chaque joueur - en mini-points.
       Un clic sur "Enregistrer" valide les scores : le classement est automatiquement mis à jour dans la rubrique correspondante,
       et la table s'affiche désormais sur fond vert. Un clic sur "Fermer" annule l'opération, aucun changement n'est effectué.
       
-    </p><img src="doc/screen_pairings_restore.png">
-    <p>
-      En cas d'erreur, ne surtout pas scorer une nouvelle table : d'abord restaurer l'état précédent en cliquant sur le bouton "Restaurer"
+    </p>
+    <p>En cas d'erreur, <strong>ne surtout pas scorer une nouvelle table :</strong> d'abord restaurer l'état précédent en cliquant sur le bouton "Restaurer"
       sur l'écran de classement ; alternativement, on peut cliquer sur le lien présent dans l'avertissement lorsqu'on reclique sur la table en question.
       Ensuite, rentrer les scores corrigés.
       
     </p>
       sur l'écran de classement ; alternativement, on peut cliquer sur le lien présent dans l'avertissement lorsqu'on reclique sur la table en question.
       Ensuite, rentrer les scores corrigés.
       
     </p>
-    <h2>Chronomètre</h2><img src="doc/screen_timer.png">
-    <p>
+    <h2>Chronomètre</h2>
+    <p class="small-spacing">
       Ce chronomètre basique est conçu pour s'afficher centré en mode plein écran : il faut donc commencer par appuyer sur F11
       (la touche peut varier suivant le navigateur...). Ensuite :
       
       Ce chronomètre basique est conçu pour s'afficher centré en mode plein écran : il faut donc commencer par appuyer sur F11
       (la touche peut varier suivant le navigateur...). Ensuite :
       
@@ -53,7 +61,7 @@
       Note : le chronomètre reste actif même si l'on change de vue - penser à le mettre en pause ou le réinitialiser.
       
     </p>
       Note : le chronomètre reste actif même si l'on change de vue - penser à le mettre en pause ou le réinitialiser.
       
     </p>
-    <h2>Classement</h2><img src="doc/screen_ranking.png">
+    <h2>Classement</h2>
     <p>
       Les scores sont ordonnés par points de table décroissants d'abord, puis en cas d'ex-aequos par mini-points décroissants.
       
     <p>
       Les scores sont ordonnés par points de table décroissants d'abord, puis en cas d'ex-aequos par mini-points décroissants.
       
index 9d7d348..99aaef2 100644 (file)
@@ -8,6 +8,18 @@ html
 
        body
 
 
        body
 
+               span.tldr TL;DR:
+               ol
+                       li Cliquer sur les joueurs absents dans l'onglet "joueurs"
+                       li Aller dans la section "appariements" et cliquer sur le bouton en haut
+                       li Lancer le chrono (section "chronomètre", puis click gauche [puis F11])
+                       li À la fin d'une ronde, cliquer sur chaque table pour indiquer les (mini-)points.
+               p Le classement est mis à jour dans la rubrique correspondante et dans joueurs.csv.
+
+               p Voir aussi la #[a(href="https://auder.net/westcastle_demo.webm") vidéo de démonstration]
+
+               hr
+
                span L'application est divisée en 4 sections :
                ul
                        li Participants : la liste des joueurs présents (et absents)
                span L'application est divisée en 4 sections :
                ul
                        li Participants : la liste des joueurs présents (et absents)
@@ -17,8 +29,6 @@ html
 
                h2 Participants
 
 
                h2 Participants
 
-               img(src="doc/screen_players.png")
-
                p.
                        Un clic sur un joueur présent l'enlève des joueurs actifs (il est absent) ;
                        réciproquement, un clic sur un absent le ramène dans la liste des joueurs actifs.
                p.
                        Un clic sur un joueur présent l'enlève des joueurs actifs (il est absent) ;
                        réciproquement, un clic sur un absent le ramène dans la liste des joueurs actifs.
@@ -26,32 +36,24 @@ html
 
                h2 Appariements
 
 
                h2 Appariements
 
-               img(src="doc/screen_pairings_new.png")
-
                p.
                        Un clic sur le bouton "Nouvelle ronde" réinitialise toutes les tables, en (re-)répartissant les joueurs aléatoirement sur celles-ci.
                        Si nécessaire, un quatrième joueur "Toto" est ajouté en fin de table.
                        Si seulement 1, 2, ou 5 joueurs sont présents, aucune configuration ne permet de faire jouer tout le monde : il y aura des joueurs exempts.
 
                p.
                        Un clic sur le bouton "Nouvelle ronde" réinitialise toutes les tables, en (re-)répartissant les joueurs aléatoirement sur celles-ci.
                        Si nécessaire, un quatrième joueur "Toto" est ajouté en fin de table.
                        Si seulement 1, 2, ou 5 joueurs sont présents, aucune configuration ne permet de faire jouer tout le monde : il y aura des joueurs exempts.
 
-               img(src="doc/screen_pairings_scoring.png")
-
                p.
                        En fin de ronde, un clic sur une table permet de donner les scores de chaque joueur - en mini-points.
                        Un clic sur "Enregistrer" valide les scores : le classement est automatiquement mis à jour dans la rubrique correspondante,
                        et la table s'affiche désormais sur fond vert. Un clic sur "Fermer" annule l'opération, aucun changement n'est effectué.
 
                p.
                        En fin de ronde, un clic sur une table permet de donner les scores de chaque joueur - en mini-points.
                        Un clic sur "Enregistrer" valide les scores : le classement est automatiquement mis à jour dans la rubrique correspondante,
                        et la table s'affiche désormais sur fond vert. Un clic sur "Fermer" annule l'opération, aucun changement n'est effectué.
 
-               img(src="doc/screen_pairings_restore.png")
-
                p.
                p.
-                       En cas d'erreur, ne surtout pas scorer une nouvelle table : d'abord restaurer l'état précédent en cliquant sur le bouton "Restaurer"
+                       En cas d'erreur, #[strong ne surtout pas scorer une nouvelle table :] d'abord restaurer l'état précédent en cliquant sur le bouton "Restaurer"
                        sur l'écran de classement ; alternativement, on peut cliquer sur le lien présent dans l'avertissement lorsqu'on reclique sur la table en question.
                        Ensuite, rentrer les scores corrigés.
 
                h2 Chronomètre
 
                        sur l'écran de classement ; alternativement, on peut cliquer sur le lien présent dans l'avertissement lorsqu'on reclique sur la table en question.
                        Ensuite, rentrer les scores corrigés.
 
                h2 Chronomètre
 
-               img(src="doc/screen_timer.png")
-
-               p.
+               p.small-spacing.
                        Ce chronomètre basique est conçu pour s'afficher centré en mode plein écran : il faut donc commencer par appuyer sur F11
                        (la touche peut varier suivant le navigateur...). Ensuite :
 
                        Ce chronomètre basique est conçu pour s'afficher centré en mode plein écran : il faut donc commencer par appuyer sur F11
                        (la touche peut varier suivant le navigateur...). Ensuite :
 
@@ -65,8 +67,6 @@ html
 
                h2 Classement
 
 
                h2 Classement
 
-               img(src="doc/screen_ranking.png")
-
                p.
                        Les scores sont ordonnés par points de table décroissants d'abord, puis en cas d'ex-aequos par mini-points décroissants.
 
                p.
                        Les scores sont ordonnés par points de table décroissants d'abord, puis en cas d'ex-aequos par mini-points décroissants.