Implement print view for ballots+votes report

html/index.js

@@ -256,7 +256,7 @@ async function printResult() {
 	divResultLogs2.innerHTML = divResultLogs1.innerHTML;
 	elContainer.appendChild(divResultLogs2);
 	
-	// Parse table, accounting for rowspan
+	// Parse table, accounting for colspan/rowspan
 	let elTrs1 = document.querySelector('#result').rows;
 	let rows = [];
 	for (let elTr1 of elTrs1) {
@@ -267,6 +267,15 @@ async function printResult() {
 			let elTd1 = elTrs1[r].cells[c];
 			rows[r].push(elTd1);
 			
+			let colspan = elTd1.getAttribute('colspan');
+			if (colspan !== null) {
+				colspan = parseInt(colspan);
+				// Add ghost cells
+				for (let i = 1; i < colspan; i++) {
+					rows[r].push(null);
+				}
+			}
+			
 			let rowspan = elTd1.getAttribute('rowspan');
 			// NB: Only works for rowspan in first column
 			if (rowspan !== null && c == 0) {
@@ -289,6 +298,7 @@ async function printResult() {
 					elTd2.innerHTML = elTd1.innerHTML;
 					elTd2.className = elTd1.className;
 					if (elTd1.getAttribute('rowspan') !== null) { elTd2.setAttribute('rowspan', elTd1.getAttribute('rowspan')); }
+					if (elTd1.getAttribute('colspan') !== null) { elTd2.setAttribute('colspan', elTd1.getAttribute('colspan')); }
 					if (elTd1.getAttribute('style') !== null) { elTd2.setAttribute('style', elTd1.getAttribute('style')); }
 					elTrs2[r].appendChild(elTd2);
 					tdsAdded.push(elTd2);
@@ -299,6 +309,8 @@ async function printResult() {
 	}
 	
 	async function copyTableColumns(startCol) {
+		let modelRow = document.getElementById('selReport').value === 'ballots_votes' ? rows[4] : rows[3];
+		
 		// Add table
 		let elTable2 = wprint.document.createElement('table');
 		elTable2.className = 'result';
@@ -320,30 +332,52 @@ async function printResult() {
 		copyColumn(0, elTrs2);
 		
 		// How many columns to copy?
-		let totalWidth = rows[0][0].clientWidth;
+		let totalWidth = modelRow[0].clientWidth;
 		let endCol;
-		for (endCol = startCol; endCol < rows[0].length; endCol++) {
+		for (endCol = startCol; endCol < modelRow.length; ) {
-			if (totalWidth + rows[0][endCol].clientWidth > printableWidth) {
+			// Check first column
+			if (totalWidth + modelRow[endCol].clientWidth > printableWidth) {
 				break;
 			}
-			totalWidth += rows[0][endCol].clientWidth;
+			
+			if (document.getElementById('selReport').value === 'ballots_votes' && endCol + 1 < modelRow.length) {
+				// Check second column
+				if (totalWidth + modelRow[endCol].clientWidth + modelRow[endCol + 1].clientWidth > printableWidth) {
+					break;
+				}
+			}
+			
+			// Ok!
+			totalWidth += modelRow[endCol].clientWidth;
+			endCol++;
+			
+			if (document.getElementById('selReport').value === 'ballots_votes' && endCol < modelRow.length) {
+				// Second column
+				totalWidth += modelRow[endCol].clientWidth;
+				endCol++;
+			}
 		}
 		
 		// Copy columns
+		let stages = [];
 		for (let c = startCol; c < endCol; c++) {
+			if (rows[0][c] !== null && rows[0][c].querySelector('a')) {
+				// Track stage headings copied
+				stages.push(parseInt(rows[0][c].querySelector('a').innerHTML));
+			}
 			copyColumn(c, elTrs2);
 		}
 		
 		// Copy stage comments
 		elContainer.insertAdjacentHTML('beforeend', '<p>Stage comments:</p>');
 		let olStageComments2 = wprint.document.createElement('ol');
-		olStageComments2.start = startCol;
+		olStageComments2.start = stages[0];
 		elContainer.append(olStageComments2);
-		for (let c = startCol; c < endCol && c < rows[0].length - 1; c++) {
+		for (let stage of stages) {
-			olStageComments2.insertAdjacentHTML('beforeend', olStageComments.children[c-1].outerHTML);
+			olStageComments2.insertAdjacentHTML('beforeend', olStageComments.children[stage-1].outerHTML);
 		}
 		
-		if (endCol < rows[0].length) {
+		if (endCol < modelRow.length) {
 			// Start new table if columns remain
 			copyTableColumns(endCol);
 		} else {