Skip to content

Commit

Permalink
auto merge of rust-lang#16169 : Gankro/rust/simple-docs, r=cmr
Browse files Browse the repository at this point in the history
<strike>Adds a simple/detailed toggle to api doc pages.
Detailed mode is the current behaviour, simple mode hides all doccomment details leaving only signatures for quick browsing.
</strike>
Adds [expand all] and [collapse all] "links" to all api doc pages. All doccomments are collapsed, leaving only signatures for quick browsing.

In addition, clicking on a <strike>function name</strike> function's [toggle details] link now toggles the visibility of the associated doccomment.

--------

# [Live Build Here](http://cg.scs.carleton.ca/~abeinges/doc/std/vec/struct.Vec.html)

This is something that's been bothering me, and I've seen some people mention in IRC before. The docs are *great* if you want a full in-depth look at an API, but *awful* if you want to scan them. This provides the ability to toggle complexity freely. Interacts perfectly well with noscript, since the static page is effectively unchanged. Collapsing is just hiding divs with css.

I'm not much of a designer, so design input welcome on the actual UX for toggling.

The actual javascript is *a bit* brittle to layout changes, but it always will be without adding lots of extra junk to the actual markup, which didn't seem worth it.
  • Loading branch information
bors committed Aug 2, 2014
2 parents 432042a + 88fe6df commit 147d117
Show file tree
Hide file tree
Showing 3 changed files with 96 additions and 3 deletions.
6 changes: 6 additions & 0 deletions src/librustdoc/html/render.rs
Original file line number Diff line number Diff line change
Expand Up @@ -1316,6 +1316,12 @@ impl<'a> fmt::Show for Item<'a> {
_ => {}
};

try!(write!(fmt,
r##"<span id='render-detail'>
<a id="collapse-all" href="#">[collapse all]</a>
<a id="expand-all" href="#">[expand all]</a>
</span>"##));

// Write `src` tag
//
// When this item is part of a `pub use` in a downstream crate, the
Expand Down
42 changes: 39 additions & 3 deletions src/librustdoc/html/static/main.css
Original file line number Diff line number Diff line change
Expand Up @@ -101,7 +101,7 @@ h3.impl, h3.method, h4.method {
h3.impl, h3.method {
margin-top: 15px;
}
h1, h2, h3, h4, section.sidebar, a.source, .search-input, .content table a {
h1, h2, h3, h4, section.sidebar, a.source, .search-input, .content table a, .collapse-toggle {
font-family: "Fira Sans", "Helvetica Neue", Helvetica, Arial, sans-serif;
}

Expand Down Expand Up @@ -277,7 +277,10 @@ nav.sub {
}
.content .multi-column li { width: 100%; display: inline-block; }

.content .method { font-size: 1em; }
.content .method {
font-size: 1em;
position: relative;
}
.content .methods .docblock { margin-left: 40px; }

.content .impl-methods .docblock { margin-left: 40px; }
Expand Down Expand Up @@ -405,7 +408,7 @@ h1 .stability {
padding: 4px 10px;
}

.impl-methods .stability {
.impl-methods .stability, .methods .stability {
margin-right: 20px;
}

Expand Down Expand Up @@ -477,3 +480,36 @@ pre.rust { position: relative; }
margin: 0 auto;
}
}

.collapse-toggle {
font-weight: 100;
position: absolute;
left: 13px;
color: #999;
margin-top: 2px;
}

.toggle-wrapper > .collapse-toggle {
left: -24px;
margin-top: 0px;
}

.toggle-wrapper {
position: relative;
}

.toggle-wrapper.collapsed {
height: 1em;
transition: height .2s;
}

.collapse-toggle > .inner {
display: inline-block;
width: 1ch;
text-align: center;
}

.toggle-label {
color: #999;
font-style: italic;
}
51 changes: 51 additions & 0 deletions src/librustdoc/html/static/main.js
Original file line number Diff line number Diff line change
Expand Up @@ -730,4 +730,55 @@
if (query['gotosrc']) {
window.location = $('#src-' + query['gotosrc']).attr('href');
}

$("#expand-all").on("click", function() {
$(".docblock").show();
$(".toggle-label").hide();
$(".toggle-wrapper").removeClass("collapsed");
$(".collapse-toggle").children(".inner").html("-");
});

$("#collapse-all").on("click", function() {
$(".docblock").hide();
$(".toggle-label").show();
$(".toggle-wrapper").addClass("collapsed");
$(".collapse-toggle").children(".inner").html("+");
});

$(document).on("click", ".collapse-toggle", function() {
var toggle = $(this);
var relatedDoc = toggle.parent().next();
if (relatedDoc.is(".docblock")) {
if (relatedDoc.is(":visible")) {
relatedDoc.slideUp({duration:'fast', easing:'linear'});
toggle.parent(".toggle-wrapper").addClass("collapsed");
toggle.children(".inner").html("+");
toggle.children(".toggle-label").fadeIn();
} else {
relatedDoc.slideDown({duration:'fast', easing:'linear'});
toggle.parent(".toggle-wrapper").removeClass("collapsed");
toggle.children(".inner").html("-");
toggle.children(".toggle-label").hide();
}
}
});

$(function() {
var toggle = "<a href='javascript:void(0)'"
+ "class='collapse-toggle'>[<span class='inner'>-</span>]</a>";

$(".method").each(function() {
if ($(this).next().is(".docblock")) {
$(this).children().first().after(toggle);
}
});

var mainToggle = $(toggle);
mainToggle.append("<span class='toggle-label' style='display:none'>"
+ "&nbsp;Expand&nbsp;description</span></a>")
var wrapper = $("<div class='toggle-wrapper'>");
wrapper.append(mainToggle);
$("#main > .docblock").before(wrapper);
});

}());

0 comments on commit 147d117

Please sign in to comment.