Discource-C
/
DiscoTOC
mirror of https://github.com/discourse/DiscoTOC.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

FIX: Restore support for docs plugin (#24)

This commit is contained in:
Penar Musaraj 2022-01-19 12:50:45 -05:00 committed by GitHub
parent ff434a4f7b
commit 0bc2aa28a3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 54 additions and 41 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
common/common.scss
View File

@ -212,3 +212,10 @@ a.d-toc-close {
content: "#{$composer_toc_text}";
}
}
// Docs plugin outlet
.below-docs-topic-outlet.d-toc-wrapper {
position: sticky;
top: calc(var(--header-offset, 60px) + 1em);
max-height: calc(100vh - 2em - var(--header-offset, 60px));
}

1
javascripts/discourse/connectors/below-docs-topic/d-toc-wrapper.hbs Normal file
View File

@ -0,0 +1 @@
{{!-- Docs TOC placeholder --}}

87
javascripts/discourse/initializers/disco-toc-main.js
View File

@ -76,52 +76,16 @@ export default {
}
});
api.onAppEvent("docs-topic:current-post-scrolled", () => {
this.updateTOCSidebar();
});
api.onAppEvent("topic:current-post-scrolled", (args) => {
if (args.postIndex !== 1) {
return;
}
if (!document.querySelector(".d-toc-cooked")) {
return;
}
const headings = document.querySelectorAll(".d-toc-post-heading");
let closestHeadingDistance = null;
let closestHeading = null;
headings.forEach((heading) => {
const distance = Math.abs(
domUtils.offset(heading).top - headerOffset() - window.scrollY
);
if (
closestHeadingDistance == null ||
distance < closestHeadingDistance
) {
closestHeadingDistance = distance;
closestHeading = heading;
} else {
return false;
}
});
if (closestHeading) {
document.querySelectorAll("#d-toc li").forEach((listItem) => {
listItem.classList.remove("active");
listItem.classList.remove("direct-active");
});
const anchor = document.querySelector(
`#d-toc a[data-d-toc="${closestHeading.getAttribute("id")}"]`
);
if (!anchor) {
return;
}
anchor.parentElement.classList.add("direct-active");
parentsUntil(anchor, "#d-toc", ".d-toc-item").forEach((liParent) => {
liParent.classList.add("active");
});
}
this.updateTOCSidebar();
});
api.cleanupStream(() => {
@ -131,6 +95,47 @@ export default {
});
},
updateTOCSidebar() {
if (!document.querySelector(".d-toc-cooked")) {
return;
}
const headings = document.querySelectorAll(".d-toc-post-heading");
let closestHeadingDistance = null;
let closestHeading = null;
headings.forEach((heading) => {
const distance = Math.abs(
domUtils.offset(heading).top - headerOffset() - window.scrollY
);
if (closestHeadingDistance == null || distance < closestHeadingDistance) {
closestHeadingDistance = distance;
closestHeading = heading;
} else {
return false;
}
});
if (closestHeading) {
document.querySelectorAll("#d-toc li").forEach((listItem) => {
listItem.classList.remove("active");
listItem.classList.remove("direct-active");
});
const anchor = document.querySelector(
`#d-toc a[data-d-toc="${closestHeading.getAttribute("id")}"]`
);
if (!anchor) {
return;
}
anchor.parentElement.classList.add("direct-active");
parentsUntil(anchor, "#d-toc", ".d-toc-item").forEach((liParent) => {
liParent.classList.add("active");
});
}
},
insertTOC(headings) {
const dToc = document.createElement("div");
dToc.classList.add("d-toc-main");