handle toc ajax

This commit is contained in:
David Dollar 2020-01-28 13:42:42 -05:00
parent 4f844b3281
commit 644c714536
No known key found for this signature in database
GPG Key ID: AFAF263FB45B2124
4 changed files with 53 additions and 28 deletions

View File

@ -58,6 +58,7 @@ func run() error {
s.Router.Static("/assets", packr.NewBox("./public/assets"))
s.Route("GET", "/", index)
s.Route("GET", "/toc/{slug:.*}", toc)
s.Route("GET", "/{slug:.*}", doc)
stdapi.LoadTemplates(packr.NewBox("./templates"), helpers)
@ -175,3 +176,12 @@ func doc(c *stdapi.Context) error {
return c.RenderTemplate("page", params)
}
func toc(c *stdapi.Context) error {
params := map[string]interface{}{
"Documents": documents,
"Slug": c.Var("slug"),
}
return c.RenderTemplate("toc", params)
}

View File

@ -1,6 +1,7 @@
$(window).ready(function () {
$("a").each(hijackLocalLink);
scrollActiveToc();
addHeadingAnchors();
});
@ -30,13 +31,13 @@ function hijackLocalLink(i, a) {
function loadDocument(href) {
$('nav#toc a').blur().removeClass('active');
var url = new URL(href);
console.log('url', url);
$.get('/toc' + url.pathname, function (data) {
$('nav#toc').html(data);
scrollActiveToc();
});
$.get(href + '?partial', function (data) {
$('nav#toc a').each(function (i, a) {
if (a.href == href) {
$(a).addClass('active');
$(a).get(0).scrollIntoView({ behavior: 'smooth', block: 'center' });
}
})
$('main').html(data);
$('main').scrollTop(0);
$('main a').each(hijackLocalLink);
@ -65,3 +66,10 @@ function queryClose() {
function queryShow() {
$('#search-hits').show(200);
}
function scrollActiveToc() {
var active = $('nav#toc a.active').get(0);
if (active) {
active.scrollIntoView({ block: 'center' });
}
}

View File

@ -80,27 +80,7 @@
<div class="d-flex flex-row justify-content-center" style="height:100%">
<nav id="toc" class="sidebar d-none d-lg-block">
<ul class="nav nav-pills flex-column">
<div id="search">
<input type="text" class="form-control" placeholder="Search" id="search-query" oninput="queryChange();" onblur="queryClose();">
<div id="search-hits" style="display: none;">
</div>
</div>
{{ range $c := .Documents.Categories }}
<div class="category">{{.Name}}</div>
<ul class="documents">
{{ template "toc" (params "Active" $.Slug "Documents" $.Documents "Slug" $c.Slug "Index" 0)}}
</ul>
{{ end }}
{{ range $c := .Categories }}
<div class="category">{{.Name}}</div>
<ul class="documents">
{{ range .Documents }}
<li><a {{ if and (eq $.Slug .Slug) (eq $.Category $c.Slug) }}class="active"{{ end }} href="/{{$c.Slug}}/{{.Slug}}">{{.Title}}</a></li>
{{ end }}
</ul>
{{ end }}
</ul>
{{ template "toc" . }}
</nav>
<main role="main" class="flex-column col">
@ -190,10 +170,34 @@
{{ end }}
{{ define "toc" }}
<ul class="nav nav-pills flex-column">
<div id="search">
<input type="text" class="form-control" placeholder="Search" id="search-query" oninput="queryChange();" onblur="queryClose();">
<div id="search-hits" style="display: none;">
</div>
</div>
{{ range $c := .Documents.Categories }}
<div class="category">{{.Name}}</div>
<ul class="documents">
{{ template "toc-children" (params "Active" $.Slug "Documents" $.Documents "Slug" $c.Slug "Index" 0)}}
</ul>
{{ end }}
{{ range $c := .Categories }}
<div class="category">{{.Name}}</div>
<ul class="documents">
{{ range .Documents }}
<li><a {{ if and (eq $.Slug .Slug) (eq $.Category $c.Slug) }}class="active"{{ end }} href="/{{$c.Slug}}/{{.Slug}}">{{.Title}}</a></li>
{{ end }}
</ul>
{{ end }}
</ul>
{{ end }}
{{ define "toc-children" }}
{{ range .Documents.Children .Slug }}
<li><a id="{{ slugid .Slug }}" style="padding-left:{{ indent $.Index }}px" class="dropdown-item {{ if eq .Slug $.Active }}active{{ end }}" href="/{{.Slug}}">{{.Title}}</a></li>
{{ if expand .Slug $.Active }}
{{ template "toc" (params "Active" $.Active "Documents" $.Documents "Index" (inc $.Index) "Slug" .Slug) }}
{{ template "toc-children" (params "Active" $.Active "Documents" $.Documents "Index" (inc $.Index) "Slug" .Slug) }}
{{ end }}
{{ end }}
{{ end }}

3
cmd/docs/templates/toc.tmpl vendored Normal file
View File

@ -0,0 +1,3 @@
{{ define "main" }}
{{ template "toc" . }}
{{ end }}