authorgravatar for andrew@ziglang.orgAndrew Kelley <andrew@ziglang.org> 2019-10-07 14:29:01-04:00
committergravatar for andrew@ziglang.orgAndrew Kelley <andrew@ziglang.org> 2019-10-07 14:29:01-04:00
logd70c30055e26be29fceede7559afec46a89a9f5c
tree452f06f099244c77bec91b7f8714a1ee8af2374b
parent9237461b24664ecf12546b87530952f49f0e1166
signaturelock-open Commit is signed but in an unrecognized format.

generated docs: better navigation

2 files changed, 94 insertions(+), 23 deletions(-)

lib/std/special/docs/index.html+71-12
...@@ -22,9 +22,32 @@...@@ -22,9 +22,32 @@
22 padding:1em;22 padding:1em;
23 overflow-x: auto;23 overflow-x: auto;
24 }24 }
25 nav {
26 width: 10em;
27 position: fixed;
28 left: 0;
29 top: 0;
30 height: 100vh;
31 overflow: auto;
32 }
33 nav h2 {
34 font-size: 1.2em;
35 text-decoration: underline;
36 margin: 0;
37 padding: 0.5em 0;
38 text-align: center;
39 }
40 nav p {
41 margin: 0;
42 padding: 0;
43 text-align: center;
44 }
45 section {
46 margin-left: 10em;
47 }
25 #listNav {48 #listNav {
26 list-style-type: none;49 list-style-type: none;
27 margin: 0;50 margin: 0.5em 0 0 0;
28 padding: 0;51 padding: 0;
29 overflow: hidden;52 overflow: hidden;
30 background-color: #333;53 background-color: #333;
...@@ -36,7 +59,7 @@...@@ -36,7 +59,7 @@
36 display: block;59 display: block;
37 color: #fff;60 color: #fff;
38 text-align: center;61 text-align: center;
39 padding: .8em .8em;62 padding: .5em .8em;
40 text-decoration: none;63 text-decoration: none;
41 }64 }
42 #listNav li a:hover {65 #listNav li a:hover {
...@@ -46,14 +69,30 @@...@@ -46,14 +69,30 @@
46 background-color: #4CAF50;69 background-color: #4CAF50;
47 }70 }
4871
72 #listPkgs {
73 list-style-type: none;
74 margin: 0;
75 padding: 0;
76 background-color: #f1f1f1;
77 }
78 #listPkgs li a {
79 display: block;
80 color: #000;
81 padding: 8px 16px;
82 text-decoration: none;
83 }
84 #listPkgs li a:hover {
85 background-color: #555;
86 color: #fff;
87 }
88
49 #logo {89 #logo {
50 width: 5em;90 width: 8em;
51 float: left;91 padding: 0.5em 1em;
52 padding: 0 1em 0 0;
53 }92 }
5493
55 #search {94 #search {
56 width: 90%;95 width: 100%;
57 }96 }
5897
59 @media (prefers-color-scheme: dark) {98 @media (prefers-color-scheme: dark) {
...@@ -67,11 +106,35 @@...@@ -67,11 +106,35 @@
67 pre{106 pre{
68 background-color:#2A2A2A;107 background-color:#2A2A2A;
69 }108 }
109 #listPkgs {
110 background-color: #333;
111 }
112 #listPkgs li a {
113 color: #fff;
114 }
115 #listPkgs li a:hover {
116 background-color: #555;
117 color: #fff;
118 }
70 }119 }
71 </style>120 </style>
72 </head>121 </head>
73 <body>122 <body>
74 <img alt="ZIG" id="logo" src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxNTAgMTAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnIGZpbGw9IiNmN2E0MWQiPjxwYXRoIGQ9Im0wIDEwdjgwaDE5bDYtMTAgMTItMTBoLTE3di00MGgxNXYtMjB6bTQwIDB2MjBoNjJ2LTIwem05MSAwLTYgMTAtMTIgMTBoMTd2NDBoLTE1djIwaDM1di04MHptLTgzIDYwdjIwaDYydi0yMHoiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPjxwYXRoIGQ9Im0zNyA3MC0xOCAyMHYtMTV6Ii8+PHBhdGggZD0ibTExMyAzMCAxOC0yMHYxNXoiLz48cGF0aCBkPSJtOTYuOTggMTAuNjMgMzYuMjgtMTAuNC04MC4yOSA4OS4xNy0zNi4yOCAxMC40eiIvPjwvZz48L3N2Zz4K"></img>123 <nav>
124 <img alt="ZIG" id="logo" src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxNTAgMTAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnIGZpbGw9IiNmN2E0MWQiPjxwYXRoIGQ9Im0wIDEwdjgwaDE5bDYtMTAgMTItMTBoLTE3di00MGgxNXYtMjB6bTQwIDB2MjBoNjJ2LTIwem05MSAwLTYgMTAtMTIgMTBoMTd2NDBoLTE1djIwaDM1di04MHptLTgzIDYwdjIwaDYydi0yMHoiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPjxwYXRoIGQ9Im0zNyA3MC0xOCAyMHYtMTV6Ii8+PHBhdGggZD0ibTExMyAzMCAxOC0yMHYxNXoiLz48cGF0aCBkPSJtOTYuOTggMTAuNjMgMzYuMjgtMTAuNC04MC4yOSA4OS4xNy0zNi4yOCAxMC40eiIvPjwvZz48L3N2Zz4K"></img>
125 <div id="sectPkgs" class="hidden">
126 <h2>Packages</h2>
127 <ul id="listPkgs">
128 </ul>
129 </div>
130 <div id="sectInfo" class="hidden">
131 <h2>Zig Version</h2>
132 <p id="tdZigVer"></p>
133 <h2>Target</h2>
134 <p id="tdTarget"></p>
135 </div>
136 </nav>
137 <section>
75 <input type="search" id="search" autocomplete="off" spellcheck="false" placeholder="`s` to search, `?` to see more options">138 <input type="search" id="search" autocomplete="off" spellcheck="false" placeholder="`s` to search, `?` to see more options">
76 <p id="status">Loading...</p>139 <p id="status">Loading...</p>
77 <div id="sectNav" class="hidden"><ul id="listNav"></ul></div>140 <div id="sectNav" class="hidden"><ul id="listNav"></ul></div>
...@@ -81,11 +144,6 @@...@@ -81,11 +144,6 @@
81 <div id="fnDocs" class="hidden"></div>144 <div id="fnDocs" class="hidden"></div>
82 <div id="sectSearchResults" class="hidden"><ul id="listSearchResults"></ul></div>145 <div id="sectSearchResults" class="hidden"><ul id="listSearchResults"></ul></div>
83 <div id="sectSearchNoResults" class="hidden"><p>No search results.</p></div>146 <div id="sectSearchNoResults" class="hidden"><p>No search results.</p></div>
84 <div id="sectPkgs" class="hidden">
85 <h2>Packages</h2>
86 <ul id="listPkgs">
87 </ul>
88 </div>
89 <div id="sectTypes" class="hidden">147 <div id="sectTypes" class="hidden">
90 <h2>Types</h2>148 <h2>Types</h2>
91 <ul id="listTypes">149 <ul id="listTypes">
...@@ -96,6 +154,7 @@...@@ -96,6 +154,7 @@
96 <ul id="listFns">154 <ul id="listFns">
97 </ul>155 </ul>
98 </div>156 </div>
157 </section>
99 <script src="data.js"></script>158 <script src="data.js"></script>
100 <script src="main.js"></script>159 <script src="main.js"></script>
101 </body>160 </body>
lib/std/special/docs/main.js+23-11
...@@ -15,6 +15,10 @@...@@ -15,6 +15,10 @@
15 var domSectSearchResults = document.getElementById("sectSearchResults");15 var domSectSearchResults = document.getElementById("sectSearchResults");
16 var domListSearchResults = document.getElementById("listSearchResults");16 var domListSearchResults = document.getElementById("listSearchResults");
17 var domSectSearchNoResults = document.getElementById("sectSearchNoResults");17 var domSectSearchNoResults = document.getElementById("sectSearchNoResults");
18 var domSectInfo = document.getElementById("sectInfo");
19 var domListInfo = document.getElementById("listInfo");
20 var domTdTarget = document.getElementById("tdTarget");
21 var domTdZigVer = document.getElementById("tdZigVer");
1822
19 var searchTimer = null;23 var searchTimer = null;
20 var escapeHtmlReplacements = { "&": "&amp;", '"': "&quot;", "<": "&lt;", ">": "&gt;" };24 var escapeHtmlReplacements = { "&": "&amp;", '"': "&quot;", "<": "&lt;", ">": "&gt;" };
...@@ -69,14 +73,18 @@...@@ -69,14 +73,18 @@
69 domSectTypes.classList.add("hidden");73 domSectTypes.classList.add("hidden");
70 domSectFns.classList.add("hidden");74 domSectFns.classList.add("hidden");
71 domSectSearchResults.classList.add("hidden");75 domSectSearchResults.classList.add("hidden");
76 domSectInfo.classList.add("hidden");
7277
73 renderTitle();78 renderTitle();
79 renderInfo();
80 renderPkgList();
7481
75 if (curNavSearch !== "") {82 if (curNavSearch !== "") {
76 return renderSearch();83 return renderSearch();
77 }84 }
7885
79 var pkg = zigAnalysis.packages[zigAnalysis.rootPkg];86 var rootPkg = zigAnalysis.packages[zigAnalysis.rootPkg];
87 var pkg = rootPkg;
80 curNav.pkgObjs = [pkg];88 curNav.pkgObjs = [pkg];
81 for (var i = 0; i < curNav.pkgNames.length; i += 1) {89 for (var i = 0; i < curNav.pkgNames.length; i += 1) {
82 var childPkg = zigAnalysis.packages[pkg.table[curNav.pkgNames[i]]];90 var childPkg = zigAnalysis.packages[pkg.table[curNav.pkgNames[i]]];
...@@ -109,9 +117,6 @@...@@ -109,9 +117,6 @@
109117
110 renderNav();118 renderNav();
111119
112 var lastPkg = curNav.pkgObjs[curNav.pkgObjs.length - 1];
113 renderPkgList(lastPkg);
114
115 var lastDecl = curNav.declObjs[curNav.declObjs.length - 1];120 var lastDecl = curNav.declObjs[curNav.declObjs.length - 1];
116 if (lastDecl.type != null) {121 if (lastDecl.type != null) {
117 var typeObj = zigAnalysis.types[lastDecl.type];122 var typeObj = zigAnalysis.types[lastDecl.type];
...@@ -175,18 +180,26 @@...@@ -175,18 +180,26 @@
175 domSectNav.classList.remove("hidden");180 domSectNav.classList.remove("hidden");
176 }181 }
177182
183 function renderInfo() {
184 domTdZigVer.textContent = zigAnalysis.params.zigVersion;
185 domTdTarget.textContent = zigAnalysis.params.target;
186
187 domSectInfo.classList.remove("hidden");
188 }
189
178 function render404() {190 function render404() {
179 domStatus.textContent = "404 Not Found";191 domStatus.textContent = "404 Not Found";
180 domStatus.classList.remove("hidden");192 domStatus.classList.remove("hidden");
181 }193 }
182194
183 function renderPkgList(pkg) {195 function renderPkgList() {
196 var rootPkg = zigAnalysis.packages[zigAnalysis.rootPkg];
184 var list = [];197 var list = [];
185 for (var key in pkg.table) {198 for (var key in rootPkg.table) {
186 if (key === "root" && rootIsStd) continue;199 if (key === "root" && rootIsStd) continue;
187 list.push({200 list.push({
188 name: key,201 name: key,
189 pkg: pkg.table[key],202 pkg: rootPkg.table[key],
190 });203 });
191 }204 }
192 list.sort(function(a, b) {205 list.sort(function(a, b) {
...@@ -359,6 +372,9 @@...@@ -359,6 +372,9 @@
359 curNav.declNames = parts[1].split(".");372 curNav.declNames = parts[1].split(".");
360 }373 }
361 }374 }
375 if (domSearch.value !== curNavSearch) {
376 domSearch.value = curNavSearch;
377 }
362 render();378 render();
363 }379 }
364380
...@@ -455,10 +471,6 @@...@@ -455,10 +471,6 @@
455 }471 }
456 }472 }
457 function renderSearch() {473 function renderSearch() {
458 if (domSearch.value !== curNavSearch) {
459 domSearch.value = curNavSearch;
460 }
461
462 var matchedDecls = [];474 var matchedDecls = [];
463 var terms = curNavSearch.split(/[ \r\n\t]+/);475 var terms = curNavSearch.split(/[ \r\n\t]+/);
464 decl_loop: for (var declIndex = 0; declIndex < zigAnalysis.decls.length; declIndex += 1) {476 decl_loop: for (var declIndex = 0; declIndex < zigAnalysis.decls.length; declIndex += 1) {