Skip to content

Commit 84eb844

Browse files
committed
Deploying to gh-pages from @ c9714e9 🚀
0 parents  commit 84eb844

File tree

5 files changed

+209
-0
lines changed

5 files changed

+209
-0
lines changed

‎.nojekyll‎

Whitespace-only changes.

‎favicon.png‎

2.53 KB
Loading

‎index.html‎

Lines changed: 6 additions & 0 deletions
Large diffs are not rendered by default.

‎main.css‎

Lines changed: 101 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,101 @@
1+
:root {
2+
--body-background-color: hsl(0, 0%, 100%);
3+
--body-color: hsl(0, 0%, 25%);
4+
--table-sticky-background-color: hsl(0, 0%, 92%);
5+
--link-color: hsl(210, 90%, 50%);
6+
--completion-complete-color: hsl(125, 60%, 35%);
7+
}
8+
9+
@media (prefers-color-scheme: dark) {
10+
:root {
11+
--body-background-color: hsl(180, 5%, 15%);
12+
--body-color: hsl(0, 0%, 80%);
13+
--table-sticky-background-color: hsl(180, 5%, 15%);
14+
--link-color: hsl(200, 50%, 60%);
15+
--completion-complete-color: hsl(125, 50%, 65%);
16+
}
17+
}
18+
19+
body {
20+
background-color: var(--body-background-color);
21+
color: var(--body-color);
22+
/* Use a modern font stack inspired by Bootstrap 4. */
23+
font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
24+
}
25+
26+
h1,
27+
p {
28+
text-align: center;
29+
}
30+
31+
a {
32+
color: var(--link-color);
33+
text-decoration: none;
34+
}
35+
36+
a:hover {
37+
text-decoration: underline;
38+
}
39+
40+
table {
41+
border-collapse: collapse;
42+
margin: 2rem auto 0 auto;
43+
}
44+
45+
td {
46+
border: 1px solid hsla(0, 0%, 50%, 50%);
47+
padding: 0.25rem 0.5rem;
48+
/* Prefer horizontal scrolling to wrapping over several lines. */
49+
white-space: nowrap;
50+
}
51+
52+
tr:hover {
53+
background-color: hsla(210, 90%, 50%, 12.5%);
54+
}
55+
56+
tr:nth-child(even) {
57+
background-color: hsla(0, 0%, 50%, 10%);
58+
}
59+
60+
tr:nth-child(even):hover {
61+
background-color: hsla(210, 90%, 50%, 15%);
62+
}
63+
64+
/* Align class names to the right for better readability and highlight them. */
65+
td:first-child {
66+
font-weight: bold;
67+
text-align: right;
68+
}
69+
70+
/* Sticky header for the table. */
71+
th {
72+
background: var(--table-sticky-background-color);
73+
box-shadow: 0px 2px 2px 0px rgb(0, 0, 0, 25%);
74+
padding: 4px 2px;
75+
position: -webkit-sticky;
76+
position: sticky;
77+
z-index: 1; /* Show on top of table cells. */
78+
top: 0; /* Stick to the top of the screen. */
79+
cursor: pointer; /* Visually hint that headers can be interacted with. */
80+
}
81+
th:first-child {
82+
border-left: 1px solid var(--table-sticky-background-color); /* Fixes left border during scroll; must have a valid color, transparent doesn't work. */
83+
}
84+
85+
.completion-complete {
86+
color: var(--completion-complete-color);
87+
}
88+
89+
/* Dynamic coloring depending on the completion percentage. */
90+
/* Will be fully red at (roughly) 50% completion, and black/white (depending on the theme) at 99%. */
91+
.completion-incomplete {
92+
font-weight: bold;
93+
color: rgb(calc(320 - calc(var(--percentage) * 3.2)), 64, 64);
94+
}
95+
96+
@media (prefers-color-scheme: dark) {
97+
.completion-incomplete {
98+
--green-blue: calc(80 + calc(var(--percentage) * 2));
99+
color: rgb(255, var(--green-blue), var(--green-blue));
100+
}
101+
}

