auto merge of #16169 : Gankro/rust/simple-docs, r=cmr

<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.

3 files changed, 96 insertions, 3 deletions

diff --git a/src/librustdoc/html/render.rs b/src/librustdoc/html/render.rs
index 084ba46797e..9a2031dc447 100644
--- a/src/librustdoc/html/render.rs
+++ b/src/librustdoc/html/render.rs
@@ -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
diff --git a/src/librustdoc/html/static/main.css b/src/librustdoc/html/static/main.css
index a53cfc9460b..64a0665d400 100644
--- a/src/librustdoc/html/static/main.css
+++ b/src/librustdoc/html/static/main.css
@@ -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;
 }
 
@@ -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; }
@@ -405,7 +408,7 @@ h1 .stability {
     padding: 4px 10px;
 }
 
-.impl-methods .stability {
+.impl-methods .stability, .methods .stability {
     margin-right: 20px;
 }
 
@@ -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;
+}
diff --git a/src/librustdoc/html/static/main.js b/src/librustdoc/html/static/main.js
index 8688e031890..9b44dc63f38 100644
--- a/src/librustdoc/html/static/main.js
+++ b/src/librustdoc/html/static/main.js
@@ -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);
+    });
+
 }());