From 760d38cfd62096e5d86a1b017c648a16c0bf9517 Mon Sep 17 00:00:00 2001
From: Vincent Calame <vincent.calame@exemole.fr>
Date: Mon, 8 Aug 2022 22:34:00 +0200
Subject: [PATCH] Chapitre sur l'utilisation

---
 README.md       | 56 ++++++++++++++++++++++++++++++++++++++++++++++++-
 demos/build.css |  4 ++--
 2 files changed, 57 insertions(+), 3 deletions(-)

diff --git a/README.md b/README.md
index 4fc962f..40e0372 100644
--- a/README.md
+++ b/README.md
@@ -6,8 +6,62 @@ Le principe de cette bibliothèque est de pouvoir écrire un lien proposant une
 
 Cette bibliothèque est testée sous Firefox ou Chromium pour des tableaux de petite taille.
 
+## Démonstration de la bibliothèque
 
-## Options disponible
+Une démonstration est visible ici : [jshtml2ods.exemole.fr/demo.html](https://jshtml2ods.exemole.fr/demo.html), également disponible via le site [Jsfiddle](https://jsfiddle.net/vcalame/4fxrkzgs/13/) pour faire des tests en direct.
+
+## Utilisation de la bibliothèque
+
+La bibliothèque est contenue dans un seul fichier sans dépendance. La dernière version stable se trouve dans le répertoire *dist/*, voir aussi les versions dans la forge : [forge.chapril.org/vcalame/jsHtml2Ods/releases](https://forge.chapril.org/vcalame/jsHtml2Ods/releases). La dernière version est utilisable directement en ligne : [https://jshtml2ods.exemole.fr/latest/html2ods.js](https://jshtml2ods.exemole.fr/latest/html2ods.js).
+
+L'utilisation se fait en trois étapes :
+
+1. Inclure la bibliothèque
+
+```html
+<script type="text/javascript" src="https://jshtml2ods.exemole.fr/latest/html2ods.js"></script>
+```
+
+2. Avoir dans le texte un lien et une table dotées d'identifiant HTML
+
+```html
+<script type="text/javascript" src="https://jshtml2ods.exemole.fr/latest/html2ods.js"></script>
+```
+
+
+```html
+<a href="blob:" download="table.fods" id="link" onclick="fodsLink()">Version ODS</a>
+
+...
+
+<table id="table">
+...
+</table>
+
+```
+
+3. Définir la fonction fodsLink indiquée dans onclick="fodsLink()"
+
+```html
+<script>
+
+function fodsLink() {
+	let link = document.getElementById("link");
+	link.href = URL.createObjectURL(
+		Html2Ods.blob("table")
+	);
+	setTimeout(function () {
+		URL.revokeObjectURL(link.href);
+	}, 4E4); // 40s
+	return true;
+}
+</script>
+```
+
+Cette fonction construit un objet de type Blob associé au lien de téléchargement.
+
+
+## Options disponibles
 
 L'objet options passé en argument peut avoir les propriétés suivantes :
 
diff --git a/demos/build.css b/demos/build.css
index 7c4add4..70e2dc7 100644
--- a/demos/build.css
+++ b/demos/build.css
@@ -73,11 +73,11 @@ column.Date {
 	width: 4cm;
 }
 
-column.Montant  ~ .colonnemontant {
+column.Montant ~ .colonnemontant {
 	width: 3cm;
 }
 
-column.NbreTranches  ~ .count {
+column.NbreTranches ~ .count {
 	width: 1.5cm;
 }