Fix copy-code buttons on /tutorial

This commit is contained in:
Richard Feldman 2023-11-20 06:45:14 -05:00
parent d87d5e39c8
commit f128ea3644
No known key found for this signature in database
GPG key ID: F1F21AA5B1D9E43B
2 changed files with 132 additions and 108 deletions

View file

@ -2,27 +2,39 @@
let sidebar = document.getElementById("sidebar-nav"); let sidebar = document.getElementById("sidebar-nav");
let searchBox = document.getElementById("module-search"); let searchBox = document.getElementById("module-search");
if (searchBox != null) {
function search() { function search() {
let text = searchBox.value.toLowerCase(); // Search is case-insensitive. let text = searchBox.value.toLowerCase(); // Search is case-insensitive.
if (text === "") { if (text === "") {
// Un-hide everything // Un-hide everything
sidebar.querySelectorAll(".sidebar-entry a").forEach((entry) => entry.classList.remove("hidden")); sidebar
.querySelectorAll(".sidebar-entry a")
.forEach((entry) => entry.classList.remove("hidden"));
// Re-hide all the sub-entries except for those of the current module // Re-hide all the sub-entries except for those of the current module
let currentModuleName = document.querySelector('.module-name').textContent; let currentModuleName =
document.querySelector(".module-name").textContent;
sidebar.querySelectorAll(".sidebar-entry").forEach((entry) => { sidebar.querySelectorAll(".sidebar-entry").forEach((entry) => {
let entryName = entry.querySelector('.sidebar-module-link').textContent; let entryName = entry.querySelector(
".sidebar-module-link"
).textContent;
if (currentModuleName === entryName) { if (currentModuleName === entryName) {
entry.firstChild.classList.add("active"); entry.firstChild.classList.add("active");
return; return;
}; }
entry.querySelectorAll(".sidebar-sub-entries a").forEach((subEntry) => subEntry.classList.add("hidden")); entry
}) .querySelectorAll(".sidebar-sub-entries a")
.forEach((subEntry) =>
subEntry.classList.add("hidden")
);
});
} else { } else {
// First, show/hide all the sub-entries within each module (top-level functions etc.) // First, show/hide all the sub-entries within each module (top-level functions etc.)
sidebar.querySelectorAll(".sidebar-sub-entries a").forEach((entry) => { sidebar
.querySelectorAll(".sidebar-sub-entries a")
.forEach((entry) => {
if (entry.textContent.toLowerCase().includes(text)) { if (entry.textContent.toLowerCase().includes(text)) {
entry.classList.remove("hidden"); entry.classList.remove("hidden");
} else { } else {
@ -31,8 +43,15 @@
}); });
// Then, show/hide modules based on whether they match, or any of their sub-entries matched // Then, show/hide modules based on whether they match, or any of their sub-entries matched
sidebar.querySelectorAll(".sidebar-module-link").forEach((entry) => { sidebar
if (entry.textContent.toLowerCase().includes(text) || entry.parentNode.querySelectorAll(".sidebar-sub-entries a:not(.hidden)").length > 0) { .querySelectorAll(".sidebar-module-link")
.forEach((entry) => {
if (
entry.textContent.toLowerCase().includes(text) ||
entry.parentNode.querySelectorAll(
".sidebar-sub-entries a:not(.hidden)"
).length > 0
) {
entry.classList.remove("hidden"); entry.classList.remove("hidden");
} else { } else {
entry.classList.add("hidden"); entry.classList.add("hidden");
@ -61,14 +80,18 @@
// Reset sidebar state // Reset sidebar state
search(); search();
} }
}); });
}
const isTouchSupported = () => { const isTouchSupported = () => {
try{ document.createEvent("TouchEvent"); return true; } try {
catch(e){ return false; } document.createEvent("TouchEvent");
return true;
} catch (e) {
return false;
} }
};
// Select all <samp> elements that are children of <pre> elements // Select all <samp> elements that are children of <pre> elements
const codeBlocks = document.querySelectorAll("pre > samp"); const codeBlocks = document.querySelectorAll("pre > samp");
@ -88,7 +111,7 @@
copyButton.classList.add("copy-button-copied"); copyButton.classList.add("copy-button-copied");
copyButton.addEventListener("mouseleave", () => { copyButton.addEventListener("mouseleave", () => {
copyButton.textContent = "Copy"; copyButton.textContent = "Copy";
copyButton.classList.remove('copy-button-copied'); copyButton.classList.remove("copy-button-copied");
}); });
}); });

View file

@ -2026,3 +2026,4 @@ Here are various Roc expressions involving operators, and what they desugar to.
</section> </section>
<script type="text/javascript" src="/builtins/search.js" defer></script>