Commit e91c663c authored by Guillaume's avatar Guillaume
Browse files

Handle alternating columns with/without rowspan

parent dbfd60b6
...@@ -6,7 +6,7 @@ ...@@ -6,7 +6,7 @@
<script src="../../../dist/paged.polyfill.js"></script> <script src="../../../dist/paged.polyfill.js"></script>
<style> <style>
@page { @page {
size: 500px 300px; size: 600px 300px;
border: 1px solid #cfc2c2; border: 1px solid #cfc2c2;
} }
...@@ -21,24 +21,30 @@ ...@@ -21,24 +21,30 @@
tr, td { tr, td {
break-inside: avoid; break-inside: avoid;
} }
</style> </style>
</head> </head>
<body> <body>
<table> <table>
<tbody> <tbody>
<tr> <tr>
<td rowspan="4">1</td> <td rowspan="4">1.1</td>
<td rowspan="4">This is a long description</td> <td rowspan="4">This is a long description</td>
<td>First row, third column</td> <td>First row, third column</td>
<td rowspan="4">1.4</td>
<td>First row, fifth column</td>
<td rowspan="4">1.6</td>
</tr> </tr>
<tr> <tr>
<td>Second row, third column</td> <td>Second row, third column</td>
<td>Second row, fifth column</td>
</tr> </tr>
<tr> <tr>
<td>Third row, third column</td> <td>Third row, third column</td>
<td>Third row, fifth column</td>
</tr> </tr>
<tr> <tr>
<td>Fourth row, third column</td> <td>Fourth row, third column</td>
<td>Fourth row, fifth column</td>
</tr> </tr>
</tbody> </tbody>
</table> </table>
......
...@@ -147,14 +147,22 @@ export function rebuildAncestors(node) { ...@@ -147,14 +147,22 @@ export function rebuildAncestors(node) {
while (previousRow) { while (previousRow) {
// previous row has more columns, might indicate a rowspan. // previous row has more columns, might indicate a rowspan.
if (previousRow.childElementCount > node.childElementCount) { if (previousRow.childElementCount > node.childElementCount) {
for (let j = previousRow.children.length - 1; j >= 0; j--) { const initialColumns = Array.from(node.children);
while (node.firstChild) {
node.firstChild.remove();
}
let k = 0;
for (let j = 0; j < previousRow.children.length; j++) {
let column = previousRow.children[j]; let column = previousRow.children[j];
if (column.rowSpan && column.rowSpan > previousRowDistance) { if (column.rowSpan && column.rowSpan > previousRowDistance) {
const duplicatedColumn = column.cloneNode(true); const duplicatedColumn = column.cloneNode(true);
// Adjust rowspan value // Adjust rowspan value
duplicatedColumn.rowSpan = column.rowSpan - previousRowDistance; duplicatedColumn.rowSpan = column.rowSpan - previousRowDistance;
// Add the column to the row // Add the column to the row
node.prepend(duplicatedColumn); node.appendChild(duplicatedColumn);
} else {
// Fill the gap with the initial columns
node.appendChild(initialColumns[k++]);
} }
} }
} }
......
Markdown is supported
0% or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment