Add printable reports
This commit is contained in:
parent
c78a30d5b2
commit
165e98fb87
@ -31,6 +31,8 @@ After preparing the BLT file, head to <https://yingtongli.me/rcv/>. Select the B
|
|||||||
|
|
||||||
By clicking *Show advanced options*, you can customise the options used for the count. A detailed explanation of the various options can be found [here](https://yingtongli.me/git/pyRCV2/about/docs/options.md).
|
By clicking *Show advanced options*, you can customise the options used for the count. A detailed explanation of the various options can be found [here](https://yingtongli.me/git/pyRCV2/about/docs/options.md).
|
||||||
|
|
||||||
|
Once the count is complete, you can click *Print result* to generate a printable result report.
|
||||||
|
|
||||||
## Command line usage
|
## Command line usage
|
||||||
|
|
||||||
pyRCV2 may also be invoked as a command line application. Run `python -m pyRCV2 --help` to view help.
|
pyRCV2 may also be invoked as a command line application. Run `python -m pyRCV2 --help` to view help.
|
||||||
|
@ -23,7 +23,7 @@
|
|||||||
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" integrity="sha512-NhSC1YmyruXifcj/KFRWoC561YpHpc5Jtzgvbuzx5VozKpWvQ+4nXhPdFgmx8xqexRcpAglTj9sIBWINXa8x5w==" crossorigin="anonymous" />
|
<link rel="stylesheet" type="text/css" href="https://cdnjs.cloudflare.com/ajax/libs/normalize/8.0.1/normalize.min.css" integrity="sha512-NhSC1YmyruXifcj/KFRWoC561YpHpc5Jtzgvbuzx5VozKpWvQ+4nXhPdFgmx8xqexRcpAglTj9sIBWINXa8x5w==" crossorigin="anonymous" />
|
||||||
<link rel="stylesheet" type="text/css" href="main.css?v=GITVERSION">
|
<link rel="stylesheet" type="text/css" href="main.css?v=GITVERSION">
|
||||||
</head>
|
</head>
|
||||||
<body>
|
<body class="interactive">
|
||||||
<div class="menudiv">
|
<div class="menudiv">
|
||||||
<input type="file" id="bltFile">
|
<input type="file" id="bltFile">
|
||||||
<button onclick="clickCount()">Count</button>
|
<button onclick="clickCount()">Count</button>
|
||||||
@ -214,9 +214,25 @@
|
|||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|
||||||
|
<div id="resultLogs1"></div>
|
||||||
|
|
||||||
<table id="result"></table>
|
<table id="result"></table>
|
||||||
|
|
||||||
<div id="resultLogs"></div>
|
<div id="resultLogs2"></div>
|
||||||
|
|
||||||
|
<div id="printPane" style="display: none;">
|
||||||
|
<button onclick="printResult()">Print result</button>
|
||||||
|
<label>
|
||||||
|
Paper size:
|
||||||
|
<select id="selPaperSize">
|
||||||
|
<option value="A4" selected>A4</option>
|
||||||
|
<option value="A3">A3</option>
|
||||||
|
<option value="letter">US Letter</option>
|
||||||
|
</select>
|
||||||
|
</label>
|
||||||
|
</div>
|
||||||
|
|
||||||
|
<div id="printWarning" style="display: none;">Printing directly from this page is not supported. Use the ‘Print result’ button to generate a printer-friendly report.</div>
|
||||||
|
|
||||||
<script>
|
<script>
|
||||||
var pyRCV2version = 'GITVERSION';
|
var pyRCV2version = 'GITVERSION';
|
||||||
|
149
html/index.js
149
html/index.js
@ -183,8 +183,10 @@ async function clickCount() {
|
|||||||
let tblResults = document.getElementById('result');
|
let tblResults = document.getElementById('result');
|
||||||
tblResults.innerHTML = '';
|
tblResults.innerHTML = '';
|
||||||
let candMap = {}; // candidate name -> rows
|
let candMap = {}; // candidate name -> rows
|
||||||
let divResultLogs = document.getElementById('resultLogs');
|
let divResultLogs1 = document.getElementById('resultLogs1');
|
||||||
divResultLogs.innerHTML = '';
|
let divResultLogs2 = document.getElementById('resultLogs2');
|
||||||
|
divResultLogs1.innerHTML = '';
|
||||||
|
divResultLogs2.innerHTML = '';
|
||||||
|
|
||||||
// Step election
|
// Step election
|
||||||
let worker = new Worker('worker.js');
|
let worker = new Worker('worker.js');
|
||||||
@ -306,13 +308,13 @@ async function clickCount() {
|
|||||||
} else {
|
} else {
|
||||||
elP.innerHTML += ' Counting using options <span style="font-family:monospace;">' + evt.data.options + '</span>.';
|
elP.innerHTML += ' Counting using options <span style="font-family:monospace;">' + evt.data.options + '</span>.';
|
||||||
}
|
}
|
||||||
divResultLogs.appendChild(elP);
|
divResultLogs1.appendChild(elP);
|
||||||
|
|
||||||
elP = document.createElement('p');
|
elP = document.createElement('p');
|
||||||
elP.innerText = 'Stage comments:';
|
elP.innerText = 'Stage comments:';
|
||||||
divResultLogs.appendChild(elP);
|
divResultLogs2.appendChild(elP);
|
||||||
olLogs = document.createElement('ol');
|
olLogs = document.createElement('ol');
|
||||||
divResultLogs.appendChild(olLogs);
|
divResultLogs2.appendChild(olLogs);
|
||||||
}
|
}
|
||||||
|
|
||||||
if (evt.data.type === 'result') {
|
if (evt.data.type === 'result') {
|
||||||
@ -448,7 +450,7 @@ async function clickCount() {
|
|||||||
|
|
||||||
let elP = document.createElement('p');
|
let elP = document.createElement('p');
|
||||||
elP.innerText = 'Count complete. The winning candidates are, in order of election:'
|
elP.innerText = 'Count complete. The winning candidates are, in order of election:'
|
||||||
divResultLogs.appendChild(elP);
|
divResultLogs2.appendChild(elP);
|
||||||
|
|
||||||
winners.sort(function(x1, x2) { return x1[1].order_elected - x2[1].order_elected; });
|
winners.sort(function(x1, x2) { return x1[1].order_elected - x2[1].order_elected; });
|
||||||
let elOl = document.createElement('ol');
|
let elOl = document.createElement('ol');
|
||||||
@ -457,7 +459,9 @@ async function clickCount() {
|
|||||||
elLi.innerText = candidate;
|
elLi.innerText = candidate;
|
||||||
elOl.appendChild(elLi);
|
elOl.appendChild(elLi);
|
||||||
}
|
}
|
||||||
divResultLogs.appendChild(elOl);
|
divResultLogs2.appendChild(elOl);
|
||||||
|
|
||||||
|
document.getElementById('printPane').style.display = 'block';
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
@ -526,3 +530,134 @@ if (document.getElementById('txtSeed').value === '') {
|
|||||||
let d = new Date();
|
let d = new Date();
|
||||||
document.getElementById('txtSeed').value = d.getFullYear() + pad(d.getMonth() + 1) + pad(d.getDate());
|
document.getElementById('txtSeed').value = d.getFullYear() + pad(d.getMonth() + 1) + pad(d.getDate());
|
||||||
}
|
}
|
||||||
|
|
||||||
|
// Split across pages when required for printing
|
||||||
|
|
||||||
|
function printResult() {
|
||||||
|
let printableWidth; // Printable width in CSS pixels
|
||||||
|
let paperSize = document.getElementById('selPaperSize').value;
|
||||||
|
if (paperSize === 'A4') {
|
||||||
|
printableWidth = (29.7 - 2) * 96 / 2.54;
|
||||||
|
} else if (paperSize === 'A3') {
|
||||||
|
printableWidth = (42.0 - 2) * 96 / 2.54;
|
||||||
|
} else if (paperSize === 'letter') {
|
||||||
|
printableWidth = (27.9 - 2) * 96 / 2.54;
|
||||||
|
}
|
||||||
|
printableWidth = Math.round(printableWidth);
|
||||||
|
|
||||||
|
let wprint = window.open('');
|
||||||
|
wprint.document.title = 'pyRCV2 Report';
|
||||||
|
|
||||||
|
// Add stylesheets
|
||||||
|
for (let elCSSBase of document.querySelectorAll('head link')) {
|
||||||
|
let elCSS = wprint.document.createElement('link');
|
||||||
|
elCSS.rel = elCSSBase.rel;
|
||||||
|
elCSS.type = elCSSBase.type;
|
||||||
|
elCSS.href = elCSSBase.href;
|
||||||
|
wprint.document.head.appendChild(elCSS);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Configure printing
|
||||||
|
let elStyle = wprint.document.createElement('style');
|
||||||
|
elStyle.innerHTML = '@page { size: ' + paperSize + ' landscape; margin: 1cm; } @media print { body { padding: 0; } }';
|
||||||
|
wprint.document.head.appendChild(elStyle);
|
||||||
|
|
||||||
|
let elContainer = wprint.document.createElement('div');
|
||||||
|
elContainer.id = 'printContainer';
|
||||||
|
elContainer.style.width = printableWidth + 'px';
|
||||||
|
wprint.document.body.appendChild(elContainer);
|
||||||
|
|
||||||
|
// Copy result logs 1
|
||||||
|
let divResultLogs1 = document.getElementById('resultLogs1');
|
||||||
|
let divResultLogs2 = wprint.document.createElement('div');
|
||||||
|
divResultLogs2.innerHTML = divResultLogs1.innerHTML;
|
||||||
|
elContainer.appendChild(divResultLogs2);
|
||||||
|
|
||||||
|
// Parse table, accounting for rowspan
|
||||||
|
let elTrs1 = document.querySelector('#result').rows;
|
||||||
|
let rows = [];
|
||||||
|
for (let elTr1 of elTrs1) {
|
||||||
|
rows.push([]);
|
||||||
|
}
|
||||||
|
for (let r = 0; r < elTrs1.length; r++) {
|
||||||
|
for (let c = 0; c < elTrs1[r].cells.length; c++) {
|
||||||
|
let elTd1 = elTrs1[r].cells[c];
|
||||||
|
rows[r].push(elTd1);
|
||||||
|
|
||||||
|
let rowspan = elTd1.getAttribute('rowspan');
|
||||||
|
// NB: Only works for rowspan in first column
|
||||||
|
if (rowspan !== null && c == 0) {
|
||||||
|
rowspan = parseInt(rowspan);
|
||||||
|
// Add ghost cells
|
||||||
|
for (let i = 1; i < rowspan; i++) {
|
||||||
|
rows[r + i].push(null);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyColumn(c, elTrs2) {
|
||||||
|
let tdsAdded = [];
|
||||||
|
for (let r = 0; r < rows.length; r++) {
|
||||||
|
if (c < rows[r].length) {
|
||||||
|
let elTd1 = rows[r][c];
|
||||||
|
if (elTd1 !== null) {
|
||||||
|
let elTd2 = wprint.document.createElement('td');
|
||||||
|
elTd2.innerHTML = elTd1.innerHTML;
|
||||||
|
elTd2.className = elTd1.className;
|
||||||
|
elTd2.setAttribute('rowspan', elTd1.getAttribute('rowspan'));
|
||||||
|
elTd2.setAttribute('style', elTd1.getAttribute('style'));
|
||||||
|
elTrs2[r].appendChild(elTd2);
|
||||||
|
tdsAdded.push(elTd2);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
return tdsAdded;
|
||||||
|
}
|
||||||
|
|
||||||
|
function copyTableColumns(startCol) {
|
||||||
|
// Add table
|
||||||
|
let elTable2 = wprint.document.createElement('table');
|
||||||
|
elTable2.className = 'result';
|
||||||
|
if (startCol > 1) {
|
||||||
|
elTable2.style.pageBreakBefore = 'always';
|
||||||
|
}
|
||||||
|
elContainer.appendChild(elTable2);
|
||||||
|
|
||||||
|
// Add rows
|
||||||
|
let elTrs2 = [];
|
||||||
|
for (let elTr1 of elTrs1) {
|
||||||
|
let elTr2 = wprint.document.createElement('tr');
|
||||||
|
elTr2.className = elTr1.className;
|
||||||
|
elTrs2.push(elTr2);
|
||||||
|
elTable2.appendChild(elTr2);
|
||||||
|
}
|
||||||
|
|
||||||
|
// Copy first column
|
||||||
|
copyColumn(0, elTrs2);
|
||||||
|
|
||||||
|
// Copy column by column
|
||||||
|
for (let c = startCol; c < rows[0].length + 1; c++) { // +1 to account for final status column
|
||||||
|
let tdsAdded = copyColumn(c, elTrs2);
|
||||||
|
|
||||||
|
// Check if overflowed
|
||||||
|
if (elTable2.clientWidth > printableWidth) {
|
||||||
|
for (let elTd2 of tdsAdded) {
|
||||||
|
elTd2.remove();
|
||||||
|
}
|
||||||
|
// Start new table
|
||||||
|
return copyTableColumns(c);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
|
copyTableColumns(1);
|
||||||
|
|
||||||
|
// Copy result logs2
|
||||||
|
divResultLogs1 = document.getElementById('resultLogs2');
|
||||||
|
divResultLogs2 = wprint.document.createElement('div');
|
||||||
|
divResultLogs2.innerHTML = divResultLogs1.innerHTML;
|
||||||
|
elContainer.appendChild(divResultLogs2);
|
||||||
|
|
||||||
|
wprint.print();
|
||||||
|
}
|
||||||
|
@ -33,12 +33,6 @@ body {
|
|||||||
padding-bottom: 0.5em;
|
padding-bottom: 0.5em;
|
||||||
}
|
}
|
||||||
|
|
||||||
@media print {
|
|
||||||
.menudiv {
|
|
||||||
display: none;
|
|
||||||
}
|
|
||||||
}
|
|
||||||
|
|
||||||
.menudiv .subheading {
|
.menudiv .subheading {
|
||||||
font-size: 0.8em;
|
font-size: 0.8em;
|
||||||
font-weight: bold;
|
font-weight: bold;
|
||||||
@ -88,6 +82,15 @@ tr.info td {
|
|||||||
background-color: #edededff;
|
background-color: #edededff;
|
||||||
}
|
}
|
||||||
|
|
||||||
|
@media print {
|
||||||
|
body.interactive > * {
|
||||||
|
display: none;
|
||||||
|
}
|
||||||
|
#printWarning {
|
||||||
|
display: block !important;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
|
||||||
/* Form styling */
|
/* Form styling */
|
||||||
/* Adapted in part from https://github.com/nathansmith/formalize (GPL/MIT) */
|
/* Adapted in part from https://github.com/nathansmith/formalize (GPL/MIT) */
|
||||||
|
|
||||||
|
Reference in New Issue
Block a user