Propriété overflow-wrap et style par défaut pour les lignes

Jakefile.js

@@ -15,7 +15,7 @@ var fs = require('fs')
 task('build', function (version,destination) {
 	var destinationDir = 'build';
 	switch(destination) {
-		case 'dist';
+		case 'dist':
 			destinationDir = 'dist';
 			break;
 	}

README.md

@@ -4,6 +4,8 @@ Conversion d'un tableau HTML en fichier ODS disponible en téléchargement.
 
 Le principe de cette bibliothèque est de pouvoir écrire un lien proposant une version ODS (en fait au format .fods) d'un tableau HTML existant. L'exportation est opérationnelle sans aucune modification du tableau mais l'aspect du fichier résultant peut être substantiellement amélioré en ajoutant des attributs spéciaux (`data-od-*`) aux éléments du tableau et en proposant des styles suivant la syntaxe CSS.
 
+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.
@@ -35,7 +37,7 @@ Il est à noter que les attributs `colspan` et `rowspan` sont reconnus et appliq
 
 ### Élément `<tr>`
 
-- `data-od-style` : style de la ligne
+- `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)
 
 ### Éléments `<td>` ou `<th>`
 
@@ -86,21 +88,24 @@ Le nombre de propriétés acceptées est limitée et dépend du type d'élément
 - `font-size` : taille de la police
 - `font-style` : style de la police (*italic*)
 - `font-weight` : graisse de la police (*bold*)
+- `overflow-wrap` : passage à la ligne si la valeurs est *break-words* ou *anywhere*
 - `padding` : remplissage (les déclinaisons en `padding-top`, `padding-left`, etc. sont possibles)
 - `text-align` : alignement horizontal du texte
 - `vertical-align` : alignement vertical du texte
 
 ### Styles prédéfinis
 
-L'exportation propose des styles prédéfinis qui peuvent être directement utilisés dans les attributs `data-od-style` sans besoin de les déclarer dans le CSS :
+L'exportation propose des styles prédéfinis qui peuvent être directement utilisés dans les attributs `data-od-style` d'une cellule sans besoin de les déclarer dans le CSS :
 
 - `Bold` : Texte en gras
 - `BoldItalic` : Texte en gras et italique
-- `Header` : Entête de colonne, appliqué par défaut aux éléments `<th>`
+- `Header` : Entête de colonne, appliqué par défaut aux éléments `<th>` et `<th>`
 - `Italic` : Texte en italique
 - `Standard` : Style appliqué par défaut aux éléments `<td>`, sans indication particulière
 
-Ces styles peuvent être surchargés par le CSS.
+Les lignes ont également comme style par défaut `Header` (si la ligne fait partie d'un  `<thead>`) ou `Standard`.
+
+Ces styles peuvent être surchargés par le CSS. Même si le nom est le même, `cell.Standard` et `row.Standard` sont deux styles différents.
 
 ### Parenté entre les styles
 

demos/dev.css

@@ -68,3 +68,12 @@ row.Entete {
     height: 2cm;
     background-color: #ff00ff;
 }
+
+cell.LongTexte {
+    vertical-align: top;
+    overflow-wrap: break-word; 
+}
+
+row.HauteurFixe {
+    height: 0.45cm;
+}

demos/dev.html

@@ -93,6 +93,10 @@ function fodsContent() {
                     <td class="class1">Classe 1</td>
                     <td class="class2">Classe 2</td>
                 </tr>
+                <tr data-od-style="HauteurFixe">
+                    <td></td>
+                    <td data-od-style="LongTexte"><p>Exemple de texte long avec plusieurs paragraphes</p><p>Et qui ne déborde pas</p><p>quelque soit la longueur (la hauteur est réglée au niveau de l'élement &lt;tr&gt; parent</p></td>
+                </tr>
 	</tbody> 
  </table> 
 	<pre id="text"></pre> 

src/js/opendocument/OpenDocument.OdsConverter.js

@@ -326,7 +326,11 @@ OpenDocument.OdsConverter.default_getRowStyleName = function (row, styleManager)
     if (styleName) {
         return styleName;
     }
-    return "";
+    if ((row.parentNode.tagName) && (row.parentNode.tagName.toLowerCase() === "thead")) {
+        return "Header";
+    } else {
+        return "Standard";
+    }
 };
 
 OpenDocument.OdsConverter.default_getCellStyleName = function (cell, styleManager) {

src/js/opendocument/OpenDocument.Style.js

@@ -28,12 +28,25 @@ OpenDocument.Style.prototype.putStyleProperty = function (stylePropertyDef, valu
         case "color":
             value = OpenDocument.Style.formatColor(value);
             break;
+        case "wrap":
+            value = _convertWrap();
+            break;
     }
     var property = {
         name: propertyName,
         value: value
     };
     this.propertiesMaps.get(stylePropertyDef.category).set(propertyName, property);
+    
+    function _convertWrap() {
+        switch(value) {
+            case "anywhere":
+            case "break-word":
+                return "wrap";
+            default:
+                return "no-wrap";
+        }
+    }
 };
 
 OpenDocument.Style.prototype.setParent = function (parentStyleName) {
@@ -132,6 +145,12 @@ OpenDocument.Style.getStylePropertyDef = function (type, name) {
                         return "column-width";
                 }
                 break;
+            case "cell":
+                switch(name) {
+                    case "overflow-wrap":
+                        return "wrap-option";
+                }
+                break;
         }
         return name;
     }
@@ -234,6 +253,11 @@ OpenDocument.Style.STYLEPROPERTYDEFS = {
     "vertical-align": {
         name: "style:vertical-align",
         category: "table-cell"
+    },
+    "wrap-option": {
+        name: "fo:wrap-option",
+        category: "table-cell",
+        format: "wrap"
     }
 };
 

src/js/opendocument/OpenDocument.StyleManager.js

@@ -396,5 +396,19 @@ OpenDocument.StyleManager.DEFAULT_STYLES = [
             "text-align": "center",
             "vertical-align": "middle"
         }
+    },
+    {
+        type: "row",
+        name: "Standard",
+        parent: "",
+        properties: {
+        }
+    },
+    {
+        type: "row",
+        name: "Header",
+        parent: "",
+        properties: {
+        }
     }
 ];