Auto merge of #47894 - vi:rustdoc_foldable_impls, r=GuillaumeGomez,QuietMisdreavus

rustdoc: Foldable impl blocks

Addresses #40363, #45720, #24483, #23986 and so on

* Expands and refactors collapseDocs and toggleAllDocs
* Adds [-] toggle to all impls (including inherent impl)
* Makes it hiding though main css file, not though element inline style

May need to be addressed:

* "[-]" and anchor link copier are overlaid a bit
* Inherent methods are also hidden by the global [-] toggle.
* Auto-collapsing "Iterator" and so on by default is not implemented yet
* Tested only shallowly and only in Chromiuim
* No tests. Are there tests for css/js part here?
* The new implementation may be a bit slower.

What next steps are need to be done before the integration?
This commit is contained in:
bors 2018-02-28 04:24:18 +00:00
commit 89e5a0796e
2 changed files with 145 additions and 53 deletions

View file

@ -297,9 +297,9 @@
document.onkeydown = handleShortcut;
document.onclick = function(ev) {
if (hasClass(ev.target, 'collapse-toggle')) {
collapseDocs(ev.target);
collapseDocs(ev.target, "toggle");
} else if (hasClass(ev.target.parentNode, 'collapse-toggle')) {
collapseDocs(ev.target.parentNode);
collapseDocs(ev.target.parentNode, "toggle");
} else if (ev.target.tagName === 'SPAN' && hasClass(ev.target.parentNode, 'line-numbers')) {
var prev_id = 0;
@ -1636,19 +1636,8 @@
e.innerHTML = labelForToggleButton(false);
});
toggle.title = "collapse all docs";
onEach(document.getElementsByClassName("docblock"), function(e) {
e.style.display = 'block';
});
onEach(document.getElementsByClassName("toggle-label"), function(e) {
e.style.display = 'none';
});
onEach(document.getElementsByClassName("toggle-wrapper"), function(e) {
removeClass(e, "collapsed");
});
onEach(document.getElementsByClassName("collapse-toggle"), function(e) {
onEveryMatchingChild(e, "inner", function(i_e) {
i_e.innerHTML = labelForToggleButton(false);
});
collapseDocs(e, "show");
});
} else {
addClass(toggle, "will-expand");
@ -1656,56 +1645,134 @@
e.innerHTML = labelForToggleButton(true);
});
toggle.title = "expand all docs";
onEach(document.getElementsByClassName("docblock"), function(e) {
e.style.display = 'none';
});
onEach(document.getElementsByClassName("toggle-label"), function(e) {
e.style.display = 'inline-block';
});
onEach(document.getElementsByClassName("toggle-wrapper"), function(e) {
addClass(e, "collapsed");
});
onEach(document.getElementsByClassName("collapse-toggle"), function(e) {
onEveryMatchingChild(e, "inner", function(i_e) {
i_e.innerHTML = labelForToggleButton(true);
});
collapseDocs(e, "hide");
});
}
}
function collapseDocs(toggle) {
function collapseDocs(toggle, mode) {
if (!toggle || !toggle.parentNode) {
return;
}
var relatedDoc = toggle.parentNode.nextElementSibling;
if (hasClass(relatedDoc, "stability")) {
relatedDoc = relatedDoc.nextElementSibling;
}
if (hasClass(relatedDoc, "docblock")) {
if (!isHidden(relatedDoc)) {
relatedDoc.style.display = 'none';
onEach(toggle.childNodes, function(e) {
if (hasClass(e, 'toggle-label')) {
function adjustToggle(arg) {
return function(e) {
if (hasClass(e, 'toggle-label')) {
if (arg) {
e.style.display = 'inline-block';
}
if (hasClass(e, 'inner')) {
e.innerHTML = labelForToggleButton(true);
}
});
addClass(toggle.parentNode, 'collapsed');
} else {
relatedDoc.style.display = 'block';
removeClass(toggle.parentNode, 'collapsed');
onEach(toggle.childNodes, function(e) {
if (hasClass(e, 'toggle-label')) {
} else {
e.style.display = 'none';
}
if (hasClass(e, 'inner')) {
e.innerHTML = labelForToggleButton(false);
}
if (hasClass(e, 'inner')) {
e.innerHTML = labelForToggleButton(arg);
}
};
};
if (!hasClass(toggle.parentNode, "impl")) {
var relatedDoc = toggle.parentNode.nextElementSibling;
if (hasClass(relatedDoc, "stability")) {
relatedDoc = relatedDoc.nextElementSibling;
}
if (hasClass(relatedDoc, "docblock")) {
var action = mode;
if (action === "toggle") {
if (hasClass(relatedDoc, "hidden-by-usual-hider")) {
action = "show";
} else {
action = "hide";
}
}
if (action === "hide") {
addClass(relatedDoc, "hidden-by-usual-hider");
onEach(toggle.childNodes, adjustToggle(true));
addClass(toggle.parentNode, 'collapsed');
} else if (action === "show") {
removeClass(relatedDoc, "hidden-by-usual-hider");
removeClass(toggle.parentNode, 'collapsed');
onEach(toggle.childNodes, adjustToggle(false));
}
}
} else {
// we are collapsing the impl block
function implHider(addOrRemove) {
return function(n) {
if (hasClass(n, "method")) {
if (addOrRemove) {
addClass(n, "hidden-by-impl-hider");
} else {
removeClass(n, "hidden-by-impl-hider");
}
var ns = n.nextElementSibling;
while (true) {
if (ns && (
hasClass(ns, "docblock") ||
hasClass(ns, "stability") ||
false
)) {
if (addOrRemove) {
addClass(ns, "hidden-by-impl-hider");
} else {
removeClass(ns, "hidden-by-impl-hider");
}
ns = ns.nextElementSibling;
continue;
}
break;
}
}
}
}
var relatedDoc = toggle.parentNode;
while (!hasClass(relatedDoc, "impl-items")) {
relatedDoc = relatedDoc.nextElementSibling;
}
if (!relatedDoc) {
return;
}
// Hide all functions, but not associated types/consts
var action = mode;
if (action === "toggle") {
if (hasClass(relatedDoc, "fns-now-collapsed")) {
action = "show";
} else {
action = "hide";
}
}
if (action === "show") {
removeClass(relatedDoc, "fns-now-collapsed");
onEach(toggle.childNodes, adjustToggle(false));
onEach(relatedDoc.childNodes, implHider(false));
} else if (action === "hide") {
addClass(relatedDoc, "fns-now-collapsed");
onEach(toggle.childNodes, adjustToggle(true));
onEach(relatedDoc.childNodes, implHider(true));
}
}
}
function autoCollapseAllImpls() {
// Automatically minimize all non-inherent impls
onEach(document.getElementsByClassName('impl'), function(n) {
// inherent impl ids are like 'impl' or impl-<number>'
var inherent = (n.id.match(/^impl(?:-\d+)?$/) !== null);
if (!inherent) {
onEach(n.childNodes, function(m) {
if (hasClass(m, "collapse-toggle")) {
collapseDocs(m, "hide");
}
});
}
}
});
}
var x = document.getElementById('toggle-all-docs');
@ -1732,8 +1799,12 @@
hasClass(next.nextElementSibling, 'docblock'))) {
insertAfter(toggle.cloneNode(true), e.childNodes[e.childNodes.length - 1]);
}
if (hasClass(e, 'impl')) {
insertAfter(toggle.cloneNode(true), e.childNodes[e.childNodes.length - 1]);
}
}
onEach(document.getElementsByClassName('method'), func);
onEach(document.getElementsByClassName('impl'), func);
onEach(document.getElementsByClassName('impl-items'), function(e) {
onEach(e.getElementsByClassName('associatedconstant'), func);
});
@ -1781,6 +1852,8 @@
}
})
autoCollapseAllImpls();
function createToggleWrapper() {
var span = document.createElement('span');
span.className = 'toggle-label';
@ -1821,7 +1894,7 @@
onEach(document.getElementById('main').getElementsByTagName('pre'), function(e) {
onEach(e.getElementsByClassName('attributes'), function(i_e) {
i_e.parentNode.insertBefore(createToggleWrapper(), i_e);
collapseDocs(i_e.previousSibling.childNodes[0]);
collapseDocs(i_e.previousSibling.childNodes[0], "toggle");
});
});

View file

@ -110,6 +110,7 @@ h3.impl, h3.method, h4.method, h3.type, h4.type, h4.associatedconstant {
}
h3.impl, h3.method, h3.type {
margin-top: 15px;
padding-left: 15px;
}
h1, h2, h3, h4,
@ -522,10 +523,10 @@ a {
.anchor {
display: none;
position: absolute;
left: -25px;
left: -7px;
}
.anchor.field {
left: -20px;
left: -5px;
}
.anchor:before {
content: '\2002\00a7\2002';
@ -926,6 +927,10 @@ span.since {
.content .impl-items .method, .content .impl-items > .type, .impl-items > .associatedconstant {
display: flex;
}
.anchor {
display: none !important;
}
}
@media print {
@ -1083,6 +1088,14 @@ h4 > .important-traits {
z-index: -1;
border-bottom: 1px solid;
}
.collapse-toggle {
left: -20px;
}
.impl > .collapse-toggle {
left: -10px;
}
}
@ -1228,3 +1241,9 @@ kbd {
z-index: 1;
}
}
.hidden-by-impl-hider,
.hidden-by-usual-hider {
/* important because of conflicting rule for small screens */
display: none !important;
}