From 895376f5212d0a9253f6d1facdc3d4fb108ef114 Mon Sep 17 00:00:00 2001 From: Vincent Calame Date: Mon, 8 Aug 2022 21:45:16 +0200 Subject: [PATCH] Usage plus large de data-od-hidden --- README.md | 24 ++-- demos/build.css | 73 ++++++++-- demos/build.html | 129 ++++++++++++++---- demos/dev.html | 9 ++ .../opendocument/OpenDocument.OdsConverter.js | 11 +- src/js/opendocument/OpenDocument.js | 20 +++ 6 files changed, 213 insertions(+), 53 deletions(-) diff --git a/README.md b/README.md index 2bd93e8..4fc962f 100644 --- a/README.md +++ b/README.md @@ -6,15 +6,6 @@ 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éveloppement et compilation - -Le code Javascript est décomposé en plusieurs fichiers contenus dans *src/js/*, l'exemple *dev.html* du répertoire *demos/* charge ces fichiers séparément. - -Ces fichiers sont compilés dans un fichier unique via l'outil *jake* et le fichier *JakeFile.js* via la commande `jake build[version]`. Par défaut, ce fichier nommé *html2ods.js* est placé dans *build/* et est utilisé par l'exemple *build.html* du répertoire *demos/*. - -Le répertoire *dist/* contient la dernière compilation avec numéro de version. - -En mode développement, les fichiers de *src/js/currency*, *src/js/xmlwriter* et *src/js/opendocument* sont des bibliothèques séparées avec leur propre « espace de nom ». À la compilation, ils sont placés dans `Html2Ods` pour n'avoir qu'un seul « espace de nom », c'est pourquoi il ne faut pas supprimer la ligne `//compile target` dans le fichier *src/js/Html2Ods.js* ## Options disponible @@ -64,7 +55,7 @@ Par défaut, le texte de la cellule dans le fichier résultant est le texte brut Au lieu de l'attribut `data-od-text`, la valeur peut être définie dans l'attribut `data-text`, ce qui permet la comptabilité avec l'extension JQuery TableSorter. Si les deux attributs sont présents, `data-od-text` a la préséance. -Lorsque le texte de la cellule est le texte brut de l'élément, il est possible d'ignorer un élément enfant **direct** de l'élément `` ou `` en lui donnant l'attribut `data-od-hidden` avec n'importe quelle valeur non nulle (1 ou true sont conseillés). +Lorsque le texte de la cellule est le texte brut de l'élément, il est possible d'ignorer un élément enfant **direct** de l'élément `` ou `` en lui donnant l'attribut `data-od-hidden` avec la valeur 1 ou true. #### Formatage des dates @@ -79,7 +70,9 @@ Ce format doit est une chaine où les lettres suivantes sont remplacées par les - Y : année à deux chiffres - YY : année à quatre chiffres -Par exemple, le code ISO correspond au format `YYYY-MM-DD` ; `DD\MM\YY` affiche le trois novembre 2021 sous la forme 03/11/21). +Par exemple, le code ISO correspond au format `YYYY-MM-DD` ; `DD/MM/YY` affiche le trois novembre 2021 sous la forme 03/11/21). + +**Point important** : ce formatage concerne l'affichage dans le fichier résultant mais pas la date telle qu'elle est représentée dans le tableau HTML ; dans ce dernier cas, la date doit impérativement être fournie au format ISO. #### Code des monnaies @@ -151,3 +144,12 @@ Il est fort probable que certaines éléments du tableau disposent déjà de cla L'opérateur `~` doit être placé à la fin (notamment après l'indication d'une éventuelle parenté avec `+`) car le style peut correspondre à plusieurs classes différentes : `cell.NomDuStyle ~ .Classe1 .Classe2`. +## À propos du code et de sa compilation + +Le code Javascript est décomposé en plusieurs fichiers contenus dans *src/js/*, l'exemple *dev.html* du répertoire *demos/* charge ces fichiers séparément. + +Ces fichiers sont compilés dans un fichier unique via l'outil *jake* et le fichier *JakeFile.js* via la commande `jake build[version]`. Par défaut, ce fichier nommé *html2ods.js* est placé dans *build/* et est utilisé par l'exemple *build.html* du répertoire *demos/*. + +Le répertoire *dist/* contient la dernière compilation avec numéro de version. + +En mode développement, les fichiers de *src/js/currency*, *src/js/xmlwriter* et *src/js/opendocument* sont des bibliothèques séparées avec leur propre « espace de nom ». À la compilation, ils sont placés dans `Html2Ods` pour n'avoir qu'un seul « espace de nom », c'est pourquoi il ne faut pas supprimer la ligne `//compile target` dans le fichier *src/js/Html2Ods.js* diff --git a/demos/build.css b/demos/build.css index 4dc4a7a..7c4add4 100644 --- a/demos/build.css +++ b/demos/build.css @@ -3,32 +3,81 @@ body { } table { - border-collapse: collapse; - margin-left: 40px; + border-collapse: collapse; + margin-left: 40px; } td { - border-width: 1px; - border-color: #2e3436; - border-style: solid; - font-size: small; + border-width: 1px; + border-color: #2e3436; + border-style: solid; + font-size: small; } + th { - padding: 3px; + border-width: 1px; + border-color: #2e3436; + border-style: solid; + padding: 3px; } - .small { - font-size: smaller; - } +.check { + text-align: center; +} + +.colonnemontant { + min-width: 125px; +} + +.count { + width: 75px; +} .number { text-align: right; } +.small { + font-size: smaller; +} + +.text { + min-width: 300px; +} + /*************************** * Styles ODS * *************************/ -column.Date { - width: 2cm; +cell.Absent + cell.AR { + background-color: #ff0000; } + +cell.AR ~ .check { + text-align: center; +} + +cell.Dollar { + font-style: italic; +} + +cell.NonSolde { + background-color: #ffcc00; +} + +column.AR { + width: 1cm; +} + +column.Date { + width: 4cm; +} + +column.Montant ~ .colonnemontant { + width: 3cm; +} + +column.NbreTranches ~ .count { + width: 1.5cm; +} + diff --git a/demos/build.html b/demos/build.html index 4286891..a9f70bf 100644 --- a/demos/build.html +++ b/demos/build.html @@ -1,7 +1,7 @@ -Exemple après compilation dans Dist +Exemple d’utilisation de jsHtml2Ods @@ -11,55 +11,130 @@ function fodsLink() { let link = document.getElementById("link"); link.href = URL.createObjectURL( - Html2Ods.blob("table") + Html2Ods.blob("table", { + currency: "EUR", + datePattern: "DD/MM/YYYY" + }) ); setTimeout(function () { URL.revokeObjectURL(link.href); }, 4E4); // 40s return true; } - -

Exemple d'utilisation de jsHtml2Ods

+

Exemple d’utilisation de jsHtml2Ods

+

Basée sur la compilation dans le répertoire build/

-

Version ODS

+

Version ODS

- - - - - - - + + + + + + + + + + + + + + + + + + + - - - - - + + + + + + + + + - - + + + + + + + + + + + + + + + - - + + + + + + + + + - - - + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + -
ClientDatesNuitéesFacture
ProjetNomenclatureDatesSubventionNbre de tranchesTranche 1Tranche 2Tranche 3
DépartArrivéeDécision du financementRéception de la conventionDécidéeen $VerséeSoldeDateMontantARDateMontantARDateMontantAR
Victor Hugo01/12/2020Jardins partagésBIO01/12/202011/01/202116 175 €16 175 €0 €1 11/01/2021401 250 €
16 175 €✓
Panneaux photovoltaïquesERG05/01/202125/04/202115 864 €$16 50011 898 €3 966 €301/05/20217 932 €✓15/09/20213 966 €
Logiciels libresLL15/10/202030/11/20207 070 €7 070 €0301/05/20213 256 €✓07/06/20213 000 €21/12/2021814 €✓
+
diff --git a/demos/dev.html b/demos/dev.html index 88ce66e..5a27baf 100644 --- a/demos/dev.html +++ b/demos/dev.html @@ -103,6 +103,15 @@ function fodsContent() {

Exemple de texte long avec plusieurs paragraphes

Et qui ne déborde pas

quelque soit la longueur (la hauteur est réglée au niveau de l'élement <tr> parent

+ + Ligne invisible + + + Ligne invisible en HTML, visible en ODS + + + Ligne visible en HTML, invisible en ODS + 
 
diff --git a/src/js/opendocument/OpenDocument.OdsConverter.js b/src/js/opendocument/OpenDocument.OdsConverter.js
index 31b6400..d6f258c 100644
--- a/src/js/opendocument/OpenDocument.OdsConverter.js
+++ b/src/js/opendocument/OpenDocument.OdsConverter.js
@@ -85,6 +85,11 @@ OpenDocument.OdsConverter.prototype.convert = function (table) {
                 .addTableColumn(tableColumn);
     }
     for(let row of table.rows) {
+        let display = window.getComputedStyle(row).display;
+        let odHidden = OpenDocument.checkHiddenValue(row);
+        if (((display === "none") && (odHidden !== -1)) || (odHidden === 1)) {
+            continue;
+        }
         xw
                 .openTableRow(_getRowStyleName(row, styleManager));
         for(let cell of row.cells) {
@@ -150,18 +155,18 @@ OpenDocument.OdsConverter.prototype.convert = function (table) {
         for(let node of cellElement.childNodes) {
             if (node.nodeType === Node.ELEMENT_NODE) {
                 let display = window.getComputedStyle(node).display;
-                let odHidden = node.dataset["odHidden"];
+                let odHidden = OpenDocument.checkHiddenValue(node);
                 switch(display) {
                     case "none":
                         break;
                     case "block":
-                        if (!odHidden) {
+                        if (odHidden !== 1) {
                             __addText(node.innerText, true);
                         }
                         previousBlock = true;
                         break;
                     default:
-                        if (!odHidden) {
+                        if (odHidden !== 1) {
                             __addText(node.innerText, false);
                        }
                 }
diff --git a/src/js/opendocument/OpenDocument.js b/src/js/opendocument/OpenDocument.js
index 776a492..f4e8109 100644
--- a/src/js/opendocument/OpenDocument.js
+++ b/src/js/opendocument/OpenDocument.js
@@ -36,6 +36,26 @@ OpenDocument.checkSheetName = function (name) {
     return result;
 };
 
+OpenDocument.checkHiddenValue = function (element) {
+    let odHidden = element.dataset["odHidden"];
+    if (!odHidden) {
+        return 0;
+    }
+    switch(odHidden.toLowerCase()) {
+        case 'true':
+        case '1':
+        case 'yes':
+            return 1;
+        case 'false':
+        case '0':
+        case '-1':
+        case 'no':
+            return -1;
+        default:
+            return 0;
+    }
+};
+
 OpenDocument.toChar = function (columnNumber) {
     return (columnNumber + 64);
 };