Compare commits

...

10 Commits
v1.0 ... master

6 changed files with 75 additions and 17 deletions

View File

@ -6,10 +6,59 @@ 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/23/) pour faire des tests en direct.
L'objet options passé en argument peut avoir les propriétés suivantes :
## 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
<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 l'attribut onclick="fodsLink()" du lien
```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
La construction du blob de téléchargement se fait avec l'appel de la fonction Html2Ods.blob qui prend deux arguments : la table (instance de HtmlTableElement ou chaine de caractères indiquant l'identifiant de l'élément) et un objet d'options facultatif. Ce dernier peut avoir les propriétés suivantes :
- *currency* : monnaie par défaut des valeurs monétaires (peut être modifiée au niveau de la table ou de la cellule)
- *datePattern* : formatage par défaut des dates (peut être modifié au niveau de la table ou de la cellule) ; `YYYY-MM-DD` par défaut
@ -31,6 +80,8 @@ Il est à noter que les attributs `colspan` et `rowspan` sont reconnus et appliq
- `data-od-fixed-rows` : nombre de lignes fixes
- `data-od-fixed-columns` : nombre de colonnes fixes
_Note_ : `data-od-sheetname` est obligatoire pour utiliser `data-od-fixed-rows` ou `data-od-fixed-columns`
### Éléments `<col>` ou `<colgroup>`
- `data-od-style` : style de la colonne
@ -40,6 +91,7 @@ Il est à noter que les attributs `colspan` et `rowspan` sont reconnus et appliq
### Élément `<tr>`
- `data-od-style` : style de la ligne (en cas d'absence de valeur, un élément `<tr>` a comme style *Header* s'il appartient à un élément `<thead>`, *Standard* sinon)
- `data-od-hidden` : avec la valeur 1 ou true, la ligne est cachée dans le fichier résultant, avec la valeur -1 ou false, la ligne est affichée dans le fichier résultant même si la ligne est cachée dans la version HTML
### Éléments `<td>` ou `<th>`

View File

@ -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;
}

View File

@ -8,10 +8,10 @@
<script type="text/javascript" src="../build/html2ods.js"></script>
<script>
function fodsLink() {
let link = document.getElementById("link");
function fodsLink(linkdId, tableId) {
let link = document.getElementById(linkdId);
link.href = URL.createObjectURL(
Html2Ods.blob("table", {
Html2Ods.blob(tableId, {
currency: "EUR",
datePattern: "DD/MM/YYYY"
})
@ -24,11 +24,18 @@ function fodsLink() {
</script>
</head>
<body>
<h1>Exemple dutilisation de jsHtml2Ods</h1>
<p>Basée sur la compilation dans le répertoire build/</p>
<div>
<p><a href="blob:" download="table.fods" id="link" onclick="fodsLink()">Version ODS</a></p>
<table id="table"
<h1>Exemples dutilisation de jsHtml2Ods</h1>
<h2>Table réduite à sa plus simple expression</h2>
<p><a href="blob:" download="table.fods" id="link1" onclick="fodsLink('link1', 'table1')">Version ODS</a></p>
<table id="table1">
<tr><td>Cellule 1.1</td><td>Cellule 1.2</td><td>Cellule 1.3</td></tr>
<tr><td colspan="2">Cellule 2.1 + 2.2</td><td>Cellule 2.3</td></tr>
</table>
<h2>Table plus complexe</h2>
<p><a href="blob:" download="table.fods" id="link2" onclick="fodsLink('link2', 'table2')">Version ODS</a></p>
<table id="table2"
data-od-sheetname="Tableau des projets"
data-od-fixed-rows="2"
data-od-fixed-columns="1">
@ -135,6 +142,5 @@ function fodsLink() {
</tr>
</tbody>
</table>
</div>
</body>
</html>

4
dist/html2ods.js vendored
View File

@ -1,4 +1,4 @@
/* version: v1.0 */
/* version: v1.0.1 */
var Html2Ods = function (output, table, options) {
@ -1556,7 +1556,7 @@ OpenDocument.StyleManager.DEFAULT_STYLES = [
name: "Italic",
parent: "Standard",
properties: {
"font-weight": "italic"
"font-style": "italic"
}
},
{

View File

@ -404,7 +404,7 @@ OpenDocument.StyleManager.DEFAULT_STYLES = [
name: "Italic",
parent: "Standard",
properties: {
"font-weight": "italic"
"font-style": "italic"
}
},
{

View File

@ -70,7 +70,7 @@ OpenDocument.XmlWriter.prototype.addXmlnsAttributes = function () {
.addAttribute("xmlns:xhtml", "http://www.w3.org/1999/xhtml")
.addAttribute("xmlns:grddl", "http://www.w3.org/2003/g/data-view#")
.addAttribute("xmlns:tableooo", "http://openoffice.org/2009/table")
.addAttribute("xmlns:vdrawooo", "http://openoffice.org/2010/draw")
.addAttribute("xmlns:drawooo", "http://openoffice.org/2010/draw")
.addAttribute("xmlns:calcext", "urn:org:documentfoundation:names:experimental:calc:xmlns:calcext:1.0")
.addAttribute("xmlns:loext", "urn:org:documentfoundation:names:experimental:office:xmlns:loext:1.0")
.addAttribute("xmlns:field", "urn:openoffice:names:experimental:ooo-ms-interop:xmlns:field:1.0")