| <!DOCTYPE html> |
| <html> |
| <head> |
| <meta charset="utf-8"> |
| <title>{{.Title}}</title> |
| {{template "css" .}} |
| <style type="text/css"> |
| </style> |
| </head> |
| <body> |
| {{template "header" .}} |
| <div id="top"> |
| <table id="toptable"> |
| <thead> |
| <tr> |
| <th id="flathdr1">Flat</th> |
| <th id="flathdr2">Flat%</th> |
| <th>Sum%</th> |
| <th id="cumhdr1">Cum</th> |
| <th id="cumhdr2">Cum%</th> |
| <th id="namehdr">Name</th> |
| <th>Inlined?</th> |
| </tr> |
| </thead> |
| <tbody id="rows"></tbody> |
| </table> |
| </div> |
| {{template "script" .}} |
| <script> |
| function makeTopTable(total, entries) { |
| const rows = document.getElementById('rows'); |
| if (rows == null) return; |
| |
| // Store initial index in each entry so we have stable node ids for selection. |
| for (let i = 0; i < entries.length; i++) { |
| entries[i].Id = 'node' + i; |
| } |
| |
| // Which column are we currently sorted by and in what order? |
| let currentColumn = ''; |
| let descending = false; |
| sortBy('Flat'); |
| |
| function sortBy(column) { |
| // Update sort criteria |
| if (column == currentColumn) { |
| descending = !descending; // Reverse order |
| } else { |
| currentColumn = column; |
| descending = (column != 'Name'); |
| } |
| |
| // Sort according to current criteria. |
| function cmp(a, b) { |
| const av = a[currentColumn]; |
| const bv = b[currentColumn]; |
| if (av < bv) return -1; |
| if (av > bv) return +1; |
| return 0; |
| } |
| entries.sort(cmp); |
| if (descending) entries.reverse(); |
| |
| function addCell(tr, val) { |
| const td = document.createElement('td'); |
| td.textContent = val; |
| tr.appendChild(td); |
| } |
| |
| function percent(v) { |
| return (v * 100.0 / total).toFixed(2) + '%'; |
| } |
| |
| // Generate rows |
| const fragment = document.createDocumentFragment(); |
| let sum = 0; |
| for (const row of entries) { |
| const tr = document.createElement('tr'); |
| tr.id = row.Id; |
| sum += row.Flat; |
| addCell(tr, row.FlatFormat); |
| addCell(tr, percent(row.Flat)); |
| addCell(tr, percent(sum)); |
| addCell(tr, row.CumFormat); |
| addCell(tr, percent(row.Cum)); |
| addCell(tr, row.Name); |
| addCell(tr, row.InlineLabel); |
| fragment.appendChild(tr); |
| } |
| |
| rows.textContent = ''; // Remove old rows |
| rows.appendChild(fragment); |
| } |
| |
| // Make different column headers trigger sorting. |
| function bindSort(id, column) { |
| const hdr = document.getElementById(id); |
| if (hdr == null) return; |
| const fn = function() { sortBy(column) }; |
| hdr.addEventListener('click', fn); |
| hdr.addEventListener('touch', fn); |
| } |
| bindSort('flathdr1', 'Flat'); |
| bindSort('flathdr2', 'Flat'); |
| bindSort('cumhdr1', 'Cum'); |
| bindSort('cumhdr2', 'Cum'); |
| bindSort('namehdr', 'Name'); |
| } |
| |
| viewer(new URL(window.location.href), {{.Nodes}}); |
| makeTopTable({{.Total}}, {{.Top}}); |
| </script> |
| </body> |
| </html> |