‎sorttable.js‎

Lines changed: 102 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,102 @@
1+
// Make the class reference table sortable in ascending or descending order
2+
// when a header is clicked.
3+
4+
5+
// Helper function to return the content from the idx-th cell of row tr
6+
const getCellValue = (tr, idx) => tr.children[idx].textContent;
7+
8+
// Array sorting functions for different columns used by the comparer
9+
10+
// Compares the Desc. and Brief Desc. columns
11+
// "MISSING" comes first in ascending order
12+
const descriptionComparer = function(v1, v2) {
13+
if(v1 == v2) return 0
14+
if(v1 == "OK") return 1
15+
return -1
16+
}
17+
18+
// Compares the Name and Docs URL columns using a basic string sort
19+
const stringComparer = (new Intl.Collator()).compare
20+
21+
// Compares the Overall column by completion percentage
22+
const overallComparer = function(v1, v2) {
23+
return Number(v1.replace("%", "")) - Number(v2.replace("%", ""))
24+
}
25+
26+
// Compares the other columns (constructors, methods, members, etc.)
27+
// by the percentage they're finished.
28+
// If two have the same percentage, they're compared by denominator size.
29+
const fractionComparer = (asc) => function(v1, v2) {
30+
if(v1 == v2) return 0
31+
32+
// Always send 0/0 values to the bottom
33+
// The "asc" parameter is needed for that purpose.
34+
if(v1 == "0/0") {
35+
return asc ? 1 : -1
36+
}
37+
38+
if(v2 == "0/0") {
39+
return asc ? -1 : 1
40+
}
41+
42+
var v1fraction = v1.split("/")
43+
var v2fraction = v2.split("/")
44+
45+
var v1decimal = Number(v1fraction[0]) / Number(v1fraction[1])
46+
var v2decimal = Number(v2fraction[0]) / Number(v2fraction[1])
47+
if(v1decimal == v2decimal) return v1fraction[1] - v2fraction[1]
48+
49+
return v1decimal - v2decimal
50+
}
51+
52+
// Returns a function responsible for sorting a specific table column
53+
// (column = column object, asc = ascending order?).
54+
const comparer = function(column, asc) {
55+
56+
// This is used by the array.sort() function...
57+
return function(a, b) {
58+
const colIdx = Array.from(column.parentNode.children).indexOf(column)
59+
const colName = column.textContent
60+
61+
// Select a function based on which column is being called.
62+
var columnComparer
63+
switch(colName) {
64+
case "Brief Desc.":
65+
case "Desc.":
66+
columnComparer = descriptionComparer
67+
break
68+
case "Name":
69+
case "Docs URL":
70+
columnComparer = stringComparer
71+
break
72+
case "Overall":
73+
columnComparer = overallComparer
74+
break
75+
default:
76+
columnComparer = fractionComparer(column.asc)
77+
break
78+
}
79+
80+
// Switch the order of the values depending on whether it's an ascending or descending sort.
81+
return columnComparer(getCellValue(asc ? a : b, colIdx), getCellValue(asc ? b : a, colIdx));
82+
}
83+
};
84+
85+
const SKIP_END_ROWS = 5 // The number of footer rows generated by doc_status.py
86+
87+
// Set up event listeners that will sort the table when headers are clicked.
88+
window.onload = function()
89+
{
90+
document.querySelectorAll('th')
91+
.forEach(th =>
92+
th.addEventListener('click', (() =>
93+
{
94+
const table = th.closest('table');
95+
const tbody = table.querySelector('tbody')
96+
const trows = Array.from(tbody.querySelectorAll('tr'))
97+
trows.slice(0, -SKIP_END_ROWS)
98+
.sort(comparer(th, th.asc = !th.asc)) // Give each column an individual sort direction
99+
.concat(trows.splice(-SKIP_END_ROWS)) // Don't sort the last rows, as they are not class reference entries.
100+
.forEach(tr => tbody.appendChild(tr) );
101+
})));
102+
}

0 commit comments

Comments
 (0)