about summary refs log tree commit diff
diff options
context:
space:
mode:
authorRory O’Kane <rory@roryokane.com>2015-05-07 03:53:21 -0400
committerRory O’Kane <rory@roryokane.com>2015-05-07 04:11:14 -0400
commit92565b3dfbacca4b2a851758e5e9a784fc5b156e (patch)
tree113605fb3cb19afd9e09845d1041377bbfff360f
parent6ce05ae6bb0e5762dee940d043feb728e5583564 (diff)
downloadrust-92565b3dfbacca4b2a851758e5e9a784fc5b156e.tar.gz
rust-92565b3dfbacca4b2a851758e5e9a784fc5b156e.zip
Refactor doc toggle button label changing
To separate concerns, instead of checking the state of `#toggle-all-docs` by looking at its label text, I add or remove a class `will-expand` depending on whether the button’s next click will expand everything. (The `if` statement’s two branches were swapped as part of this change.)

I moved the desired text values to a function `labelForToggleButton`, so changing the values will be easier. I also note in a comment the other file where the text is duplicated.

To allow the labels of both types of toggle buttons to be uniformly set, I added a `span.inner` to the global button too.

I split the template in `render.rs` into multiple lines to make room for the `span`, and that adds whitespace around the `[` and `]` text elements. That seems to be okay, though – the page still looks the same.

I updated the CSS styling for `.collapse-toggle > .inner` to add a little extra space around the symbol, to make minus signs easier to identify. (`#toggle-all-docs > .inner` does not need the same style, since its text size is bigger, so it naturally puts more space around the symbol.)
-rw-r--r--src/librustdoc/html/render.rs5
-rw-r--r--src/librustdoc/html/static/main.css2
-rw-r--r--src/librustdoc/html/static/main.js40
3 files changed, 31 insertions, 16 deletions
diff --git a/src/librustdoc/html/render.rs b/src/librustdoc/html/render.rs
index ad26d25c81a..f7ab5fc9b09 100644
--- a/src/librustdoc/html/render.rs
+++ b/src/librustdoc/html/render.rs
@@ -1460,8 +1460,9 @@ impl<'a> fmt::Display for Item<'a> {
         try!(write!(fmt, "<span class='out-of-band'>"));
         try!(write!(fmt,
         r##"<span id='render-detail'>
-            <a id="toggle-all-docs" href="javascript:void(0)"
-               title="collapse all docs">[&#x2212;]</a>
+            <a id="toggle-all-docs" href="javascript:void(0)" title="collapse all docs">
+                [<span class='inner'>&#x2212;</span>]
+            </a>
         </span>"##));
 
         // Write `src` tag
diff --git a/src/librustdoc/html/static/main.css b/src/librustdoc/html/static/main.css
index b907e9e20b6..2dc5ea99067 100644
--- a/src/librustdoc/html/static/main.css
+++ b/src/librustdoc/html/static/main.css
@@ -581,7 +581,7 @@ pre.rust { position: relative; }
 
 .collapse-toggle > .inner {
     display: inline-block;
-    width: 1ch;
+    width: 1.2ch;
     text-align: center;
 }
 
diff --git a/src/librustdoc/html/static/main.js b/src/librustdoc/html/static/main.js
index cfa599041ee..92fb6402e72 100644
--- a/src/librustdoc/html/static/main.js
+++ b/src/librustdoc/html/static/main.js
@@ -806,22 +806,35 @@
         window.location = $('.srclink').attr('href');
     }
 
+    function labelForToggleButton(sectionIsCollapsed) {
+        if (sectionIsCollapsed) {
+            // button will expand the section
+            return "+";
+        } else {
+            // button will collapse the section
+            // note that this text is also set in the HTML template in render.rs
+            return "\u2212"; // "\u2212" is '−' minus sign
+        }
+    }
+    
     $("#toggle-all-docs").on("click", function() {
         var toggle = $("#toggle-all-docs");
-        if (toggle.html() == "[\u2212]") {
-            toggle.html("[+]");
-            toggle.attr("title", "expand all docs");
-            $(".docblock").hide();
-            $(".toggle-label").show();
-            $(".toggle-wrapper").addClass("collapsed");
-            $(".collapse-toggle").children(".inner").html("+");
-        } else {
-            toggle.html("[\u2212]");
+        if (toggle.hasClass("will-expand")) {
+            toggle.removeClass("will-expand");
+            toggle.children(".inner").text(labelForToggleButton(false));
             toggle.attr("title", "collapse all docs");
             $(".docblock").show();
             $(".toggle-label").hide();
             $(".toggle-wrapper").removeClass("collapsed");
-            $(".collapse-toggle").children(".inner").html("\u2212");
+            $(".collapse-toggle").children(".inner").text(labelForToggleButton(false));
+        } else {
+            toggle.addClass("will-expand");
+            toggle.children(".inner").text(labelForToggleButton(true));
+            toggle.attr("title", "expand all docs");
+            $(".docblock").hide();
+            $(".toggle-label").show();
+            $(".toggle-wrapper").addClass("collapsed");
+            $(".collapse-toggle").children(".inner").text(labelForToggleButton(true));
         }
     });
 
@@ -835,12 +848,12 @@
             if (relatedDoc.is(":visible")) {
                 relatedDoc.slideUp({duration:'fast', easing:'linear'});
                 toggle.parent(".toggle-wrapper").addClass("collapsed");
-                toggle.children(".inner").html("+");
+                toggle.children(".inner").text(labelForToggleButton(true));
                 toggle.children(".toggle-label").fadeIn();
             } else {
                 relatedDoc.slideDown({duration:'fast', easing:'linear'});
                 toggle.parent(".toggle-wrapper").removeClass("collapsed");
-                toggle.children(".inner").html("\u2212");
+                toggle.children(".inner").text(labelForToggleButton(false));
                 toggle.children(".toggle-label").hide();
             }
         }
@@ -848,7 +861,8 @@
 
     $(function() {
         var toggle = $("<a/>", {'href': 'javascript:void(0)', 'class': 'collapse-toggle'})
-            .html("[<span class='inner'>\u2212</span>]");
+            .html("[<span class='inner'></span>]");
+        toggle.children(".inner").text(labelForToggleButton(false));
 
         $(".method").each(function() {
             if ($(this).next().is(".docblock") ||