Skip to content

Instantly share code, notes, and snippets.

@oprypin
Last active December 1, 2023 16:12
Show Gist options
  • Save oprypin/6930f1a7010a42dd0e6dab39098ff5aa to your computer and use it in GitHub Desktop.
Save oprypin/6930f1a7010a42dd0e6dab39098ff5aa to your computer and use it in GitHub Desktop.
Add a selector with checkboxes to https://docs.astral.sh/ruff/rules/
// Create checkbox to hide preview rules
var checkbox = document.createElement("input");
checkbox.type = "checkbox";
checkbox.checked = true;
checkbox.addEventListener("change", function () {
for (var span of document.querySelectorAll(
'span[title="Rule is in preview"]',
)) {
span.closest("tr").style.display = event.currentTarget.checked
? null
: "none";
}
updateTextareaContent();
});
var label = document.createElement("label");
label.textContent = " Show preview rules";
label.prepend(checkbox);
document.querySelector("h2").before(label);
// Update state: textarea -> checkboxes
function onTextareaChange(event) {
var codes = new Set(textarea.value.match(/\w+/g));
for (var table of document.querySelectorAll("article table")) {
var category = getCurrentCategory(table);
if (codes.has(category)) {
for (var input of table.querySelectorAll("input")) {
input.checked = true;
}
} else {
table.querySelector("th input").checked = false;
for (var input of table.querySelectorAll("td input")) {
input.checked = codes.has(getCurrentCode(input));
}
}
}
setTimeout(updateTextareaContent, 1);
}
// From the current checkbox, find its code
function getCurrentCode(el) {
return el.closest("label").textContent.trim();
}
// From the current table, find its category based on the heading
function getCurrentCategory(el) {
el = el.closest("article>*");
while (el && el.tagName != "H3" && el.tagName != "H2") {
el = el.previousElementSibling;
}
return el.textContent.match(/\((\w+)\)\s*#?$/)[1];
}
// Create rule-editing textarea
var textarea = document.createElement("textarea");
textarea.setAttribute(
"placeholder",
"Paste your existing `select` config for rules\n(comma-separated TOML strings)",
);
textarea.setAttribute("cols", 50);
textarea.setAttribute("rows", 5);
textarea.style.position = "absolute";
textarea.style.right = "0";
textarea.addEventListener("change", onTextareaChange);
document.querySelector("header").appendChild(textarea);
// Update state: heading checkbox -> all checkboxes -> textarea
function onCheckboxChange(event) {
var cell = event.currentTarget.parentElement.parentElement;
var table = cell.closest("table");
if (cell.tagName === "TH") {
for (var input of table.querySelectorAll("td input")) {
input.checked = event.currentTarget.checked;
}
} else {
if (!event.currentTarget.checked) {
table.querySelector("th input").checked = false;
}
}
updateTextareaContent();
}
// Create rule checkboxes
for (var tr of document.querySelectorAll("tr")) {
var td = tr.firstElementChild;
var label = document.createElement("label");
label.textContent = " " + td.textContent;
label.style.whiteSpace = "nowrap";
var input = document.createElement("input");
input.type = "checkbox";
input.addEventListener("change", onCheckboxChange);
label.prepend(input);
td.innerHTML = "";
td.appendChild(label);
}
// Calculate all enabled codes and update textarea content
function updateTextareaContent() {
var codesEnabled = [[]]; // First row is for whole categories.
for (var table of document.querySelectorAll("article table")) {
if (table.querySelector("th input").checked) {
codesEnabled[0].push(getCurrentCategory(table));
} else {
var addedCodes = [];
for (var input of table.querySelectorAll(
'tr:not([style*="display: none"]) td input',
)) {
if (input.checked) {
addedCodes.push(getCurrentCode(input));
}
}
codesEnabled.push(addedCodes);
}
}
textarea.value = codesEnabled
.filter((row) => row.length > 0)
.map((row) =>
row
.map((c) => `"${c}", `)
.join("")
.trim(),
)
.join("\n");
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment