mirror of
https://github.com/golang/go
synced 2024-11-21 18:14:42 -07:00
godoc: make 'Overview' section collapsable
This makes packages with lengthly package comments easier to browse. R=golang-dev, r CC=golang-dev https://golang.org/cl/5901055
This commit is contained in:
parent
ce06e15e2a
commit
0b762d9523
@ -164,21 +164,26 @@ function getElementsByClassName(base, clazz) {
|
|||||||
return foundElements;
|
return foundElements;
|
||||||
}
|
}
|
||||||
|
|
||||||
function godocs_bindExampleToggle(eg) {
|
function godocs_bindToggle(el) {
|
||||||
var heading = getElementsByClassName(eg, "exampleHeading");
|
var button = getElementsByClassName(el, "toggleButton");
|
||||||
var callback = function() {
|
var callback = function() {
|
||||||
if (eg.className == "example") {
|
if (el.className == "toggle") {
|
||||||
eg.className = "exampleVisible";
|
el.className = "toggleVisible";
|
||||||
} else {
|
} else {
|
||||||
eg.className = "example";
|
el.className = "toggle";
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
for (var i = 0; i < heading.length; i++) {
|
for (var i = 0; i < button.length; i++) {
|
||||||
bindEvent(heading[i], "click", callback);
|
bindEvent(button[i], "click", callback);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
function godocs_bindExampleLink(l) {
|
function godocs_bindToggles(className) {
|
||||||
var prefix = "example_";
|
var els = getElementsByClassName(document, className);
|
||||||
|
for (var i = 0; i < els.length; i++) {
|
||||||
|
godocs_bindToggle(els[i]);
|
||||||
|
}
|
||||||
|
}
|
||||||
|
function godocs_bindToggleLink(l, prefix) {
|
||||||
bindEvent(l, "click", function() {
|
bindEvent(l, "click", function() {
|
||||||
var i = l.href.indexOf("#"+prefix);
|
var i = l.href.indexOf("#"+prefix);
|
||||||
if (i < 0) {
|
if (i < 0) {
|
||||||
@ -186,24 +191,23 @@ function godocs_bindExampleLink(l) {
|
|||||||
}
|
}
|
||||||
var id = prefix + l.href.slice(i+1+prefix.length);
|
var id = prefix + l.href.slice(i+1+prefix.length);
|
||||||
var eg = document.getElementById(id);
|
var eg = document.getElementById(id);
|
||||||
eg.className = "exampleVisible";
|
eg.className = "toggleVisible";
|
||||||
});
|
});
|
||||||
}
|
}
|
||||||
function godocs_bindExamples() {
|
function godocs_bindToggleLinks(className, prefix) {
|
||||||
var examples = getElementsByClassName(document, "example");
|
var links = getElementsByClassName(document, className);
|
||||||
for (var i = 0; i < examples.length; i++) {
|
|
||||||
godocs_bindExampleToggle(examples[i]);
|
|
||||||
}
|
|
||||||
var links = getElementsByClassName(document, "exampleLink");
|
|
||||||
for (i = 0; i < links.length; i++) {
|
for (i = 0; i < links.length; i++) {
|
||||||
godocs_bindExampleLink(links[i]);
|
godocs_bindToggleLink(links[i], prefix);
|
||||||
}
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
function godocs_onload() {
|
function godocs_onload() {
|
||||||
godocs_bindSearchEvents();
|
godocs_bindSearchEvents();
|
||||||
godocs_generateTOC();
|
godocs_generateTOC();
|
||||||
godocs_bindExamples();
|
godocs_bindToggles("toggle");
|
||||||
|
godocs_bindToggles("toggleVisible");
|
||||||
|
godocs_bindToggleLinks("exampleLink", "example_");
|
||||||
|
godocs_bindToggleLinks("overviewLink", "");
|
||||||
}
|
}
|
||||||
|
|
||||||
bindEvent(window, 'load', godocs_onload);
|
bindEvent(window, 'load', godocs_onload);
|
||||||
|
@ -364,11 +364,11 @@ div#blog .read {
|
|||||||
text-align: right;
|
text-align: right;
|
||||||
}
|
}
|
||||||
|
|
||||||
.exampleHeading { cursor: pointer; }
|
.toggleButton { cursor: pointer; }
|
||||||
.example .collapsed { display: block; }
|
.toggle .collapsed { display: block; }
|
||||||
.example .expanded { display: none; }
|
.toggle .expanded { display: none; }
|
||||||
.exampleVisible .collapsed { display: none; }
|
.toggleVisible .collapsed { display: none; }
|
||||||
.exampleVisible .expanded { display: block; }
|
.toggleVisible .expanded { display: block; }
|
||||||
|
|
||||||
table.codetable { margin-left: auto; margin-right: auto; border-style: none; }
|
table.codetable { margin-left: auto; margin-right: auto; border-style: none; }
|
||||||
hr { border-style: none; border-top: 1px solid black; }
|
hr { border-style: none; border-top: 1px solid black; }
|
||||||
|
@ -1,9 +1,9 @@
|
|||||||
<div id="example_{{.Name}}" class="example">
|
<div id="example_{{.Name}}" class="toggle">
|
||||||
<div class="collapsed">
|
<div class="collapsed">
|
||||||
<p class="exampleHeading">▹ <span class="text">Example{{example_suffix .Name}}</span></p>
|
<p class="exampleHeading toggleButton">▹ <span class="text">Example{{example_suffix .Name}}</span></p>
|
||||||
</div>
|
</div>
|
||||||
<div class="expanded">
|
<div class="expanded">
|
||||||
<p class="exampleHeading">▾ <span class="text">Example{{example_suffix .Name}}</span></p>
|
<p class="exampleHeading toggleButton">▾ <span class="text">Example{{example_suffix .Name}}</span></p>
|
||||||
{{with .Doc}}<p>{{html .}}</p>{{end}}
|
{{with .Doc}}<p>{{html .}}</p>{{end}}
|
||||||
<p>Code:</p>
|
<p>Code:</p>
|
||||||
<pre class="code">{{.Code}}</pre>
|
<pre class="code">{{.Code}}</pre>
|
||||||
|
@ -10,7 +10,7 @@
|
|||||||
<dd><code>import "{{html .ImportPath}}"</code></dd>
|
<dd><code>import "{{html .ImportPath}}"</code></dd>
|
||||||
</dl>
|
</dl>
|
||||||
<dl>
|
<dl>
|
||||||
<dd><a href="#overview">Overview</a></dd>
|
<dd><a href="#overview" class="overviewLink">Overview</a></dd>
|
||||||
<dd><a href="#index">Index</a></dd>
|
<dd><a href="#index">Index</a></dd>
|
||||||
{{if $.Examples}}
|
{{if $.Examples}}
|
||||||
<dd><a href="#examples">Examples</a></dd>
|
<dd><a href="#examples">Examples</a></dd>
|
||||||
@ -20,9 +20,16 @@
|
|||||||
{{end}}
|
{{end}}
|
||||||
</dl>
|
</dl>
|
||||||
</div>
|
</div>
|
||||||
<h2 id="overview">Overview</h2>
|
|
||||||
<!-- The package's Name is printed as title by the top-level template -->
|
<!-- The package's Name is printed as title by the top-level template -->
|
||||||
|
<div id="overview" class="toggleVisible">
|
||||||
|
<div class="collapsed">
|
||||||
|
<h2 class="toggleButton" title="Click to show Overview section">Overview ▹</h2>
|
||||||
|
</div>
|
||||||
|
<div class="expanded">
|
||||||
|
<h2 class="toggleButton" title="Click to hide Overview section">Overview ▾</h2>
|
||||||
{{comment_html .Doc}}
|
{{comment_html .Doc}}
|
||||||
|
</div>
|
||||||
|
</div>
|
||||||
{{example_html "" $.Examples $.FSet}}
|
{{example_html "" $.Examples $.FSet}}
|
||||||
|
|
||||||
<h2 id="index">Index</h2>
|
<h2 id="index">Index</h2>
|
||||||
|
Loading…
Reference in New Issue
Block a user