generated docs: better navigation
This commit is contained in:
parent
9237461b24
commit
d70c30055e
@ -22,9 +22,32 @@
|
||||
padding:1em;
|
||||
overflow-x: auto;
|
||||
}
|
||||
nav {
|
||||
width: 10em;
|
||||
position: fixed;
|
||||
left: 0;
|
||||
top: 0;
|
||||
height: 100vh;
|
||||
overflow: auto;
|
||||
}
|
||||
nav h2 {
|
||||
font-size: 1.2em;
|
||||
text-decoration: underline;
|
||||
margin: 0;
|
||||
padding: 0.5em 0;
|
||||
text-align: center;
|
||||
}
|
||||
nav p {
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
text-align: center;
|
||||
}
|
||||
section {
|
||||
margin-left: 10em;
|
||||
}
|
||||
#listNav {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
margin: 0.5em 0 0 0;
|
||||
padding: 0;
|
||||
overflow: hidden;
|
||||
background-color: #333;
|
||||
@ -36,7 +59,7 @@
|
||||
display: block;
|
||||
color: #fff;
|
||||
text-align: center;
|
||||
padding: .8em .8em;
|
||||
padding: .5em .8em;
|
||||
text-decoration: none;
|
||||
}
|
||||
#listNav li a:hover {
|
||||
@ -46,14 +69,30 @@
|
||||
background-color: #4CAF50;
|
||||
}
|
||||
|
||||
#listPkgs {
|
||||
list-style-type: none;
|
||||
margin: 0;
|
||||
padding: 0;
|
||||
background-color: #f1f1f1;
|
||||
}
|
||||
#listPkgs li a {
|
||||
display: block;
|
||||
color: #000;
|
||||
padding: 8px 16px;
|
||||
text-decoration: none;
|
||||
}
|
||||
#listPkgs li a:hover {
|
||||
background-color: #555;
|
||||
color: #fff;
|
||||
}
|
||||
|
||||
#logo {
|
||||
width: 5em;
|
||||
float: left;
|
||||
padding: 0 1em 0 0;
|
||||
width: 8em;
|
||||
padding: 0.5em 1em;
|
||||
}
|
||||
|
||||
#search {
|
||||
width: 90%;
|
||||
width: 100%;
|
||||
}
|
||||
|
||||
@media (prefers-color-scheme: dark) {
|
||||
@ -67,11 +106,35 @@
|
||||
pre{
|
||||
background-color:#2A2A2A;
|
||||
}
|
||||
#listPkgs {
|
||||
background-color: #333;
|
||||
}
|
||||
#listPkgs li a {
|
||||
color: #fff;
|
||||
}
|
||||
#listPkgs li a:hover {
|
||||
background-color: #555;
|
||||
color: #fff;
|
||||
}
|
||||
}
|
||||
</style>
|
||||
</head>
|
||||
<body>
|
||||
<nav>
|
||||
<img alt="ZIG" id="logo" src="data:image/svg+xml;base64,PHN2ZyB2ZXJzaW9uPSIxLjEiIHZpZXdCb3g9IjAgMCAxNTAgMTAwIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciPjxnIGZpbGw9IiNmN2E0MWQiPjxwYXRoIGQ9Im0wIDEwdjgwaDE5bDYtMTAgMTItMTBoLTE3di00MGgxNXYtMjB6bTQwIDB2MjBoNjJ2LTIwem05MSAwLTYgMTAtMTIgMTBoMTd2NDBoLTE1djIwaDM1di04MHptLTgzIDYwdjIwaDYydi0yMHoiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPjxwYXRoIGQ9Im0zNyA3MC0xOCAyMHYtMTV6Ii8+PHBhdGggZD0ibTExMyAzMCAxOC0yMHYxNXoiLz48cGF0aCBkPSJtOTYuOTggMTAuNjMgMzYuMjgtMTAuNC04MC4yOSA4OS4xNy0zNi4yOCAxMC40eiIvPjwvZz48L3N2Zz4K"></img>
|
||||
<div id="sectPkgs" class="hidden">
|
||||
<h2>Packages</h2>
|
||||
<ul id="listPkgs">
|
||||
</ul>
|
||||
</div>
|
||||
<div id="sectInfo" class="hidden">
|
||||
<h2>Zig Version</h2>
|
||||
<p id="tdZigVer"></p>
|
||||
<h2>Target</h2>
|
||||
<p id="tdTarget"></p>
|
||||
</div>
|
||||
</nav>
|
||||
<section>
|
||||
<input type="search" id="search" autocomplete="off" spellcheck="false" placeholder="`s` to search, `?` to see more options">
|
||||
<p id="status">Loading...</p>
|
||||
<div id="sectNav" class="hidden"><ul id="listNav"></ul></div>
|
||||
@ -81,11 +144,6 @@
|
||||
<div id="fnDocs" class="hidden"></div>
|
||||
<div id="sectSearchResults" class="hidden"><ul id="listSearchResults"></ul></div>
|
||||
<div id="sectSearchNoResults" class="hidden"><p>No search results.</p></div>
|
||||
<div id="sectPkgs" class="hidden">
|
||||
<h2>Packages</h2>
|
||||
<ul id="listPkgs">
|
||||
</ul>
|
||||
</div>
|
||||
<div id="sectTypes" class="hidden">
|
||||
<h2>Types</h2>
|
||||
<ul id="listTypes">
|
||||
@ -96,6 +154,7 @@
|
||||
<ul id="listFns">
|
||||
</ul>
|
||||
</div>
|
||||
</section>
|
||||
<script src="data.js"></script>
|
||||
<script src="main.js"></script>
|
||||
</body>
|
||||
|
@ -15,6 +15,10 @@
|
||||
var domSectSearchResults = document.getElementById("sectSearchResults");
|
||||
var domListSearchResults = document.getElementById("listSearchResults");
|
||||
var domSectSearchNoResults = document.getElementById("sectSearchNoResults");
|
||||
var domSectInfo = document.getElementById("sectInfo");
|
||||
var domListInfo = document.getElementById("listInfo");
|
||||
var domTdTarget = document.getElementById("tdTarget");
|
||||
var domTdZigVer = document.getElementById("tdZigVer");
|
||||
|
||||
var searchTimer = null;
|
||||
var escapeHtmlReplacements = { "&": "&", '"': """, "<": "<", ">": ">" };
|
||||
@ -69,14 +73,18 @@
|
||||
domSectTypes.classList.add("hidden");
|
||||
domSectFns.classList.add("hidden");
|
||||
domSectSearchResults.classList.add("hidden");
|
||||
domSectInfo.classList.add("hidden");
|
||||
|
||||
renderTitle();
|
||||
renderInfo();
|
||||
renderPkgList();
|
||||
|
||||
if (curNavSearch !== "") {
|
||||
return renderSearch();
|
||||
}
|
||||
|
||||
var pkg = zigAnalysis.packages[zigAnalysis.rootPkg];
|
||||
var rootPkg = zigAnalysis.packages[zigAnalysis.rootPkg];
|
||||
var pkg = rootPkg;
|
||||
curNav.pkgObjs = [pkg];
|
||||
for (var i = 0; i < curNav.pkgNames.length; i += 1) {
|
||||
var childPkg = zigAnalysis.packages[pkg.table[curNav.pkgNames[i]]];
|
||||
@ -109,9 +117,6 @@
|
||||
|
||||
renderNav();
|
||||
|
||||
var lastPkg = curNav.pkgObjs[curNav.pkgObjs.length - 1];
|
||||
renderPkgList(lastPkg);
|
||||
|
||||
var lastDecl = curNav.declObjs[curNav.declObjs.length - 1];
|
||||
if (lastDecl.type != null) {
|
||||
var typeObj = zigAnalysis.types[lastDecl.type];
|
||||
@ -175,18 +180,26 @@
|
||||
domSectNav.classList.remove("hidden");
|
||||
}
|
||||
|
||||
function renderInfo() {
|
||||
domTdZigVer.textContent = zigAnalysis.params.zigVersion;
|
||||
domTdTarget.textContent = zigAnalysis.params.target;
|
||||
|
||||
domSectInfo.classList.remove("hidden");
|
||||
}
|
||||
|
||||
function render404() {
|
||||
domStatus.textContent = "404 Not Found";
|
||||
domStatus.classList.remove("hidden");
|
||||
}
|
||||
|
||||
function renderPkgList(pkg) {
|
||||
function renderPkgList() {
|
||||
var rootPkg = zigAnalysis.packages[zigAnalysis.rootPkg];
|
||||
var list = [];
|
||||
for (var key in pkg.table) {
|
||||
for (var key in rootPkg.table) {
|
||||
if (key === "root" && rootIsStd) continue;
|
||||
list.push({
|
||||
name: key,
|
||||
pkg: pkg.table[key],
|
||||
pkg: rootPkg.table[key],
|
||||
});
|
||||
}
|
||||
list.sort(function(a, b) {
|
||||
@ -359,6 +372,9 @@
|
||||
curNav.declNames = parts[1].split(".");
|
||||
}
|
||||
}
|
||||
if (domSearch.value !== curNavSearch) {
|
||||
domSearch.value = curNavSearch;
|
||||
}
|
||||
render();
|
||||
}
|
||||
|
||||
@ -455,10 +471,6 @@
|
||||
}
|
||||
}
|
||||
function renderSearch() {
|
||||
if (domSearch.value !== curNavSearch) {
|
||||
domSearch.value = curNavSearch;
|
||||
}
|
||||
|
||||
var matchedDecls = [];
|
||||
var terms = curNavSearch.split(/[ \r\n\t]+/);
|
||||
decl_loop: for (var declIndex = 0; declIndex < zigAnalysis.decls.length; declIndex += 1) {
|
||||
|
Loading…
x
Reference in New Issue
Block a user